jQuery解构| ES 5中的JQuery对象? [英] jQuery Deconstruction | JQuery object in ES 5 terms?

问题描述

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

This returns a jQuery object. what is a jQuery object. Is it an object, an array, or some combination of both?

$("#id")

我正在寻找此处的源文件，但找不到它. /p>

I'm looking in the source here, but can not find it.

推荐答案

首先，不是的.

First, what it's not.

jQuery对象不是数组.

A jQuery object is not an Array.

在JavaScript中，有内置的本机构造函数.其中之一是Array.但是最终Array构造函数创建对象. jQuery对象不是通过Array构造函数构建的.

In JavaScript, there are built-in native constructor functions. One of these is Array. But ultimately the Array constructor creates Objects. jQuery objects are not built from the Array constructor.

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

So how is an Object different from an Array?

由于Object和Array是内置的本机构造函数，所以从这些构造函数创建的对象具有内部的[[Class]]属性.您可以像这样看到它的值.

Since Object and Array are built-in native constructors, the objects created from the constructors have an internal [[Class]] property. You can see its value like this.

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

所以您可以看到这些对象有不同之处.

So you can see that these objects have that as a difference.

还有什么其他区别?

What other differences are there?

两个对象的原型链是不同的.对于一个普通的对象，可以像这样可视化.

The prototype chain of the two objects are different. For a plain object, it could be visualized like this.

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

像这样的数组.

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

所以您可以看到它们的继承也将它们区别开来.

So you can see that their inheritance distinguishes them as well.

那jQuery对象呢?

So what about a jQuery object?

jQuery对象更像是普通对象，而不是数组.但是JavaScript可以让您定义自定义的(非内置)构造函数.

A jQuery object is more like a plain Object than an Array. But JavaScript lets you define custom (not built-in) constructors.

toString值将与对象[object Object]相同，但原型链将有所不同.

The toString value will be the same as an Object [object Object], but the prototype chain will be different.

function Foo() {

}

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

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

So jQuery's prototype chain would be similar to this, but with the jQuery constructor instead of Foo.

那是什么意思?

So what does all this mean?

JavaScript中的所有对象都是相似的，因为它们继承自Object.prototype *，但是您可以具有带有扩展原型链的不同对象，还可以具有具有内部[[Class]]属性的本机对象，从而为它们提供区别.

All objects in JavaScript are similar in that they inherit from Object.prototype *, but you can have different objects that have an extended prototype chain, and you can also have native objects that have an internal [[Class]] property that gives them distinction.

因此要回答什么类型的对象是jQuery对象"的问题，答案是它是一个像所有对象一样从Object.prototype继承的对象，但也从其自定义构造函数的prototype继承

So to answer the question of "what type of object is a jQuery object", the answer is that it is an Object that inherits from Object.prototype like every object, but also inherits from the prototype of its custom constructor.

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

_{* Note that in ES5, you can also have an object that has no prototype chain. Its chain is terminated immediately with null.}

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

But a jQuery object stores DOM elements at numeric indices, and has a .length property. Doesn't that make it an Array?

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

No, that just makes it an object with properties that are numbers, and a property named length.

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

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

An Array's properties are not special. They are identical to an Object's properties.

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

这两个代码示例在做完全相同的事情.

These two code examples are doing the exact same thing.

他们在做完全相同的事情吗?真的吗?

They're doing exactly the same thing? Really?

好吧.数组对象和对象对象之间的属性本身没有什么不同，但是数组具有一些特殊的行为.

Well almost. The properties themselves are no different between Array objects and Object objects, but Arrays have some special behaviors.

例如，如果我以比当前.length帐户所占比例更高的索引添加属性，则会自动调整.length.

For example, if I add a property at a higher index than the current .length accounts for, the .length will be automatically adjusted.

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

在数组上，.length本身具有一些魔术"功能，例如能够通过将.length设置为较低的值来截断数组.

On an Array, .length itself has some "magic" abilities, like being able to truncate the Array by setting .length to a lower value.

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

因此，尽管jQuery对象具有数字属性和.length属性，但它的行为不像本机Array那样.

So while a jQuery object has numeric properties and a .length property, it doesn't behave as a native Array would behave.

这篇关于jQuery解构| ES 5中的JQuery对象?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！