B-Teck!

お仕事からゲームまで幅広く

【JavaScript】ArrayLikeObjectをArrayに変換する

ArrayLikeObjctとは

document.querySelectorAll()とかで戻り値になっているNodeListとかの型。
通常の配列のようにlengthとかを持っていたり、添字を使って各要素にアクセスできる。
でもArrayではないので、Arrayのメソッドとかは使えない。

そのままでは扱いづらいのでArrayに変換する方法のメモ。

// ES6以降が利用可能な環境であればこれでOKなはず。
// 一番シンプル
Array.from( arrayLikeObject ); 

// Array.fromが使えない環境用のpolyfill
if (!Array.from) {
    try {
        Array.prototype.slice.call( document.getElementsByTagName("html") );
        Array.from = function( arrayLikeObject ) {
            return Array.prototype.slice.call( arrayLikeObject );
        };
    } catch (err) {
        // Array.prototype.slice.call( ArrayLike ) でエラーになる場合は Array.apply を使う
        Array.from = function( arrayLikeObject ) {
            return Array.apply( null, arrayLikeObject );
        };
    }
}

// IE6〜IE8では使えない事もある
Array.prototype.slice.call( arrayLikeObject ); 
[].slice.call( arrayLikeObject ); 

// クロスブラウザらしい。わりと低速
Array.apply( null, arrayLikeObject ); 

// そこそこ高速だけれど、記述が冗長
var ary = []; 
for (var i = 0, iz = arrayLikeObject.length; i < iz; ++i) { 
    ary.push( arrayLikeObject[i] );
}