javascript - jQuery解构 | ES 5 术语中的 JQuery 对象？

Question

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

$("#id")

我正在寻找 source here , 但找不到。

Answer 1

首先，它不是什么。

jQuery 对象不是数组。

在 JavaScript 中，有内置的原生构造函数。其中之一是 Array。但最终 Array 构造函数创建对象。 jQuery 对象不是从 Array 构造函数构建的。

---

那么对象与数组有何不同？

由于 Object 和 Array 是内置的原生构造函数，从构造函数创建的对象具有内部 [[Class]] 属性.您可以像这样看到它的值(value)。

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

因此您可以看到这些对象具有不同之处。

---

还有哪些区别？

两个对象的原型(prototype)链是不同的。对于一个普通的物体，它可以被想象成这样。

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

对于数组，像这样。

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

所以你可以看出他们的遗传也使他们与众不同。

---

那么 jQuery 对象呢？

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

toString 值将与对象 [object Object] 相同，但原型(prototype)链将不同。

function Foo() {

}

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

所以 jQuery 的原型(prototype)链将与此类似，但使用 jQuery 构造函数而不是 Foo。

---

那么这一切意味着什么？

JavaScript 中的所有对象都相似，因为它们都继承自 Object.prototype *，但是您可以拥有具有扩展原型(prototype)链的不同对象，也可以拥有具有内部原型(prototype)链的 native 对象[[Class]] 使它们与众不同的属性。

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

_{* 请注意，在 ES5 中，您还可以拥有一个没有原型(prototype)链的对象。它的链立即以 null 终止。}

---

但是 jQuery 对象在数字索引处存储 DOM 元素，并且具有 .length 属性。这不是使它成为一个数组吗？

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

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

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

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

这两个代码示例做的是完全相同的事情。

---

他们在做完全一样的事情？真的吗？

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

例如，如果我在比当前 .length 占的索引更高的索引处添加属性，则 .length 将自动调整。

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

在数组上，.length 本身具有一些“神奇”的能力，比如能够通过将 .length 设置为较低的值来 chop 数组。

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

因此，虽然 jQuery 对象具有数字属性和 .length 属性，但它的行为与原生 Array 的行为不同。