jquery是如何架构的.

时间：2022-12-21 22:43:45

心里一直有个疑问.

jquery是如何做到一个jQuery即可以当方法用比如$();又可以当对象用$.extend();

现在总结一下吧

function method(){}

var m=new method();

m.version="123";

console.log(m.version)   // 打印出123

这段代码表示申明一个对象后,还可以继续为该对象添加属性或方法.

继续往下看:

var m=function(){};

m.version="123";

这个地方仍然可以打印出123;

可是这个地方并没有申明对象,只不过是定义了一个变量方法名而已.

核心一:其实变量方法名也是一个对象

比如上面的代码本质上是这样的

var m=new Function();

m.version="123";

这个就是jQuery为什么可以直接作为对象使用的原理.

接着看为什么jQuery可以直接做方法用.

核心二:如果构造函数有返回值,运算符new所创建的对象会被丢弃,返回值作为new表达式的值.

function Method(name,age){

    var obj={

        name:name,

        age:age

    }; 
　　this.name="我来自本身";

     return obj;

}

var objM=new Method("思思博士",26);

console.log(objM);//打印出obj对象,而没有打印"我来自本身"

有了上面的两个核心理论.就可以构建jQuery了.

(function(window,undefined){

    var jQuery=(function(){
　　　　//核心理论二

        var jQuery=function(name,age){

            return new jQuery.prototype.init(name,age);

        };

        jQuery.prototype={

            init:function(name,age){

                return [name,age];

            }

        };

        jQuery.prototype.init.prototype=jQuery.prototype;
　　　　//核心理论一.

        jQuery.version="1.7.2";

        return jQuery;

    })();

    window.$=window.jQuery=jQuery;

})(window);

console.log(jQuery.version);
console.log(jQuery("思思博士",25))

上面的代码模仿的就是jQuery即做方法用,又当对象用的基本理论.

相关文章