如何jQuery返回一个数组，仍然是一个jQuery对象？ [英] How can jQuery return an array and still have it be a jQuery object?
问题描述
我试图重现jQuery的（1.7.1）对象结构，以更好地了解它是如何工作的。我有以下代码：
I am attempting to reproduce jQuery's (1.7.1) object structure, to better understand how it it works. I have the following 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);
我的控制台如下所示：
> myclass().test();
test1
< __con.fn.__con.init
> myclass.test();
test2
< function () {
return new __con.fn.init();
}
$ b $ p我的困惑是jQuery如何返回数组还有它是一个jQuery对象吗？从控制台执行的jQuery可能如下所示：
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:
> $(document.body)
[<body>…</body>]
> $(document.body).css('width');
"1263px"
事实上，我注意到的一件事是缺少< 。那么究竟是怎么回事？我已经在谷歌搜索解释jQuery的工作原理，没有什么效果。也许我只是得到了术语错了，我不知道。看来我找不到任何详细的来源解释这个。
In fact, one thing that I definitely noticed is the lack of < 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.
也许我的代码只是不完整，但我迄今为止的基本结构是我一直能够提取到目前为止。如果错误，不完整，或效率低下，请更正我到目前为止，一切方面请随时提供良好的阅读：
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:
- Javascript最佳做法
- 如何使用jQuery工作
- 高效的Javascript类
-
- 单身
- 原型
- 任何与此类型结构相关的其他任何事情都称为
- Javascript best practices
- How jQuery works
- Efficient Javascript classes
- Things all about Javascript object structures
- Singletons
- Prototypes
- Anything else related to whatever this type of structure is called
推荐答案
jQuery对象是数组，所以看起来和行为很像数组，但实际上只是自定义对象大致相当于一个DOM节点的集合（除了添加的功能）。所有类似于数组的功能 - length，slice（）等 - 实际上是手动添加到jQuery原型（
jQuery.fn是一个别名）通过使用jQuery对象作为上下文调用数组函数jQuery objects are array-like, so look and behave a lot like arrays, but are in fact just custom objects made to roughly equate to a collection of DOM nodes (except with added functionality). All the array-like functionality - length, slice() etc.. - is in fact added manually to the jQuery prototype (for which
jQuery.fnis an alias), sometimes by calling an array function with the jQuery object as contextslice = Array.prototype.slice, ... slice: function() { return this.pushStack( slice.apply( this, arguments ), "slice", slice.call(arguments).join(",") ); },查看注释代码（可能是一个非常有用的资源对我有用[0]丢个板砖[0]引用|举报|编辑删除管理回复次数：手动设置例如
and sometimes by writing it from scratch. Look at the annotated code (probably a very useful resource for you - it covers v1.6.2 but I don't think anything too drastic has changed since then, except maybe the addition of $.callbacks) to see that
this.lengthis set manually e.g.if ( selector === "body" && !context && document.body ) { this.context = document; this[0] = document.body; this.selector = selector; this.length = 1; return this; }jQuery.buildFragment（）方法也是如何构造包含更大的DOM节点集合的jQuery对象的基础。the
jQuery.buildFragment()method is also fundamental to how jQuery objects containing larger collections of DOM nodes are constructed.总而言之，jQuery不使用数组，喜欢它，因为许多本机数组功能已被复制为jQuery原型的属性。
So to sum up, jQuery doesn't use arrays, it just looks like it does because much native array functionality has been replicated as properties of the jQuery prototype.
这篇关于如何jQuery返回一个数组，仍然是一个jQuery对象？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
