Javascript中的命名空间冲突问题 [英] Namespace Conflict Issue in Javascript
问题描述
我有2个javascript文件(Web引用),具有相同的命名空间和方法名称,但实现方式不同。我需要调用它们并根据2个版本文件显示数据。
场景:显示生产版本参考和开发版本参考中的内容,以便我们可以确定生产和开发版本之间的差异。 注意: 我们不应该更改任何版本文件的名称空间。
Hi,
I am having 2 javascript files (web references) with same namespaces and method names but implementation is different. I need to call each of them and display the data based on 2 version files.
Scenario: Display the content from Production version Reference and Development version Reference, so that we can identify the differences between Production and Development versions. Note: We should not change the namespaces of any version file.
// namespace & method names are common for both javascript versions But Implementation is different
// v1.js
// v1.js
var Site = {};
Site.Style = {};
Site.Style.data = function Getdata() {
return 'Old Version Data';
}
Site.Style.version = function GetVersion() {
return '1.0.0.0';
}
// v2.js
// v2.js
var Site = {};
Site.Style = {};
Site.Style.data = function Getdata() {
return 'New Version Data';
}
Site.Style.version = function GetVersion() {
return '2.0.0.0';
}
// HTML页面
// HTML Page
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="js/v1.js" type="text/javascript"></script>
<script src="js/v2.js" type="text/javascript"></script>
<script type="text/javascript">
function myFunction() {
var olddata = Site.Style.data();
var newdata = Site.Style.data();
document.getElementById('oldDataDiv').innerText = olddata;
document.getElementById('newDataDiv').innerText = newdata;
}
</script>
</head>
<body onload="myFunction();">
<form id="form1" runat="server">
<div id='oldDataDiv'></div>
<div id='newDataDiv'></div>
</form>
</body>
</html>
推荐答案
我认为没有任何直接的方法来实现你的目标。但 JavaScript中的多态性 [ ^ ]可能是正确方向的第一步
I don't think there is any straight forward way of achieving your objectives. But Polymorphism in JavaScript[^] could be the first step in the right direction
请参阅我对这个问题的评论:由于我试图在评论中解释的原因,整个方法对我来说都很有问题。
我可以解释一下介绍的想法在Javascript中使用命名空间,也许它可以在此时或将来帮助您。
例如,你有两个函数:oneAction
和anotherAction
,并想象最终你需要不同版本的它们。考虑这个脚本:
Please see my comments to the question: the whole approach looks very questionable to me, due to the reasons I tried to explain in my comments.
I can explain the idea of introduction of "namespacing" in Javascript, maybe it can help you at this time or in future.
For example, you have two functions:oneAction
andanotherAction
, and imagine that eventually you need different versions of them. Consider this script:
<script>
firstNamespace = {
oneAction: function() {
alert("one action 1");
},
anotherAction: function() {
alert("another action 1");
}
};
secondNamespace = {
oneAction: function() {
alert("one action 2");
},
anotherAction: function() {
alert("another action 2");
}
};
//now try:
firstNamespace.oneAction();
secondNamespace.oneAction();
firstNamespace.anotherAction();
secondNamespace.anotherAction();
</script>
您正确隔离了一些功能。原则上,您可以执行类似于大量Javascript指令的操作(此处,您需要了解Javascript中的声明与某些指令没有区别,它们是在运行时创建的),整个库。我演示的技术是最基本的,对这个想法有不同的改进。
请参阅:
http://addyosmani.com/blog/essential-js-namespacing [ ^ ],
http://javascriptweblog.wordpress.com/2010/12/07/namespacing-in-javascript [ ^ ],
http://thanpol.as/javascript/development-using-namespaces [ ^ ],
JavaScript中的命名空间 [ ^ ]。
You got proper isolation of some set of functions. In principle, you can do something similar to a big set of Javascript instructions (here, you need to understand that declarations in Javascript are no different from some instructions, they are created during runtime), a whole library. The technique I demonstrated is the most basics, there are different refinements of the idea.
Please see:
http://addyosmani.com/blog/essential-js-namespacing[^],
http://javascriptweblog.wordpress.com/2010/12/07/namespacing-in-javascript[^],
http://thanpol.as/javascript/development-using-namespaces[^],
Namespaces in JavaScript[^].
也许我错过了什么,但是有没有什么可以阻止你制作第一个脚本创建的Javascript对象的副本并在以后使用它:
Perhaps I'm missing something, but there's nothing stopping you from making a copy of the Javascript object created by the first script and using it later:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="js/v1.js" type="text/javascript"></script>
<script type="text/javacript">
// make a copy of the first Site object
var Site1 = Site; Site = null;
</script>
<script src="js/v2.js" type="text/javascript"></script>
<script type="text/javascript">
function myFunction() {
var olddata = Site1.Style.data(); // use the first script's Site object
var newdata = Site.Style.data();
document.getElementById('oldDataDiv').innerText = olddata;
document.getElementById('newDataDiv').innerText = newdata;
}
</script>
</head>
<body onload="myFunction();">
<form id="form1" runat="server">
<div id='oldDataDiv'></div>
<div id='newDataDiv'></div>
</form>
</body>
</html>
这篇关于Javascript中的命名空间冲突问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!