1、突然对jQuery的心血来潮

起因

趁着饿百新零售项目一期的终止,算是暂时从加班的修罗场里面解放出来了,于是就想搞点事情,正雅观项目js库的时候发现了躺在角落的jQuery,想到当初看源码的时候断断续续的没有看完一贯是内心的缺憾,于是下定狠心把这些缺憾弥补了。

阅读情势

本人下载的是jQuery
3.2.1本子,差不离瞄了一眼,一万行多或多或少,由于源码太多,怕见到最终看乱了于是选拔看一点删或多或少的法门,优先看那个并未耦合的静态函数,所以并从未提前制定阅读协会,如若有对象也在看自己那篇作品的话可以也应用我的不二法门来读书,可能会更鲜Bellamy(Bellamy)些。假诺读者刚接触前端不就引进先去看完《js高程》了解了js的基本概念和艺术再来继续阅读。

开始

一、jQuery的结构

jQuery的最外层是一个立即执行函数,那措施在原来没有es6的业内模块化方法往日,大约拥有的js库函数都利用的这种办法来给自己定义全局变量的,利用的是js的闭包原理。js在一发端加载jQuery的时候会及时实施这一个函数,然后使用闭包原理将jQuery本身存在内存中,那样就可见确保jQuery对象在全局访问到了。

jQuery在一始发就应用了最严格的严格方式来让代码尤其规范,那样就会让代码减弱失误的空子。

"use strict"

 

说到jQuery的布局,有必不可少说说3.0+版本和老版本还有有一对不一样等的地点的。直接上图:

图片 1

只要把前日的jQuery代码和很久此前的本子进行自查自纠的话你会发觉结构层有了很大的更动,老版本的jQuery的最外层并不曾如此多层的结构,只是一个眼看执行函数,然后函数的末梢传入了唯一一个变量window,当时的简易结构是出于jQuery库只是选择在浏览器中,所以全局对象只会是Windows,而随着前端的便捷进步,出现了nodejs和差别的模块化规范,jQuery也与时俱进加了那地方的兼容性方案。在及时施行函数最终有一个:

typeof window !== "undefined"? window : this

以此是来判断函数开端化时传出的全局变量是还是不是来自于浏览器的window,如果是就扩散window,倘若不是就不胫而走未知的大局参数。前面的function则是大家平时用的所有jQuery内定义的法门。

jQuery开始化函数的最顶层有一个判定:

typeof module === "object" && typeof module.exports === "object" 

其一是来不相同是还是不是来自于类似遵循CommonJS规范,module存在切module.exports若是一个object对象。因为在CommonJS中对外暴漏借口就是看似module.exports.addX

addX。nodejs中使用的就是CommonJS规范,在上图中得以看来依照是还是不是具备CommonJS规范jQuery的先河化参数并分歧。

图片 2

此地正常的浏览器进来在创设时并未第三个参数,那么那么些参数是做什么样的吗?

图片 3

将jQuery源码拉到底部,你会发现最后面有一个上图那样的函数,注释中说的很详细了,那么些参数就是来判定是还是不是要将jQuery和$那四个至关紧要字绑定到浏览器全局window上的。