javascript - How is $('h1') logging to the web console as an array in jQuery? - Stack Overflow

admin管理员组

文章数量:1356758

If you do console.log($('some selector')) in the browser, it returns what looks like an array (first line):

But notice that it's not an instanceof Array, but it's actually the jQuery object.

When you do console.dir($('h1')), it shows it's actually the jQuery object.

The question is, how are they making it look like it's an array in the web console? I noticed in the jQuery source here they add reference to a few Array and Object methods, and here they add toArray (and slice and others) to the jQuery object. Is the web console somehow checking for these methods and if it finds one (toArray, indexOf, slice, etc.), it prints it as an Array? I would like to get this behavior out of any custom object, such as the Ember.ArrayProxy. Currently when you log the Ember.ArrayProxy it shows > Object or whatever, but it would be nice to show it as an array.

Any ideas?

If you do console.log($('some selector')) in the browser, it returns what looks like an array (first line):

But notice that it's not an instanceof Array, but it's actually the jQuery object.

When you do console.dir($('h1')), it shows it's actually the jQuery object.

The question is, how are they making it look like it's an array in the web console? I noticed in the jQuery source here they add reference to a few Array and Object methods, and here they add toArray (and slice and others) to the jQuery object. Is the web console somehow checking for these methods and if it finds one (toArray, indexOf, slice, etc.), it prints it as an Array? I would like to get this behavior out of any custom object, such as the Ember.ArrayProxy. Currently when you log the Ember.ArrayProxy it shows > Object or whatever, but it would be nice to show it as an array.

Any ideas?

• javascript
• jquery
• logging
• browser
• console

Share Improve this question Follow asked May 26, 2012 at 2:04 Lance PollardLance Pollard 79.6k9898 gold badges332332 silver badges609609 bronze badges 1

• Related: stackoverflow./questions/6599071/…. – pimvdb Commented May 26, 2012 at 12:40

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 15

You make your object inherit Array using the prototype, like so:

function SomeType() {
    this.push(16);
}

SomeType.prototype = [];
SomeType.prototype.constructor = SomeType; // Make sure there are no unexpected results

console.log(new SomeType()); // Displays in console as [16]

And, of course, all jQuery objects are instances of the jQuery function/constructor, so that's how jQuery does it. As a bonus, because of the inheritance, you get all the methods from Array, and the indexing that es with it too!

本文标签： javascriptHow is (39h139) logging to the web console as an array in jQueryStack Overflow