jQuery解构| ES 5术语中的JQuery对象?

时间:2012-09-24 18:24:05

标签: javascript jquery

这将返回一个jQuery对象。什么是jQuery对象。它是一个对象,一个数组,还是两者的某种组合?

$("#id")

我正在查看source here,但找不到它。

4 个答案:

答案 0 :(得分:16)

首先,它不是什么。

jQuery对象不是数组。

在JavaScript中,有内置的本机构造函数。其中之一是Array。但最终Array构造函数创建了对象。 jQuery对象不是从Array构造函数构建的。


那么Object如何与数组不同?

由于ObjectArray是内置的本机构造函数,因此从构造函数创建的对象具有内部[[Class]]属性。你可以看到它的价值。

Object.prototype.toString.call({}); // [object Object]
Object.prototype.toString.call([]); // [object Array]

所以你可以看到这些对象具有差异性。


还有哪些差异?

两个对象的原型链是不同的。对于普通对象,它可以像这样可视化。

{} ---> Object.prototype ---> null

对于数组,就像这样。

[] ---> Array.prototype ---> Object.prototype ---> null

所以你可以看到他们的继承也区别了他们。


那么jQuery对象呢?

jQuery对象更像是普通的Object而不是Array。但JavaScript允许您定义自定义(非内置)构造函数。

toString值与对象[object Object]相同,但原型链会有所不同。

function Foo() {

}

new Foo() ---> Foo.prototype ---> Object.prototype ---> null

因此jQuery的原型链与此类似,但使用jQuery构造函数而不是Foo


那么这一切意味着什么呢?

JavaScript中的所有对象都类似于它们从Object.prototype *继承,但您可以拥有具有扩展原型链的不同对象,并且您还可以拥有内部[[Class]]的本机对象使他们与众不同的财产。

所以回答“什么类型的对象是jQuery对象”的问题,答案是它是一个像每个对象一样继承Object.prototype的对象,但也继承自prototype它的自定义构造函数。

*请注意,在ES5中,您还可以拥有一个没有原型链的对象。其链将立即以null终止。


但是jQuery对象将DOM元素存储在数字索引处,并且具有.length属性。这不是一个数组吗?

不,这只是使它成为一个具有数字属性的对象,以及一个名为length的属性。

var myObj = {};
myObj[0] = "foo";
myObj[1] = "bar";

Array的属性并不特殊。它们与对象的属性相同

var myArr = [];
myArr[0] = "foo";
myArr[1] = "bar";

这两个代码示例完全相同。


他们做的完全一样吗?真的吗

差不多。 Array对象和Object对象之间的属性本身没有区别,但Arrays有一些特殊的行为。

例如,如果我以比当前.length帐户更高的索引添加属性,.length将自动调整。

myArr.length; // 2
myArr[9] = "baz";
myArr.length; // 10

在数组上,.length本身具有一些“魔法”能力,例如可以通过将.length设置为较低的值来截断数组。

myArr.length = 1;
myArr[1]; // undefined

因此,虽然jQuery对象具有数字属性和.length属性,但它的行为与本机数组的行为不同。

答案 1 :(得分:12)

$()返回jQuery类的实例(new jQuery()) 因此,它继承了jQuery.prototype的所有标准jQuery方法以及所有插件(别名为jQuery.fn

此外,jQuery()构造函数通过添加length属性以及每个元素的索引属性,将每个实例转换为类数组对象。集。

答案 2 :(得分:4)

返回的对象(参见EcmaScript §4.2.1的含义)是jQuery内部构造函数的一个实例(jQuery.fn.init - 有关详细信息,请参阅this answer jQuery的实例化模式),继承自$.fn原型对象。

当然,它是Object的一个实例,几乎是JavaScript中的每个对象。

并且,因为每个jQuery元素代表[DOM]元素的集合,它看起来像Array及其数字索引属性 - 虽然length属性不是自动更新的,但是可以在其上应用大多数Array方法。它不是真实的Array实例(What's an Arrayand what is in JS?)。

答案 3 :(得分:2)

jquery对象是jquery库的一个对象,基本上所有的jquery方法和属性都附加到你可以使用的jquery对象; t将它用作普通的javascript对象。它也与jquery对象不同。