Question

我有一堆String和其他JavaScript类型的扩展方法，它们现在位于全局命名空间中。组织这些扩展方法的最佳做法是什么？我应该将它们封装在命名空间中吗？如果是的话，如何实现呢？谢谢！

Answer 1

Namespace your JavaScript if you need to refer to it elsewhere.

  // define your global namespace
  var Extensions = Extensions || {};

  // add modules to it
  Extensions.String = function() {
    var myPrivateProperty = 2;
    var myPublicProperty = 1;

    var myPrivateFunction = function() {
      console.log("myPrivateFunction()");
    };

    var myPublicExtension = function() {
      // this extension is being called, now what?
      console.log("myPublicExtension()");
    };

    // this object will be returned, giving access to public vars/methods
    return {
      myPublicProperty: myPublicProperty,
      myPublicExtension : myPublicExtension
    };
  }();

  console.log("Calling myPublicExtension()...");
  Extensions.String.myPublicExtension();

Anonymously scope JavaScript if you’re never going to call it elsewhere.

// This will keep your namespace clean
(function() {
    // here you can define your modules, functions, etc..

    var x = 123;
    console.log(x);

    // to make something global you can define it like
    window.globalVar = 5;
}());

或者您可以使用prototype扩展原生javascript对象，如下所示：

String.prototype.myExtension = function(p1, p2) {
    // here is your function
    return this + p1 + p2;
}

这样您就不需要定义名称空间了，您可以直接从扩展的任何对象调用扩展名：

var otherString = "mystring".myExtension(" is", " great!");
console.log(otherString);// mystring is cool

你可以用javascript中的任何对象

来做到这一点

修改

原型扩展不会污染全局命名空间，因为它们只能通过您扩展的对象访问。

如果您有许多扩展程序，请考虑将它们放入extensions.js这样的文件中，然后在需要这些扩展时将其添加到您的页面中。这样，extensions.js可以被浏览器缓存，并且可以更快地加载

Answer 2

有两种方法可以做到这一点：

封装在命名空间中（我认为保持整洁的最低限度）。自定义命名空间即：
```
window.MyNameSpace.trim = function(str) {
    return str.replace(/^\s+|\s+$/g, "");
}
```
（用一个字母替换MyNameSpace！用于Raphael的R，用于Leaflet的L等）
扩展原型！很多人会不同意这一点，但我认为如果它是你的网站没有任何伤害，你不会覆盖/与其他任何代码冲突：
```
String.prototype.trim = function () {
    return this.replace(/^\s+|\s+$/g, "");
};
```
我发现这个“更干净”，因为你没有传递不必要的参数......但同样，这是一个意见问题......这适用于任何内置类型。其他我认为应该遵循＃1

免责声明：来自This发布的代码

在JavaScript中组织扩展方法的最佳实践

2 个答案: