jquery源码学习-1-整体架构
Posted slightfly
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquery源码学习-1-整体架构相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>jquery1.0.1</title> </head> <body> <script src="./jquery.1.0.1.js"></script> <script> // console.log($()) /* init __proto__: Object css: () init: () __proto__: Object */ var ret = name:‘max‘,list:age:‘30‘ var res = list:sex:‘女‘ var obj = $.extend(,ret, res) //给任意对象扩展,浅拷贝 var obj1 = $.extend(true, , ret, res) //给任意对象扩展,深拷贝 // $.extend( //给jquery扩展 // work:function() // ) // // jQuery.work(); // $.fn.extend( //给实例对象扩展 // sex: ‘男‘ // ) // $().sex </script> </body> </html>
(function(root) var jQuery = function() return new jQuery.prototype.init() jQuery.fn = jQuery.prototype = init:function(), css:function() //extend 内部|外部 //浅拷贝,深拷贝(第一个参数为true) jQuery.fn.extend = jQuery.extend = function() //根据参数内容和个数来实现 var target = arguments[0] || var length = arguments.length; var i = 1; var deep = false; var option,name,copy,src,copyIsArray,clone; if( typeof target === ‘boolean‘) //判断是否有深浅拷贝的标识,如果是boolean类型 deep = target ; //deel复制标识 target = arguments[1]; //将要拷贝的对象赋值为第二个参数 i = 2; //要遍历的参数从第二个开始 if( typeof target !== ‘object‘) //第一个参数不是对象,就给他赋值为空对象 target = if(length === i) //判断参数个数 ,如果参数个数为1,则是为 jquey/jquery实例对象 扩展对象, target = this; //this只想对象的引用 i-- //浅拷贝 for(; i<length; i++) //如果参数个数不为1,直接从第二个参数开始,若为0,则从第一个开始,产生无用消耗 if( (option = arguments[i]) != null) for(name in option) copy = option[name] src = target[name]; if(deep && (jQuery.isPlainObject(copy) || (copyIsArray = jQuery.isArray(copy)))) //深拷贝 if(copyIsArray) copyIsArray = false; clone = src && jQuery.isArray(src)? src :[]; else clone = src && jQuery.isPlainObject(src)? src :; target[name] = jQuery.extend(deep,clone,copy) else if(copy != undefined) //浅拷贝 target[name] = copy; return target // jQuery.prototype.init.prototype = jQuery.prototype;//共享原型对象 jQuery.fn.init.prototype = jQuery.fn;//共享原型对象 ,, fn是prototype的简写吧。。。 jQuery.extend( isPlainObject:function(obj) return toString.call(obj) === ‘[object Object]‘ , isArray:function(obj) return toString.call(obj) === ‘[object Aarray]‘ ) root.$ = root.jQuery = jQuery )(this)
以上是关于jquery源码学习-1-整体架构的主要内容,如果未能解决你的问题,请参考以下文章
学习 redux 源码整体架构,深入理解 redux 及其中间件原理