Javascript中的匿名函数与封装介绍

JavaScript中的匿名函数与库封装介绍

如果你曾对JavaScript库如jQuery、Backbone和Underscore的封装感到困惑，那么这篇文章将为你揭示其中的奥秘。我们将深入如何利用匿名函数进行库封装，以确保代码的纯净性和互不干扰性。

让我们从基础开始。创建一个自调用的匿名函数，并传递window对象作为参数，这样做的主要目的是为了防止代码被其他代码污染，同时也不污染其他代码。这是一种常见的封装模式，确保了我们的库代码在全局命名空间中保持独立。

以jQuery为例，其封装方式非常典型。在早期版本（如1.7.1）中，jQuery的封装代码大致如下：

```javascript

(function( window, undefined ) {

var jQuery = (function() {

console.log('hello');

});

window.jQuery = window.$ = jQuery;

if ( typeof define === "function" && define.amd && define.amd.jQuery ) {

define( "jquery", [], function () { return jQuery; } );

}

})( window );

```

在这段代码中，`console.log('hello');`是为了验证封装是否按预期工作。一旦封装完成，我们就可以通过`window.$`或`window.jQuery`来调用jQuery。

我们可以模仿这种封装方式，创建一个类似的封装：

```javascript

(function(window, undefined) {

var PH = function() {

// 你的代码在这里

}

})(window)

```

相比于上面的示例，这种封装方法只是省略了定义全局变量和异步支持的部分。如果你需要了解更多关于jQuery的封装方式，那么你可以查看的jQuery代码。其中有一种神奇的判断方法，用于判断是否已经定义了jQuery，如果没有则定义一个新的jQuery对象。这种方法的目的是确保我们的库可以在已经定义了其他库的环境中正常工作，而不会发生冲突。

除了jQuery，Backbone和Underscore等库也有各自的封装方式。这些库的封装方式都有其独特之处，但核心思想都是保持代码的纯净性和互不干扰性。通过对这些库的封装方式的研究，我们可以更深入地理解JavaScript的编程模式和最佳实践。希望这篇文章能为你带来启发，帮助你更好地理解和使用JavaScript的匿名函数和库封装。经过深入研究，我打开了版本2.1.1的jQuery和Backbone，发现它们都在不断地发展和完善。

来看jQuery。在打开2.1.1版本后，我发现除了增加许多实用功能外，其核心思想依然保持不变。其代码结构考虑到了不同运行环境的需求，特别是针对Node.js环境。当在浏览器环境下运行时，它能够通过判断module的类型来决定如何加载。当在Node.js环境下运行时，jQuery能够判断是否存在window对象以及document对象，从而确保在各种环境下都能正常运行。这也表明，随着使用场景的增加，jQuery也在逐渐变得更为臃肿。这种变化都是为了适应更多的运行环境，提供更为稳定的服务。

再来看Backbone。Backbone的封装更为灵活，它支持多种不同的加载方式。当使用AMD规范时，Backbone可以与其他模块一起异步加载。它也支持CommonJS规范，可以在Node.js环境下运行。Backbone的代码中也明确体现了其对jQuery和underscore的依赖。特别的是，Backbone原生支持requirejs，这一点从其代码中的define函数就可以看出。

无论是jQuery还是Backbone，都在不断地发展和完善，以适应更多的使用场景和需求。它们的代码结构都充分考虑了运行环境，提供了多种加载方式，以确保在各种环境下都能正常运行。这也反映了开源软件的特性，即根据用户的需求和使用场景来不断完善和优化。这种开放性和灵活性，使得这些框架能够持续发展和受到广大开发者的喜爱。

对于Backbone依赖jQuery和underscore的情况，也反映了其设计理念。Backbone是建立在jQuery和underscore之上的，它们为Backbone提供了很多基础功能，如DOM操作、事件处理等。Backbone也提供了一套更为强大的数据管理和视图层解决方案，使得开发者能够更方便地构建复杂的前端应用。这种组合使用的方式，既充分利用了各个框架的优点，又避免了重复开发，提高了开发效率和代码质量。深入Underscore的封装艺术

当我们Underscore这个强大的JavaScript库时，我们会发现它巧妙地占领了一个特殊的符号“_”。让我们深入理解其封装机制。

在代码的开端，我们看到了一个自执行的匿名函数，并通过 `call(this)` 方法将其绑定到全局对象上。这是一种常见的JavaScript库封装模式，旨在确保库在任何环境下都能正常工作。

接下来，我们看到了一个名为 `_` 的函数定义。这个函数是Underscore库的核心部分，它接受一个对象 `obj` 作为参数。如果这个对象已经是 `_` 实例，函数会直接返回该对象。如果当前上下文不是 `_` 实例的实例，则会创建一个新的 `_` 实例并返回。否则，它将对象 `_wrapped` 属性设置为传入的 `obj`。这种设计确保了库的灵活性和可扩展性。

接下来，我们看到了几个条件判断语句，用于在不同的环境中导出 `_` 函数。如果 `exports` 和 `module` 变量存在并且 `module.exports` 存在，那么将 `_` 函数赋值给 `module.exports` 和 `exports._`。这是Node.js环境下的常见做法。如果环境不支持模块（例如浏览器环境），则将 `_` 函数绑定到全局对象上（在这里是 `root._`）。

代码检查是否定义了名为 `define` 的函数并且该函数具有 `amd` 属性。如果是，则使用AMD（Asynchronous Module Definition）规范定义了一个名为 `underscore` 的模块，并返回 `_` 函数。这意味着Underscore库可以在支持AMD的环境中作为模块使用。

Underscore库的封装设计精巧且高效，确保了其在各种环境中的兼容性和可用性。通过深入了解其工作原理，我们可以更好地欣赏和理解这个库的强大和灵活性。在代码的某个角落，我们看到了 `cambrian.render('body')` 这一行代码，虽然它的具体作用在这段代码中并未明确说明，但我们推测它可能是用于渲染页面元素或其他相关操作的一部分。