2010-06-13 96 views
9

在JavaScript中声明全局范围内的变量是一件坏事。所以我倾向于使用的代码包含命名空间JavaScript。分享JavaScript库的名称空间或使用您自己的名称空间?

似乎有采取这种两种不同的方法 -

  1. 将您的应用程序特定功能的图书馆命名空间例如$.myCarouselfunction
  2. 创建自己的名称空间例如MyApplication.myCarouselFunction

我想知道是否有更好的解决方案,或者他们是否倾向于在利弊方面接近。

我个人决定不去图书馆的原因是分离/隔离/缺乏与图书馆代码和可能共享该名称空间的潜在插件的冲突。有没有更多的这一点,我不考虑?

回答

1

我倾向于更喜欢自己添加自定义代码到库中。最大的原因是,使用语义在内置代码和我的自定义代码中保持一致。这就是说,我不能真正想到这种方法的任何技术优势或劣势。我认为你对冲突的担忧是有效的,虽然可能不太可能(如果最终出现与你的一个自定义函数冲突的组件/模块,很可能是因为你正在用别人的代码替换你的代码)。

1

正确的选择取决于您的目标环境。你在两个命名空间之间进行选择,这两个命名空间可能会变得杂乱无章。如果您认为在库命名空间中遇到冲突的可能性更大,则应使用窗口命名空间。如果您认为窗口命名空间更可能混乱,请选择库命名空间。

无论哪种情况,您通常只应创建一个“全局”名称。换句话说,如果要将函数放入库的名称空间中,最好不要将其命名为$ .myFn。将其命名为$ .yaya3.myFn,然后在您调用myFn多次的任何上下文中缓存本地引用。

参考你的功能是通过它生活在作为参数传递给一个匿名函数命名空间的一个最佳实践:

(function (yaya3) { 
var myFn = yaya3.myFn; 
myFn("frobnard!"); 
}(window.yaya3)); // you could instead pass $.yaya3 or YUI.namespace("yaya3") here 

这使得如果你发现你需要移动更容易到不同的命名空间。

+0

我不我真的看不到这会给你带来什么。首先,作为一个图书馆维护者,除非它不会向后兼容,否则我不会创建yaya4,在这种情况下,您必须审核代码;其次,如果您确实想要更改为yaya4,如果您只是将所有对yaya3的引用替换为yaya4,那么这些代码是不是更具可读性? – nas 2010-07-03 08:45:05

16

我认为选择这种东西最重要的是语义

您的函数/类是扩展还是依赖于库特定的功能?把它放在库名字空间中。

是你的函数/类库独立吗?在这种情况下,最好将它放在自定义命名空间中。这样可以在原来使用它的库之外重用代码。

+0

我同意,但请记住,通过使用名称空间可以避免潜在的名称冲突,特别是在库更新之后,尤其是在可以重新定义变量的情况下,所有内容都会像没有任何事情发生一样继续。 – user347594 2010-07-07 15:15:23

+0

+1这个答案对我来说是确定的赢家。 – Fenton 2010-07-07 16:50:17

2

如果您曾尝试使用相同的命名空间引入多个库,那么可能会发生碰撞的可能性会很惊人,并且可能会令人非常沮丧,因为这些类型的错误常常令人惊讶并且很难调试方式。我认为你对冲突的直觉是正确的,关于是定义你自己的命名空间还是重用别人的最重要的考虑是尊重命名空间的所有权。这意味着,除非您与维护另一个命名空间的人员联系,并且他们知道您在做什么,否则使用您自己的命名空间是一个好主意。

如果您决定忽略命名空间所有权的建议并在现有名称空间(针对语义或其他)定义API,则需要考虑的一件事是使用导出函数来检测错误。基本上,你可以先定义你自己的命名空间的东西,然后将其导出到目标命名空间,沿着线:

MyApplication.exportName = function(objToExportTo, name, obj) { 
    if (objToExportTo[name] === undefined) { 
    objToExportTo[name] = obj; 
    } else { 
    // Possibly assert! 
    } 
}; 

MyApplication.myCarouselFunction = function() { ... }; 
MyApplication.exportName($, 'myCarouselFunction', MyApplication.myCarouselFunction); 
3

个人而言,我喜欢这种方法:

(function(namespace) { 

function myPrivateFunction(){}; 

namespace.myPublicFunction = function(){}; 

})($); // passing the $ namespace, but if it clutters, 
     // we can change it to something else 
相关问题