在 Javascript 中什么是伪数组？如何将伪数组转化为标准数组？

在 Javascript 中什么是伪数组？如何将伪数组转化为标准数组？

1、前言

​ 今天博主JavaScript高级进阶学完了，于是在度娘上找了几套面试题，发现这个题不知道怎么答，并且感觉这道面试图也挺经典的，所以拿出来跟大家一起学习一下，如果这真是面试题估计我就凉凉了，所以还请各位博友认真对待，那么我们开始喽！

2、什么是伪数组（NodeList）？

​ 伪数组（NodeList），又称类数组，指无法直接调用数组的方法，或期望length属性有什么特殊的行为，但仍可以使用对标准数组遍历的方法来遍历它们，比如for循环。典型的是函数arguments参数，还有像调用getElementByTagName()、document.childNodes()之类的方法，它们都返回NodeList对象，都属于伪数组。那么我们可以将伪数组的特征总结为以下几点。

伪数组的特征：

1.	具有`length`属性
2.	按索引方式存储数据
3.	不具有数组的方法

3、伪数组转换为标准数组

​ 通过上面的讲解，相信大家也已经知道了伪数组，以及伪数组的特征，那么在开发中，我们需要将伪数组转换为数组来直接使用，那该怎么办呢？这里给大家介绍两套方案，如下：

方案1：

 window.onload = function() {
            function nodeList() {
               return Array.prototype.slice.call(arguments);
            }
            let arr = nodeList(1, 2, 3, 4, 5, 6, 7);
            arr.push(20);
            console.log(arr);
        }

分析：

1.	从这行code`Array.prototype.slice.call(arguments)`我们发现使用到了`call()`方法，`call()`方法是任何函数都具备的非继承而来的方法，其作用是修改函数内的this指向
2.	`Array.prototype.slice`这行code是通过`Array`构造函数调用其原型对象中的`slice()`方法
3.	`slice(start,end)`方法可以从已有的数组中返回选定的元素数组
4.	`start`参数：必须，规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。也就是说，-1 指最后一个元素，-2 指倒数第二个元素，以此类推。
5.	`end`参数：可选，规定从何处结束选取。该参数是数组片段结束处的下标索引如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数，那么它规定的是从数组尾部开始算起的元素。
6.	那么`Array.prototype.slice.call(arguments)`的意思就是：通过`Array`数组构造函数调用原型对象中的`slice()`方法，并通过`call()`方法改变其`slice()`方法的内部this指向，修改为`arguments`，即伪数组对象。
7.	通过这样的方法，我们就可以返回一个数组对象，这样就将伪数组转换为标准数组了

方案2：

​ 通过上面的方法将伪数组转换为标准数组，对于还没有学过原型对象的博友可能会有一点不知所云。不管没关系，在 JavaScript ES6 中，Array构造函数为大家提供了一个方法，专门用于将伪数组（类数组）转换为真正的数组。

​ from()方法用于通过拥有length属性的对象或可迭代的对象来返回一个数组。可能有一点绕，简单来说就是，from()方法是将一个伪数组对象或者可迭代对象转换成一个正真的数组。

浏览器支持：

语法格式：

Array.from(object,mapFunction,thisValue);

参数说明：

1.	`object`：必须，要转换为数组的对象。
2.	`mapFunction`：可选，数组中每个元素要调用的函数。
3.	`thisValue`：可选，映射函数（mapFunction）中的this对象

window.onload = function() {
            function nodeList() {
                return Array.from(arguments);
            }
            let arr = nodeList(1, 2, 3, 4, 5, 6, 7);
            arr.push(20);
            console.log(arr);
        }

当然，除了这两种方法肯定还有其他的方法，但是博主今天只学会了这两种，所以非常抱歉。后期如果发现新的方法，将第一时间给大家分享。感谢您的捧场，祝您事业有成，工作顺利！