NodeList和Array数组的区别

首先，什么是NodeList集合呢？如果你不懂的话，可以先参考如下代码（这里是我截取的代码块）：

    
1
    
2
    
3
    
4
    
5
    
6
    
7

var lis=document.querySelectorAll("li");
console.log(lis);  //控制台输出为：NodeList(7) [li, li, li, li, li, li, li]

从上面的代码块，相信大家对NodeList有些见解。NodeList含有数组的部分属性但又不完全是数组，也可以称之“伪数组”。这里可以使用Array.isArray()方法的返回值来检验是否为真正数组，若返回值为true为数组，返回值为false则非数组。

var lis=document.querySelectorAll("li");
console.log(Array.isArray(lis));    //false

为了更好的理解NodeList集合，我特意从网上查了些资料：NodeList是Dom操作得到的元素集合而不是普通数组，也可以称为“伪数组”，它含有数组的部分属性，如：length，索引；但NodeList自身最大的特点就是时效性（live），这里不做过多解释，想了解的伙伴自己动手~~~

最后一点：将NodeList转为数组方法：

方法一：通过深拷贝，遍历“伪数组”（这里是我将它称为“伪数组”），将遍历的值重新赋值给新数组，从而完成深拷贝。
方法二：浅拷贝，通过Array.from()方法对“伪数组”进行浅拷贝为数组的实例。

//    var lis=document.querySelectorAll("li");
//    console.log(lis);  //NodeList(7) [li, li, li, li, li, li, li]
//    var liss=Array.from(document.querySelectorAll("li"));
//    console.log(liss);  //[li, li, li, li, li, li, li]
//    var li=Array.isArray(document.querySelectorAll("li"));  //判断是否为数组
//    console.log(li);  //false