jQuery源码总结

jQuery是大家都会使用的js库，因其方便性而广泛使用到个网址中。

jQuery核心代码结构模拟：

(function(window){                var A=function(ok){                    //return this;                    return new A.fn.init(ok);                };                A.fn=A.prototype={                    init:function(ok){                        if(!ok){                            return this;                        }                    },                    post:function(){                        alert("my post");                    },                    get:function(){                        alert("my get");                    }                };                A.fn.init.prototype=A.fn;                A.extend=A.fn.extend=function(obj,content){                    if(typeof(obj)=="object"){                        for(var name in obj){                            //alert(name);                            A.prototype[name]=obj[name];                        }                    }else if(typeof(obj)=="function"){                        A.prototype=obj.prototype;                        for(var name in content){                            A.prototype[name]=content[name];                        }                    }                }                window.L=A;            })(window)    //===============================                   L().extend({                name:"liujian",                love:function(){                    alert("my love");                }            });            L().love();            L().post();

1. 首先通过闭包将window对象传人内部并通过window.L=A;将L 和A代表jQuery 和 $
2. 通过A.fn.init.prototype=A.fn; 和A.fn=A.prototype 使A.fn.init A.fn A L这四个对象都可以调用函数库
3. extend方法的模拟实现可以将自己的函数扩展到jQuery函数库

jquery源码对比：
基本框架：

(function(window){  "use strict";  var jQuery = window.jQuery = window.$ = function(selector){    //定义$函数，并把$和jQuery暴露到外面  };  jQuery.fn = jQuery.prototype = {    //jQuery原型  };  jQuery.extend = jQuery.fn.extend = function(){    //添加扩展方法，jQuery.extend添加静态方法，也可以实现继承，jQuery.fn.extend添加动态方法  }})(window);

jQuery的初始化：

//由于$('#selector')得到的是一个jQuery对象，尝试直接返回jQuery对象var jQuery = window.jQuery = window.$ = function(selector){  return new jQuery();   //这里会导致一个死循环，所以不能这样直接构建jQuery对象};

init()

var jQuery = window.jQuery = window.$ = function(selector){    return new jQuery.fn.init(selector);   //执行初始化};jQuery.fn = jQuery.prototype = {  constructor: jQuery,  init: function(selector){    var elements = document.querySelectorAll(selector);   //顺便简单的实现了选择器    //注意querySelectorAll在老的浏览器中是不支持的，这里专注在jQuery的结构上。    Array.prototype.push.apply(this, elements);   //构成类数组对象，引入length，并使其自增    return this;  },  jQuery: "1.0.0",   //jQuery版本信息  length: 0,    //模拟数组，即这里构成一个类数组对象  size: function(){    return this.length;  }}jQuery.fn.init.prototype = jQuery.fn;

extend方法

jQuery.extend = jQuery.fn.extend = function(obj, srcObj){    var target, len = arguments.length;    if(len === 1){   //传入一个参数时实现继承      deep(obj, this);      return this;    } else {      for(var i = 1; i < len; i++){        target = arguments[i];        deep(target, obj);      }      return obj;    }    function deep(oldOne, newOne){   //实现深拷贝      for(var prop in oldOne){        if(typeof oldOne[prop] === "object" && oldOne[prop] !== null){            newOne[prop] = oldOne[prop].constructor === Array ? [] : {};            deep(oldOne[prop], newOne[prop]);        }        else{            newOne[prop] = oldOne[prop];        }      }    }  };