《jQuery源码解析》读书笔记（第一章：总体架构）

第1章　总体架构 2

• 1.1　设计理念 2

  • write less, do more
  • 核心特性
    • 兼容主流浏览器，并且支持IE6.0
    • 独特的链式语法
    • 短小清晰的多功能接口
    • 高效灵活的CSS选择器，并且可对CSS选择器扩展
    • 便捷的插件扩展机制和丰富的插件

• 1.2　总体架构 2

  jQuery模块分为三个部分：入口模块、底层支持模块、功能模块。

  

  各个模块的功能在后面的章节中会一一讲到。

  整体的代码结构如下：

  (function(window, undefined) {
      // 构造 jQuery 对象
      var jQuery = (function() {
          var jQuery = function(selector, context) {
              return new jQuery.fn.init(selector, context, rootjQuery);
          };
  
          return jQuery;
      })();
  
      // 工具方法 Utilities
      // 回调函数列表 Callbacks Object
      // 异步队列 Defferred Object
      // 浏览器功能测试 Support
      // 数据缓存 Data
      // 队列 Queue
      // 属性操作 Attributes
      // 事件系统 Events
      // 选择器 Sizzle
      // DOM遍历 Traversing
      // 样式操作 CSS（计算样式、内联样式）
      // 异步请求 Ajax
      // 动画 Effects
      // 坐标 Offset、尺寸 Dimensions
  
      window.jQuery = window.$ = jQuery;
  })(window);
  

• 1.3　自调用匿名函数 4

  (function(window, undefined) {
      // 构造 jQuery 对象
      var jQuery = ..
  
      // ...
  
      window.jQuery = window.$ = jQuery;
  })(window);
  

  • 为什么用上面这个自调用匿名函数？

    • 不会受已有变量名称干扰
    • 不会干扰其他代码

  • 为什么要为自调用匿名函数设置 window 对象，并传入 window 对象？

    • 缩短查找作用域链，可以更快地访问 window 对象

    • 将window作为参数传入，可以在压缩时进行优化

      在压缩文件 jQuery-1.7.1.min.js 中可以看到下面的代码：

      (function(a, b){ ... })(window);
      

  • 为什么要为自调用匿名函数传入参数 undefined？

    undefined 是 window 的一个属性：'undefined' in window // true

    • 缩短查找作用域链
    • 因为 undefined 在某些浏览器下可以被重写。这样写就可以确保 undefined 值还是 undefined

  • 自调用匿名函数前面后面最好都有分号
    最好不要省略，如果省略，则：自调用匿名函数的第一对括号会被当做是函数调用

    var n = 1
    ( function(){} )()
    // TypeError: number is not a function
    

• 1.4　总结 6