摘要：原型数据类型检测指向绑定执行环境深拷贝三源码分析匿名自执行函数和闭合包这里形成闭包保护变量不被直接访问和篡改保证框架完整性，闭包的作用域内也会帮助缓存变量值。
一、导读
文章作为学习笔记的形式，记录学习的一点体会和原理知识，如有错误欢迎指正。 本文根据一些简单的jQuery源码入手分析一个框架从哪方面入手，js在底层做了那些事， 了解他的设计思想，jquery整体架构还是依托于js，在js基础上封装自己的方法，在解 读设计过程中更容易了解js的一些原理。二、知识点列举
匿名自执行函数和闭合包。
原型
数据类型检测
this指向
绑定执行环境（call）
深拷贝
三、源码分析//1.匿名自执行函数和闭合包 这里形成闭包保护变量不被直接访问和篡改保证框架完整性，
//闭包的作用域内也会帮助缓存变量值。
(function(root){
//这里其实是需要了解实例化一个构造函数时实际内容是他的prototype
var jQuery=function(){
return new jQuery.prototype.init();
}
jQuery.fn=jQuery.prototype={
init:function(){
},
toString:Object.prototype.toString,//需要借助Object原型上的toString
hasOwn:Object.prototype.hasOwnProperty,
typeClass:{//toString 返回当前检测对象的属性以对象键的形式返回
"[object Boolean]" : "boolean",
"[object Number]" : "number",
"[object String]" : "string",
"[object Function]" : "function",
"[object Array]" : "array",
"[object Date]" : "date",
"[object RegExp]" : "regExp",
"[object Object]" : "object"
},
//这里call 方法把Object原型上的toString的执行环境替换到 obj下，因为对象的
//prototype上的toString 方法才会返回变量类型，
//如果根据原型链的规律，函数或数组实例化时的会有自己的toString;
isObject:function(obj){
return this.typeClass[this.toString.call(obj)]=="object";
},
isFunction(fun){
return this.typeClass[this.toString.call(fun)]=="function";
},
type :function(obj) { //返回值类型
return obj == null ? String(obj) : this.typeClass[toString.call(obj)] || "object";
},
isWindow : function(obj) { //判断是不是window
return obj && typeof obj === "object" && "setInterval" in obj;
},
//先看支不支持isArray 方法 不支持才调用本身的 type检测
isArray : Array.isArray || function(obj) {
return this.type(obj) === "array";
},
isPlainObject : function(obj) {
//排除不能深拷贝的类型 nodeType不能是dom元素，不能是window对象
if (!obj || this.type(obj) !== "object" || obj.nodeType || this.isWindow(obj)) {
return false;
}
if (obj.constructor && !this.hasOwn.call(obj, "constructor")
&& !this.hasOwn.call(obj.constructor.prototype, "isPrototypeOf")) { //判断如果有构造函数，是不是继承而来的继承来的太深了不能复制
return false;
}
var key;
//判断属性是不是自身的，如果原型上继承来的属性 那这
//
for (key in obj) {
}
return key === undefined || this.hasOwn.call(obj, key);
}
}
/**
* 思考为什么入参一定要是对象；
* 多参数时候 对象是引用类型，当成参数传入的时候我们改变了入参的值，也就改变了原对象所指向地址的值
* 单个参数组件拓展时候传入的是方法，方法作为对象的属性也成了引用类型这样插入的组件指向传入方法的地址
*
* */
jQuery.fn.extend=jQuery.extend=function(){
var target=arguments[0]||{};
var option,key,deep,src, copy, copyIsArray, clone,
length=arguments.length,
deep = false,//默认浅拷贝
i=1;//决定循环第几个入参
if(typeof target==="boolean"){//判断是否传入深拷贝
deep=target;
target=arguments[1]||{};//传的深拷贝开关 参数往后移一位
i=2;//第三个入参开始是要被合并的对象
}
if(!jQuery.fn.isObject(target) && !jQuery.fn.isFunction(target)){
target = {};
};
if(length === i){//只传入一个参数时候
target=this;//指向调用extend的对象，也就是jquery的实例对象jquery.prototype或jqery
i--;//让下面循环将方法加入当前this指向的对象，傻吊老师没写
};
for(;i
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/106842.html
摘要：前言月份开始出没社区，现在差不多月了，按照工作的说法，就是差不多过了三个月的试用期，准备转正了一般来说，差不多到了转正的时候，会进行总结或者分享会议那么今天我就把看过的一些学习资源主要是博客，博文推荐分享给大家。 1.前言 6月份开始出没社区，现在差不多9月了，按照工作的说法，就是差不多过了三个月的试用期，准备转正了！一般来说，差不多到了转正的时候，会进行总结或者分享会议！那么今天我就...
摘要：前言月份开始出没社区，现在差不多月了，按照工作的说法，就是差不多过了三个月的试用期，准备转正了一般来说，差不多到了转正的时候，会进行总结或者分享会议那么今天我就把看过的一些学习资源主要是博客，博文推荐分享给大家。 1.前言 6月份开始出没社区，现在差不多9月了，按照工作的说法，就是差不多过了三个月的试用期，准备转正了！一般来说，差不多到了转正的时候，会进行总结或者分享会议！那么今天我就...
摘要：进一步了解类数组对象可以看这篇文章对象的构建和分离构造器然后我们回来看看，让我们悲伤的代码。。。然后又通过下面的语句，将两个独立的构造器关联起来了。 背景 不造轮子的程序员不是好程序员，所以我们今天尝试造一下轮子。今天的主角是 jQuery ，虽然现在市面上已被 React，Angular，Vue 等挤的容不下它的位置，但是它的简单 API 设计依然优秀，值得学习和体会。 任务 今天造...
摘要：毫无疑问，设计模式于己于他人于系统都是多赢的设计模式使代码编写真正工程化设计模小书前端掘金这是一本关于的小书。 JavaScript 常见设计模式解析 - 掘金设计模式（Design pattern）是一套被反复使用、多数人知晓的、经过分类编目的、代码设计经验的总结。使用设计模式是为了可重用代码、让代码更容易被他人理解、保证代码可靠性。毫无疑问，设计模式于己于他人于系统都是多赢的；设计...
摘要：插件开发前端掘金作者原文地址译者插件是为应用添加全局功能的一种强大而且简单的方式。提供了与使用掌控异步前端掘金教你使用在行代码内优雅的实现文件分片断点续传。 Vue.js 插件开发 - 前端 - 掘金作者：Joshua Bemenderfer原文地址: creating-custom-plugins译者：jeneser Vue.js插件是为应用添加全局功能的一种强大而且简单的方式。插....
阅读 3876·2021-10-08 10:04
阅读 2909·2021-08-11 11:20
阅读 2510·2021-07-25 21:37
阅读 2517·2019-08-30 12:44
阅读 2170·2019-08-30 11:12
阅读 1189·2019-08-26 13:45
阅读 2206·2019-08-26 11:53
阅读 2948·2019-08-26 11:32
