如何转换document.querySelectorAll('a')从一个 节点列表到常规数组?

这是我们的密码，

[].slice.call(document.querySelectorAll('a'), 0)

我们先把它拆了，

  []    // Array object
.slice // Accessing the function 'slice' present in the prototype of Array
.call // Accessing the function 'call' present in the prototype of function object(slice)
(document.querySelectorAll('a'),0) 
    // 'call' can have arguments like, (thisArg, arg1,arg2...n). 
   // So here we are passing the 'thisArg' as an array like object,
  // that is a 'nodeList'. It will be served as 'this' object inside of slice function.
 // And finally setting 'start' argument of slice as '0' and leaving the 'end' 
// argument as 'undefined'

步骤:1调用函数的执行

在内部调用，除了thisArg，其余的参数 将被追加到参数列表中。 现在函数slice将通过将其this值绑定为来调用 thisArg(类似于object的数组来自document.querySelector)和参数列表。参数start包含0

步骤:2在调用内部调用slice函数的执行

Start将赋值给变量s为0 由于end是未定义的，这个。长度将存储在e中 空数组将存储在变量a中 在做出上述设置后，将发生以下迭代 While (s < e) { a.push(这[s]); s + +; ｝ 已填满的数组a将作为结果返回。

---

注:为了更好地理解我们的场景，在最初的调用和切片算法中忽略了我们上下文所必需的一些步骤。

如何转换document.querySelectorAll('a')从一个 节点列表到常规数组?

这是我们的密码，

[].slice.call(document.querySelectorAll('a'), 0)

我们先把它拆了，

  []    // Array object
.slice // Accessing the function 'slice' present in the prototype of Array
.call // Accessing the function 'call' present in the prototype of function object(slice)
(document.querySelectorAll('a'),0) 
    // 'call' can have arguments like, (thisArg, arg1,arg2...n). 
   // So here we are passing the 'thisArg' as an array like object,
  // that is a 'nodeList'. It will be served as 'this' object inside of slice function.
 // And finally setting 'start' argument of slice as '0' and leaving the 'end' 
// argument as 'undefined'

步骤:1调用函数的执行

在内部调用，除了thisArg，其余的参数 将被追加到参数列表中。 现在函数slice将通过将其this值绑定为来调用 thisArg(类似于object的数组来自document.querySelector)和参数列表。参数start包含0

步骤:2在调用内部调用slice函数的执行

Start将赋值给变量s为0 由于end是未定义的，这个。长度将存储在e中 空数组将存储在变量a中 在做出上述设置后，将发生以下迭代 While (s < e) { a.push(这[s]); s + +; ｝ 已填满的数组a将作为结果返回。

---

注:为了更好地理解我们的场景，在最初的调用和切片算法中忽略了我们上下文所必需的一些步骤。

在JavaScript中，一个对象的方法可以在运行时绑定到另一个对象。简而言之，javascript允许一个对象“借用”另一个对象的方法:

object1 = {
    name: 'Frank',
    greet() {
        alert(`Hello ${this.name}`);
    }
};

object2 = {
    name: 'Andy'
};

// Note that object2 has no greet method,
// but we may "borrow" from object1:

object1.greet.call(object2); // Will show an alert with 'Hello Andy'

函数对象的调用和应用方法(在JavaScript中，函数也是对象)允许您这样做。因此，在您的代码中，您可以说NodeList正在借用数组的slice方法。.slice()将返回另一个数组作为其结果，该数组将成为您可以使用的“转换”数组。

它是一种将类数组对象转换为实际数组的技术。

这些对象包括:

函数中的参数 NodeList(记住它们的内容可以在获取后更改!所以将它们转换为数组是一种冻结它们的方法) jQuery集合，又名jQuery对象(一些文档:API，类型，学习)

这有很多用途，例如对象是通过引用传递的，而数组是通过值传递的。

另外，注意第一个参数0可以省略，详细解释在这里。

为了完整起见，还有jQuery.makeArray()。

它从Array中检索slice函数。然后调用该函数，但是使用document的结果。将querySelectorAll作为this对象，而不是实际的数组。

这也可能有所帮助。

片的方法

描述:

slice does not alter the original array. It returns a shallow copy of elements from the original array. Elements of the original array are copied into the returned array.

slice()方法将数组部分的浅拷贝返回到从开始到结束(不包括end)选择的新数组对象中，其中start和end表示该数组中项目的索引。原始数组将不会被修改。 参见Reference/Global_Objects/Array/slice

调用方法

描述:

call()允许为不同的对象赋值和调用属于一个对象的函数/方法。

call()方法使用给定的值和单独提供的参数调用函数。 Call()将this的新值提供给函数/方法。使用call()，您可以只编写一次方法，然后在另一个对象中继承它，而不必为新对象重写方法。

参见:Reference/Global_Objects/Function/call