8

我正在尝试将 DOM 元素转换为对象集合。但我不知道 toArray() 和 makeArray() 之间的主要区别是什么

HTML

<div id="firstdiv">
   <div>foo1</div>
   <div>foo2</div>
   <div>foo3</div>
</div>

我使用以下代码将节点转换为数组:

查询

console.log($("#firstdiv > div").toArray());
console.log($.makeArray($("#firstdiv").html()));

我不太明白它们之间的区别,我搜索了这个问题,但没有找到任何明确的解释。

提前致谢。

4

3 回答 3

14

根据 jQuery 文档:

toArray是 jQuery Object 上的一个方法(它是一组 DOM 元素的包装器)。该方法将这组 DOM 元素的成员提取到 javascript 数组中:

jQuery('.some-class').toArray() -> [ dom_el_1, dom_el_2, dom_el_3, ... ] 

makeArray(这是 jQuery 对象上的“静态方法”)采用类数组对象(jQuery、arguments、nodeList...)并从中构造一个适当的 javascript Array,因此您可以在结果上调用 Array 的方法:

// returns a nodeList (which is array like item) but not actual array
// you can't call reverse on int
var elems = document.getElementsByTagName("div"); 
var arr = jQuery.makeArray(elems);
arr.reverse(); // use an Array method on list of dom elements
$(arr).appendTo(document.body);

总之,toArrayjQuery 元素集转换为 javascript ArraymakeArray将任何数组(如对象)转换为 javascript Array

于 2013-05-08T07:20:08.100 回答
2

唯一的区别是:

toArray()DOM Element Methods并且您只能在 dom 元素上使用它。whilemakeArray(object)可用于您的自定义对象。

没有其他区别,它们大多相同并返回普通数组对象。

例子

您有任何自定义对象:

function Person(name,age) {
  this.name = name;
  this.age = age;
}
var obj=new Person('abc',1);

现在使用这两个功能:

jQuery.makeArray(obj).length;  //would return 1

尽管:

obj.toArray().length;  //through the error function not defined

obj.length; //return undefined
于 2013-05-08T06:52:27.057 回答
1

正如已经提到的,它toArray()是针对 jQuery 对象的。

$.makeArray()类似于 JSArray.prototype.slice.call()[].slice.call()简称,尽管后者实例化一个对象[]

但是处理length价值过高的 POJO 是有区别的

例子

1.

$.makeArray({ 0:'a', 1:'b', length:1 })
// ["a"]

[].slice.call({ 0:'a', 1:'b', length:1 })
// ["a"]

2.

$.makeArray({ 0:'a', 1:'b', length:4 })
// { 0:'a', 1:'b', length:4 } // WUT?

[].slice.call({0:'a', 1:'b', length:4})
// ["a", "b", undefined, undefined]

3.

$.makeArray({12:'a', 13:'b', length:1})
// { 12:'a', 13:'b', length:1 } // WUT?

[].slice.call({12:'a', 13:'b', length:1})
// [undefined]

4.

$.makeArray({ 0:'a', 2:'b', length:2 })
// { 0:'a', 2:'b', length:2 } // WUT?

[].slice.call({ 0:'a', 2:'b', length:2 })
// ["a", undefined]

因此$.makeArray(),只要找不到具有特定索引的键,就简单地返回输入对象。

只有在转换数组中具有适当数量的项目的类似数组的对象时才能正常工作,例如函数arguments、、nodeListjQuery 集合等。

于 2015-06-10T09:07:38.973 回答