(转)jquery的总体架构-优快云博客

本文链接：https://blog.youkuaiyun.com/iteye_10254/article/details/82009137

本文深入剖析了jQuery库的核心结构及其实现原理。通过解读jQuery的匿名函数包裹、命名空间处理方式及其如何成为window对象的属性等内容，帮助读者理解jQuery的设计思想。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Query是个出色的javascript库，最近结合它写javascript，看了下源码。

先从整体、全局的看，jQuery的源码几乎都在下面的代码中：

(function() {

//……

})();

第一个括号里面是个匿名函数，第二个括号表示马上执行第一个括号里面的代码。
首先明白，javascript里面是没有命名空间的，要保证你的javascript函数、对象与其他的不冲突，这里用了javascript的一个技巧：你的所有javascript函数、对象都在一个匿名函数里面定义，确保了所定义的函数、对象的有效范围，起到了命名空间的作用。既然作用范围在这个匿名函数中，怎么被别人使用呢?下面看它的下面代码：

var jQuery = window.jQuery = function(selector, context) {
//……
};

这里让jQuery库中最重要的对象jQuery成为了window对象的一个属性，这样就可以在其他地方像使用 document(document也是window的一个属性)一样使用jQuery了。也许使用过jQuery的朋友惊讶－我没有使用jQuery对象，一直使用$的。没错，那是jQuery的同名对象：

window.$ = jQuery;

现在明白了吧。

这个库的结构是这样的:

1. (function(window, undefined){
2. var document = window.document;
3. var jQuery = ...
4. ...
5. ...
6. })(window);

(function(window, undefined){ var document = window.document; var jQuery = ... ... ... })(window);

整个脚本是一个匿名函数(暂时叫它mainFn吧),函数被加载的时候便开始执行,mainFn可以接收两个参数,执行时只传递一个参数window.

view plaincopy to clipboardprint?

1. 具体解释下这个写法的意思:
2. window 函数执行时会传入window,这个传入的window是全局对象(通常为Window)的
3. 一个属性且window=this,而传入mainFn函数中作为其参数时,它会被存储在
4. mainFn的调用对象中.在原型链中查找变量的策略是(非嵌套函数):先查找调用
5. 对象,再查找全局对象,所以这使得整个mainFn中使用的window时查找效率更高
6. undefined 由于执行时并未传递第二个参数,故变量undefined的值为undefined.早期版
7. 本的浏览器中全局对象可能没有undefined属性,所以不能直接使用它.通常避免
8. 这个问题的写法是 window.undefined = window.undefined