StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POHow can jQuery return an array and still have it be a jQuery object?
text
Body
copied!<p>I am attempting to reproduce jQuery's (1.7.1) object structure, to better understand how it it works. I have the following code:</p> <pre><code>(function (window, undefined) { var document = window.document, navigator = window.navigator, location = window.location; window.myclass = (function () { var __con = function () { return new __con.fn.init(); } __con.fn = __con.prototype = { 'init' : function () { return this; }, 'test' : function () { console.log('test1'); return this; } } __con.fn.init.prototype = __con.fn; __con.test = function () { console.log('test2'); return this; } return __con; })(); })(window); </code></pre> <p>My console looks like this:</p> <pre><code>> myclass().test(); test1 < __con.fn.__con.init > myclass.test(); test2 < function () { return new __con.fn.init(); } </code></pre> <p>My confusion is how jQuery is able to return an array and still have it be a jQuery object? jQuery being executed from the console might look something like:</p> <pre><code>> $(document.body) [<body>…</body>] > $(document.body).css('width'); "1263px" </code></pre> <p>In fact, one thing that I definitely noticed is the lack of <code><</code> for the return object. So what exactly is going on here? I've searched all over Google to explain how jQuery works, to no avail. Maybe I'm just getting the terminology wrong, I'm not sure. It seems I can't find any detailed source explaining this.</p> <p>Perhaps my code is just incomplete, but the basic structure that I have so far is what I've been able to extract so far. Please correct what I have so far if it is wrong, incomplete, or inefficient, and by all means please feel free to provide good reading about:</p> <ul> <li>Javascript best practices</li> <li>How jQuery works</li> <li>Efficient Javascript classes</li> <li>Things all about Javascript object structures <ul> <li>Singletons</li> <li>Prototypes</li> <li>Anything else related to whatever this type of structure is called</li> </ul></li> </ul>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload