假设我有一个 javascript 库(.js 文件),它可以执行类似在页面上的 div 元素上绘制 SVG 图形之类的操作。该库应用业务逻辑,并为单击元素等创建事件处理程序。伪代码可能如下所示:
myLib = {};
myLib.dummy = null;
mylib.doStuff = function(divID) {
//divID is the ID of the element on which SVG graph will be drawn
//does graph drawing and sets up myLib.dummy for feedback or such, e.g.:
myLib.dummy = $("#divID").width();
}
我的问题是:如何处理这样的情况:我想将此脚本应用于同一页面上的 2 个(或更多)元素,然后拥有与每个元素相关的单独的 myLib“实例”。我知道我不能从页面上这样调用它:
myLib.doStuff('topDiv'); //myLib.dummy will be say 400;
myLib.doStuff('bottomDiv'); //myLib.dummy will be say 600;
使用上面的代码,我将无法再访问属于 ID = 'topDiv' 的 div 的 myLib.dummy,因为它们使用相同的命名空间。
我怀疑我错过了设计模式,或者答案可能只是命名空间的情况。
如果有任何建议或帮助,我将不胜感激。
最佳答案
function makeALib() {
var myLib = {};
myLib.dummy = null;
mylib.doStuff = function(divID) {
//divID is the ID of the element on which SVG graph will be drawn
//does graph drawing and sets up myLib.dummy for feedback or such, e.g.:
myLib.dummy = $("#divID").width();
}
return myLib;
}
var libA = makeALib();
var libB = makeALib();
libA.doStuff('topDiv');
libB.doStuff('bottomDiv');
有许多不同的领域可以引入分离或间接。在不了解更多有关您的使用环境的情况下,很难说出什么是好的选择。但以上只是众多工作选择之一。
关于用于多个页面元素的 javascript Worker,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12945999/