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(){
this.length=0; 此时为0
问:如果此时的值为2,那么实例化是不严谨的,需要补充上数组的值,如下: <