【深入浅出jQuery】源码浅析--整体架构

})(window);

部分人初看 jQuery.fn.init.prototype = jQuery.fn 这一句都邑被卡主，很是不解。然则这灸┞锋的算是 jQuery 的绝妙之处。懂得这几句很重要，分点解析一下：

1）起重要明白，应用 $('xxx') 这种实例化方法，其内部调用的是 return new jQuery.fn.init(selector, context, rootjQuery) 这一句话，也就是构造实例是交给了 jQuery.fn.init() 办法去完成。

2）将 jQuery.fn.init 的 prototype 属性设置为 jQuery.fn，那么应用 new jQuery.fn.init() 生成的对象的原型对象就是 jQuery.fn ，所以挂载到 jQuery.fn 膳绫擎的函数就相当于挂载到 jQuery.fn.init() 生成的 jQuery 对象上，所有应用 new jQuery.fn.init() 生成的对象也可以或许拜访到 jQuery.fn 上的所有原型办法。

3）也就是实例化办法存在这么一个关系链

jQuery.fn.init.prototype = jQuery.fn = jQuery.prototype ;
new jQuery.fn.init() 相当于 new jQuery() ;
jQuery() 返回的是 new jQuery.fn.init()，而 var obj = new jQuery()，所以这 2 者是相当的，所以我们可以无 new 实例化 jQuery 对象。

jQuery 办法的重载

jQuery 源码晦涩难读的另一个原因是，应用了大年夜量的办法重载，然则用起往来交往很便利：

// 获取 title 属性的值  
$('#id').attr('title');  
// 设置 title 属性的值  
$('#id').attr('title','jQuery');  
   
// 获取 css 某个属性的值  
$('#id').css('title');  
// 设置 css 某个属性的值  
$('#id').css('width','200px');

// 接收一个字符串，个中包含了用于匹配元素集合的 CSS 选择器  
jQuery([selector,[context]])  
// 传入单个 DOM   
jQuery(element)  
// 传入 DOM 数组  
jQuery(elementArray)  
// 传入 JS 对象  
jQuery(object)  
// 传入 jQuery 对象  
jQuery(jQuery object)  
// 传入原始 HTML 的字符串来创建 DOM 元素  
jQuery(html,[ownerDocument])  
jQuery(html,[attributes])  
// 传入空参数  
jQuery()  
// 绑定一个在 DOM 文档袈湄入完成后履行的函数  
jQuery(callback)

以读源码的时刻，很重要的一点是结合 jQuery API 进行浏览，去懂得办法重载了若干种功能，同时我想说的是，jQuery 源码有些办法的实现特别长且繁琐，因为 jQuery 本身作为一个通用性特别强的框架，一个办法兼容了很多情况，也许可用户传入各类不合的参数，导致内部处理的逻辑十分复杂，所以当解读一个办法的时刻感到到了明显的艰苦，测验测验着彪炳卡壳的那段代码本身，站在更高的维度去思虑这些复杂的逻辑是为了处理或兼容什么，是否是重载，为什么要如许写，必定会有不一样的收成。其次，也是因为这个原因，jQuery 源码存在很多兼容低版本的 HACK 或者逻辑十分晦涩繁琐的代码片段，浏览器兼容如许的大年夜坑极其轻易让一个前端工程师不克不及学到编程的精华，所以不要太执着于一些界线料，即使兼容性很重要，也应当适度进修懂得，适可而止。

jQuery.fn.extend 与 jQuery.extend

extend 办法在 jQuery 中是一个很重要的办法，jQuey 内部用它来扩大静态办法或实例办法，并且我们开辟 jQuery 插件开辟的时刻也会用到它。然则在内部，是存在 jQuery.fn.extend 和 jQuery.extend 两个 extend 办法的，而区分这两个 extend 办法是懂得 jQuery 的很关键的一部分。先看结论：

3/10 首页上一页 1 2 3 4 5 6 下一页尾页

　　推荐阅读

　　深度学习训练时 GPU 温度过高？输入这几行命令就能迅速降温

【技巧沙龙】AI开辟者拭魅战营-7分钟打造1个定制技能。7月22号，我们等你一路！新买回来的不带水冷公版GPU，在满负载运行的时刻，温度大年夜室温立时飙升到85度，并且模型练习不是几分钟>>>详细阅读

本文标题：【深入浅出jQuery】源码浅析--整体架构

地址：http://www.17bianji.com/lsqh/36245.html

1/2 1