javascript - 包装库部分的代码构造是什么，它有什么用？

Question

我模仿了一个库并能够编写以下代码。此代码创建了 'c' 对象，该对象分配了 'a' 函数。因此，要调用 'a'，我必须编写 c.a()。

此外，我还能够向此 'c' 对象添加更多功能。我想了解这段代码中发生了什么。它看起来不像普通的面向对象编程。这种javascript编程叫什么？

var c = (function(c) {
    if (c === undefined) {
        c = {};
    }

    function a() {
        alert(1);
    }
    c.a = a;
    return c;
}(c));

Answer 1

这是一个模块模式。您会看到该模式的许多变体，因此了解实际情况非常重要，您不能只模仿一个。

这段代码的重点是完成一个对象c(通常是你的全局库)。您的应用程序中可能有许多相似的代码片段，所有构建 c 的片段，可能每个片段都在其自己的文件中。

如果作为参数传递给函数的库对象 c 尚不存在 ( c === undefined )，则会创建它。这使得不依赖于执行顺序或预执行文件成为可能。

作业的右边部分是 IIFE (Immediately Invoked Function Expression)，即立即调用的函数。这种构造的优点是它创建了一个范围，可以在其中声明变量(例如 a 函数)而不会污染外部(全局)范围。这里的观点没有实际意义，因为 a 无论如何都是外部化的，但模块通常依赖于几个内部(私有(private))函数和变量。

可能需要解释的细节:所有这些文件看起来像，它们定义了一个新变量c，但这里没有问题，即使文件是串联的:a var 语句不会定义一个新变量，如果它已经存在(一个变量是为整个范围定义的，这里是全局的，甚至在声明点之前)。

另一种写法是

var c = c || {}; // ensure the c variable is defined, and initialize its value it if necessary

(function() { // let's use an IIFE to have a protected scope and not pollute the global one
  function a() {
    alert(1);
  }
  c.a = a; // let's augment c
})();

这个可能更清楚

• 它显式地分离了两个步骤(c 初始化和 c 使用 IIFE 完成)
• 它不依赖于两个同名的c变量
• 它不那么冗长