2013-05-08 12 views
7

Tôi đang cố chuyển đổi phần tử DOM thành một bộ sưu tập đối tượng. Nhưng tôi không biết những gì khác biệt chính giữa toArray() và makeArray()Sự khác biệt giữa toArray và makeArray trong jquery

HTML

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

tôi đã sử dụng đoạn mã sau để chuyển đổi các nút để một mảng:

JQUERY

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

Tôi không thể hiểu được sự khác biệt giữa chúng và tôi đã đã tìm kiếm câu hỏi này nhưng không tìm thấy bất kỳ giải thích rõ ràng nào.

Xin cảm ơn trước.

Trả lời

11

Theo tài liệu jQuery:

toArray là một phương pháp trên jQuery Object (đó là bao bọc xung quanh một tập hợp các phần tử DOM). Phương pháp này chiết xuất các thành viên của bộ này của các yếu tố DOM để mảng javascript:

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

makeArray (mà là một "phương pháp tĩnh" trên đối tượng jQuery) mất array-like object (jQuery, lập luận, NodeList, ...) và xây dựng một mảng javascript thích hợp từ nó, vì vậy bạn có thể gọi các phương thức của mảng vào kết quả:

// 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); 

Nói tóm lại, toArray biến yếu tố jQuery thiết-Array javascript, makeArray biến đổi bất kỳ ar tia giống như đối tượng đến javascript Array.

+0

Có một sự khác biệt giữa '.get() 'và' .toArray() '? – Bergi

+1

.toArray() và .get() cả hai trả về mảng của các nút trong tập kết quả jQuery. .get() chấp nhận tham số chỉ mục tùy chọn trong trường hợp nó trả về nút tại vị trí 'index' hoặc' undefined' nếu chỉ mục nằm ngoài giới hạn. –

2

Sự khác biệt duy nhất là:

toArray()DOM Element Methods và bạn chỉ có thể sử dụng nó trên các yếu tố dom. trong khi makeArray(object) có thể được sử dụng trên các đối tượng tùy chỉnh của bạn.

Không có sự khác biệt nào khác chúng hầu như giống nhau và trả về đối tượng mảng đơn giản.

Ví dụ

Bạn có bất kỳ đối tượng tùy chỉnh:

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

nay đến sử dụng cả hai chức năng:

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

khi:

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

obj.length; //return undefined 
0

Như đã đề cập, toArray() là dành cho các đối tượng jQuery.

$.makeArray() cũng tương tự như JS Array.prototype.slice.call() hoặc [].slice.call() cho ngắn (ngoại trừ việc sau này tạo một đối tượng)

nhưng có một sự khác biệt khi chế biến các POJO với giá trị quá mức length

ví dụ: {

dài : 5,

0:

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

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

, 1:

$.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] 

, 2:

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

[].slice.call({12:'a', 13:'b', length:1}) 
// [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] 

}

do đó $.makeArray() chỉ đơn giản trả về đối tượng đầu vào bất cứ khi nào một phím với chỉ số cụ thể được không tìm thấy