JavaScript 中的命名空间

我发现 JavaScript 中最令人困惑的概念之一就是命名空间。因此，我学习了相关知识，并想把笔记分享给所有对此感到困惑的人。

当我们开发应用程序时，随着应用程序的增长和复杂性的增加，很可能在某个时候会出现两个变量或函数具有相同名称的情况，从而导致冲突。

为了避免这种情况，我们可以使用命名空间，它会为变量和函数创建一个局部作用域。JavaScript 实际上并没有像其他编程语言那样的命名空间，所以我们将看到一些实现相同效果的替代方法。模拟命名空间最常见的方法是通过对象。

我们来谈谈一些你经常可以使用，而且经常看到其他人使用的方法。

1. 直接委派

var webApp = {}

webApp.id = 0;

webApp.next = function() {
    return webApp.id++;  
}

webApp.reset = function() {
    webApp.id = 0;   
}

请注意，“id”或“next”是通用名称，在大型 Web 应用程序中很容易重复出现。与其在变量中添加更多单词（例如“idOfwebApp”）并将其置于全局作用域中，不如将它们放在一个对象中，该对象将保存有关 Web 应用程序的所有信息。

所以，让我们分析一下上面的代码示例，这样你就能自然而然地理解下面的其他代码了。
仔细观察，你会发现它实际上是一个对象，包含一个名为 id 的键和两个函数。
如果我们这样写：

console.log(webApp.next());
//output will be 0 itself, just like an object.

你可以用这个代替那些冗长的名称。

2. 使用对象字面量表示法

var webApp = {

    id: 0,

    next: function() {
        return this.id++;   
    },

    reset: function() {
        this.id = 0;    
    }
}

这是我们最常看到的，也是我们最常用的命名空间。

3. 模块化模式

var webApp = (function() {

    var id= 0;

    return {
        next: function() {
            return id++;    
        },

        reset: function() {
            id = 0;     
        }
    };  
})(); 

事情到这里就变得棘手了！！！
对你来说一切都应该很清楚，但是那个“();”代表的是——自调用函数。

那么，为什么模块化方法比对象字面量方法更重要呢？

对象字面量表示法非常僵化——它只关注属性赋值，没有空间容纳任何辅助逻辑。此外，所有属性都必须初始化，属性值之间也难以相互引用。模块模式则完全克服了这些限制，并且还提供了隐私性这一额外优势。

结论

模块化方法适用于大型项目，且具有灵活性；而面向对象方法更适用于复杂度较低的小型项目和插件。

延伸阅读

• 阅读更多关于模块模式的内容

感谢阅读，希望你有所收获 :)
我发现了一些语法错误，哈哈，请在下方评论区指出。