這篇文章拖了有兩周凌埂，今天來跟大家聊聊 JavaScript 中一類特殊的對象 -> Array-Like Objects。
（本文節(jié)選自 underscore 源碼解讀系列文章拆祈，完整版請關注 https://github.com/hanzichi/underscore-analysis）
Array-Like
JavaScript 中一切皆為對象，那么什么是 Array-Like Objects倘感？顧名思義放坏，就是像數(shù)組的對象，當然老玛，數(shù)組本身就是對象嘛淤年！稍微有點基礎的同學钧敞，一定知道 arguments 就是 Array-Like Objects 的一種，能像數(shù)組一樣用 [] 去訪問 arguments 的元素麸粮，有 length 屬性溉苛，但是卻不能用一些數(shù)組的方法，如 push弄诲，pop愚战，等等。
那么齐遵，什么樣的元素是 Array-Like Objects寂玲？我們來看看 underscore 中對其的定義。
var MAX_ARRAY_INDEX = Math.pow(2, 53) - 1;
var getLength = property('length');
var isArrayLike = function(collection) {
var length = getLength(collection);
return typeof length == 'number' && length >= 0 && length <= MAX_ARRAY_INDEX;
};
很簡單梗摇，不是數(shù)組拓哟，但是有 length 屬性尔许，且屬性值為非負 Number 類型即可广料。至于 length 屬性的值汁雷，underscore 給出了一個上限值 MAX_ARRAY_INDEX茅特，其實是 MAX_SAFE_INTEGER（感謝 @HangYang 同學指出） ，因為這是 JavaScript 中能精確表示的最大數(shù)字春瞬。
想想還有什么同時能滿足以上條件的？NodeList，HTML Collections景图，仔細想想，甚至還有字符串碉哑，或者擁有 length 屬性的對象挚币，函數(shù)（length 屬性值為形參數(shù)量），等等扣典。
Array-Like to Array
有的時候妆毕，需要將 Array-Like Objects 轉為 Array 類型，使之能用數(shù)組的一些方法贮尖，一個非常簡單粗暴并且兼容性良好的方法是新建個數(shù)組笛粘，然后循環(huán)存入數(shù)據(jù)。
我們以 arguments 為例湿硝。
function fn() {
// Uncaught TypeError: arguments.push is not a function
// arguments.push(4);
var arr = [];
for (var i = 0, len = arguments.length; i < len; i++)
arr[i] = arguments[i];
arr.push(4); // [1, 2, 3, 4]
}
fn(1, 2, 3);
但是這不是最優(yōu)雅的薪前，更優(yōu)雅的解法大家一定都知道了，use Array.prototype.slice（IE9- 會有問題）关斜。
function fn() {
var arr = Array.prototype.slice.call(arguments);
arr.push(4); // arr -> [1, 2, 3, 4]
}
fn(1, 2, 3);
或者可以用 [] 代替 Array.prototype 節(jié)省幾個字節(jié)示括。
function fn() {
var arr = [].slice.call(arguments);
arr.push(4); // arr -> [1, 2, 3, 4]
}
fn(1, 2, 3);
如果非得追求性能，用 [] 會新建個數(shù)組痢畜，性能肯定不及前者垛膝，但是由于引擎的優(yōu)化鳍侣，這點差異基本可以忽略不計了（所以很多框架用的就是后者）。
為什么這樣可以轉換吼拥？我們簡單了解下倚聚，主要的原因是 slice 方法只需要參數(shù)有 length 屬性即可。首先扔罪，slice 方法得到的結果是一個 新的數(shù)組秉沼，通過 Array.prototype.slice.call 傳入的參數(shù)（假設為 a），如果沒有 length 屬性矿酵，或者 length 屬性值不是 Number 類型唬复，或者為負，那么直接返回一個空數(shù)組全肮，否則返回 a[0]-a[length-1] 組成的數(shù)組敞咧。(具體可以看下 v8 源碼 https://github.com/v8/v8/blob/master/src/js/array.js#L621-L660）
當然，ES6 提供了更簡便的方法辜腺。
var str = "helloworld";
var arr = Array.from(str);
// ["h", "e", "l", "l", "o", "w", "o", "r", "l", "d"]
小結下休建，如果要把 Array-Like Objects 轉為 Array，首選 Array.prototype.slice评疗，但是由于 IE 下 Array.prototype.slice.call(nodes) 會拋出錯誤（because a DOM NodeList is not a JavaScript object）测砂，所以兼容的寫法如下。（但還有一點要注意的是百匆，如果是 arguments 轉為 Array砌些，最好別用 Array.prototype.slice，V8 下會很慢加匈，具體可以看下 避免修改和傳遞 arguments 給其他方法 — 影響優(yōu)化 ）
function nodeListToArray(nodes){
var arr, length;
try {
// works in every browser except IE
arr = [].slice.call(nodes);
return arr;
} catch(err){
// slower, but works in IE
arr = [];
length = nodes.length;
for(var i = 0; i < length; i++){
arr.push(nodes[i]);
}
return arr;
}
}
Others
很多時候存璃，某個方法你以為接收的參數(shù)是數(shù)組，其實類數(shù)組也是可以的雕拼。
Function.prototype.apply() 函數(shù)接收的第二個參數(shù)纵东，其實也可以是類數(shù)組。
var obj = {0: 4, length: 2};
var arr = [1, 2, 3];
Array.prototype.push.apply(arr, obj);
console.log(arr); // [1, 2, 3, 4, undefined]
