JQ框架结构理解

1、jQuery对象的本质：

1、1 jQuery对外暴露了两个变量： $和jQuery  ,这两个变量都是指向同一个函数

1、2  举例：

1.2.1  不传参可以创建jq对象

console.log($())   console.log(jquery())  ===> jquery.fn.init 

1.2.2 传参(可以传任何参数，jq会做不同的处理，但是都会得到jq对象) 得到的也是jq对象

console.log($('body'));   ===> jquery.fn.init ==>0:body length:1

1.2.3  发现jq实例对象会以下标的形式存储数据（大部分情况下都是DOM元素）,并且还有一个length属性，说明jq实例对象是一个 伪数组 （ jq实例能够像数组一样访问里面存储的数据和数据量 ）

console.log($('body')[0]);   console.log($('body').length);

2、关于JQ实创建伪数组的原理：

2、1  实例化

<script> 

    

    这是工厂函数

    function $(){

        return new init();

    }

    这是构造函数

    function init(){

    }

        

    console.log($());  看上去是jq对象，但是打印出来 init__proto__: Objectconstructor: ƒ init()__proto__: Object ，说明并不是一个伪数组

    console.log($().length);    undefined

</script>    

2、2 让实例化对象变成伪数组的方式

<script> 

    

    这是工厂函数

    function $(){

        return new init();

    }

    这是构造函数

    function init(){

        this.length=0;    给一个length=0；给新创建的实例对象添加属性

    }

        

    console.log($());    init {length: 0}  得到的仍然是实例对象，不过这个实例对象拥有一个length属性，并且值为0，那么这个实例对象又多了一个称呼，叫伪数组对象

    console.log($().length);    0

</script>    

2、3 由上面的示例理解一下什么是伪数组？

   

1、伪数组是一个非数组类型的对象

2、有一个length的属性，值为number类型

3、以下标的方式存储数据

2、4 关于数组push方法

function $(){

        return new init();

    }

    这是构造函数

    function init(){

     <