jQuery 中的 toArray 和 makeArray 有什么区别？

在本文中，我们将了解 jQuery 中 toArray() 和 makeArray() 方法之间的区别。

toArray() 方法：此方法用于 DOM（文档对象模型）元素以将它们转换为 JavaScript 数组。我们可以迭代这个数组，计算它的长度，并像普通数组一样使用它们的索引访问元素。但是，我们无法使用此方法从其他类似数组的对象创建数组。这是两个函数之间的主要区别。

句法：

let dom_array = $("p").toArray();

示例：在这个示例中，我们将看到如何使用 toArray() 将 DOM 元素转换为数组，以及它如何不适用于其他类型的数据。

HTML

  
  


  
    GeeksforGeeks
  
  Data Structures
  Competitive Programming
  Algorithms
  
  Click Here
  Output
    
  
  
    let obj = {
      name: "Sam",
      age: 12
    }
  
    $("button").click(function () {
  
      // Creating an array of paragraphs
      let para_array = $("p").toArray();
  
      // Iterating over para_array
      // and appending the data in the div
      for (i = 0; i < para_array.length; i++) {
        $("#output").append("Element: " +
          para_array[i].innerHTML + "<br>");
      }
  
      // We cannot use toArray() on the object
      // as toArray() works only for DOM elements
      // let obj_array = jQuery.toArray(obj);
      // console.log(obj_array);
    });
  

输出：

makeArray() 方法：此方法用于类数组对象，将它们转换为数组。然后我们可以在该数组上使用普通的数组函数。此方法支持 DOM 元素的转换，因为它们是类数组对象。

句法：

// Array using DOM elements
let array = jQuery.makeArray($("p"));

// Array using other array-like objects
let array2 = jQuery.makeArray(array1, array2, array3);

示例：在这个示例中，我们将看到如何使用 makeArray() 转换所有类型的类数组元素，包括 DOM 元素。

HTML

  
  


  
    GeeksforGeeks
  
    
Data Structures
  
    
Competitive Programming
  
    
Algorithms
  
  Click Here
  Output
    
  
  Output 2
  
  
    let obj = {
      name: "Sam",
      age: 12
    }
  
    $("button").click(function () {
  
      // Creating an array of paragraphs
      let para_array = jQuery.makeArray($("p"));
  
      // Iterating over para_array
      // and appending the data in the first div
      for (let i = 0; i < para_array.length; i++) {
        $("#output").append("Element: " +
          para_array[i].innerHTML + "<br>");
      }
  
      // Creating an array of the object
      let obj_array = jQuery.makeArray(obj);
  
      // Iterating over obj_array
      // and appending the data in the second div
      for (let i = 0; i < obj_array.length; i++) {
        $("#output2").append("Name: " +
          obj_array[i].name + " Age: " + 
          obj_array[i].age + "<br>");
      }
    });
  

输出：

toArray() 和 makeArray() 的区别：

toArray() Method	makeArray() Method
This method supports the conversion of DOM elements to an array.	This method supports the conversion of all array-like elements to an array.
Only DOM elements are supported to be converted. Other array-like elements will throw an error.	All types of elements can be converted to an array including DOM elements.