JQuery源码整体架构分析

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接： https://blog.csdn.net/weixin_45674894/article/details/102576784

JQuery源码整体架构分析

本文分析的jq版本为1.7.0

//首先把jquery架构内部代码全部删除
(function () {
    
})()
//很明显可以看出这是个函数的自调用

• 函数自调用的好处:形成沙箱模式,防止全局变量污染问题

//我们都知道在使用jquey功能的时候可以用$ 和 jQuery作为标识符,那他们是哪里来的?
(function (window, undefined) {

	var jQuery = function () {
    	console.log("jquery is ok");
	}
	
	//在局部中可以调用这个函数
	jQuery();//jquery is ok
	
})(window)

//如果在全局中调用,没有全局变量jQuery
jQuery()//报错

• 传参window的好处

1. 可以减少对window的搜索过程 (在内部传参window只需要在函数中搜索一次,如果不传参数需要在全局在搜索一次)
2. (可以把形参window改为a)代码在进行压缩的时候，有利于代码压缩

(function (window, undefined) {
	 //相当于var window = 实参 window;
	 
	var jQuery = function () {
    	console.log("jquery is ok");
	}
	
	//在局部中可以调用这个函数
	jQuery();//jquery is ok

	// window 在js中是个全局对象，也是顶级对象
	// 把jQuery函数暴露到全局中(在自调用函数的外面使用)
	// 给window对象添加jQuery属性和$属性，值是jQuery函数
	window.jQuery = window.$ = jQuery; 
})(window)

//window.jQuery() //window可以省略
//window.$() 

jQuery();//jquery is ok
$();//jquery is ok

• 传参undefined的作用’

// undefined 是一种数据类型， undefined的数据类型的值是自身undefined。
// 在IE678中，undefined这个数据类型的值是可以进行修改的。
undefined = 13;
console.log(undefined); // IE678值13 // 谷歌中值 undefined

(function (window, undefined) {
    //相当于 var undefined = 实参,此时实参没传,值为undefined;
    //只要在自调用函数中使用到了undefined,在函数内部能找到undefined,并且值一定为undefined
    
    console.log(undefined); //IE678值 undefined  谷歌中值 undefined
    
})(window)