jQuery 总体源码结构笔记-优快云博客

本文链接：https://blog.youkuaiyun.com/chenjiaxiang520/article/details/53485665

本文详细解析了jQuery的源码结构，介绍了其自调用函数的最外层封装方式，如何通过构造函数创建实例，以及如何简化标识符并将其赋值给全局变量。通过本文，读者可以了解到jQuery的核心组织方式及其设计原理。

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

jQuery 总体源码结构笔记

// 最外层是一个自调用函数
( function( window,undefined ){
   // 声明一个jQuery构造函数
   var jQuery = ( function(){
        // 将jQuery构造函数覆盖改成实例
        var jQuery = function(){
            // 说明我们使用的jQuery对象并不是直接使用jQuery构造函数构造的，只是两者的原型一样而已
            return new jQuery.fn.init();   
        }
        // 将jQuery.prototype简写为jQuery.fn
        jQuery.fn = jQuery.prototype = {
            constructor = jQuery,
            // 初始化jQuery对象
            init: function(){...}
        }
        // 构造jQuery实例的时候重新制定了init函数的原型
        jQuery.fn.init.prototype = jQuery.fn;
        jQuery.extend = jQuery.fn.extend = function(){...};
        jQuery.extend({...});
        return jQuery;
   } )();
   // 添加全局变量$和jQuery,两者都是一个实例，并不是构造函数
    window.jQuery = window.$ = jQuery;  
} )(window);

总结： 1.在函数jQuery()函数内部使用new创建一个实例；
2.jQuery实例不是直接有jQuery函数构造，而是通过一个init函数间接实现，为了不实例化jQuery函数中那些在内部使用的方法和属性；
3.对一些太长的标识符进行简缩比如jQuery.fn,$;
4.将jQuery实例付给全局变量jQuery
5.传入window对象，变成局部变量，来缩短查找window对象时候搜索的作用域链长度。
6.设置形参undefined可以起到缩短搜索的作用域链，而不传入参数是因为，外部的undefined可能存在被个人修改，不传入时它的默认值就是undefined，这一最保险