第一次听说伪数组这个概念，听到的时候还以为是说CSS的伪类呢，网上一查，这东西原来还是个很常见的家伙。
何为伪数组
伪数组有两个特点：
- 具有length属性，其他属性（索引）为非负整数
- 但是却不具备数组的方法
也就是看起来像是数组，然而并不是…
举个例子看看
- 函数内部的arguments
function testArguments(a, b, c) {console.log(`arguments is array: ${Array.isArray(arguments)}`);console.log(arguments[0]);console.log(arguments[1]);console.log(arguments[2]);
}
testArguments(1,2,3);
2. DOM列表
- JQuery选择得出的列表: $(‘div’)
随意找一个使用jq的网站，例如：https://www.jq22.com/
如何判断真伪数组
- 使用instanceof 方法
- 使用Array.isArray()方法: 未必准确，见下文， 使用
伪数组.__proto__ = Array.prototype;转换后不可用。 - 伪数组.constructor === Array; 适用于带constructor的场景
- Object.prototype.toString.call(arr) === ‘[object Array]’
尝试一下：
function testArguments(a, b, c) {console.log(`arguments is array: ${Array.isArray(arguments)}`);console.log(`arguments is array: ${arguments instanceof Array}`);console.log(`arguments is object: ${arguments instanceof Object}`);const newArguments = Array.prototype.slice.call(arguments);console.log(`newArguments is array: ${Array.isArray(newArguments)}`);console.log(`newArguments is array: ${newArguments instanceof Array}`);console.log(`newArguments is object: ${newArguments instanceof Object}`);
}testArguments(1,2,3);
如何把伪数组转换成数组
Array.prototype.slice.call(); / Array.prototype.slice.apply();- 原型继承：
伪数组.__proto__ = Array.prototype;arguments 无影响正常使用 - ES6中数组的新方法 from()
方法一： Array.prototype.slice.call(); / Array.prototype.slice.apply();
function testArguments(a, b, c) {console.log(`arguments is array: ${Array.isArray(arguments)}`);console.log(arguments[0]);console.log(arguments[1]);console.log(arguments[2]);const newArguments = Array.prototype.slice.call(arguments);console.log(`newArguments is array: ${Array.isArray(newArguments)}`);console.log(newArguments[0]);console.log(newArguments[1]);console.log(newArguments[2]);
}
testArguments(1,2,3);
方法二： 原型继承： 伪数组.__proto__ = Array.prototype;arguments 无影响正常使用
使用该方法进行转换时，Array.isArray()方法不可用来进行判断。
方法三： ES6中数组的新方法 from()
尝试一下：
function testArguments(a, b, c) {console.log(`arguments is array: ${Array.isArray(arguments)}`);console.log(`arguments is array: ${arguments instanceof Array}`);const newArguments = Array.from(arguments);console.log(`newArguments is array: ${Array.isArray(newArguments)}`);console.log(`newArguments is array: ${newArguments instanceof Array}`);
}
testArguments(1,2,3);
总结
- 在使用判断是否为数组时，如果无法知道数组是否可能是使用“原型继承”的方法转换得到的，就不要使用Array.isArray()方法判断对象是否为数组的方法。
- 在写转换方法时，由于原型继承：
伪数组.__proto__ = Array.prototype;可能存在判断失误，尽量使用Array.prototype.slice.call(); / Array.prototype.slice.apply();如果可以使用ES6，使用Array.from()方法较为简单明了。
