HTMLCollection/NodeList/擬似配列をarray_javascriptスキルに変換する実装方法

ここで、次の条件を満たすオブジェクトを疑似配列と呼びます
1、長さ属性
2 を持ち、インデックスでデータを格納します
3、配列のプッシュ、ポップなどのメソッドを持たない


1 など、関数内の引数。
2. document.forms、Form.elements、Select.options、document.getElementsByName()、document.getElementsByTagName()、childNodes/children などを通じて取得されるコレクション (HTMLCollection、NodeList)。
3.

などの特殊な書き込みメソッドを持つオブジェクト コードは次のとおりです。 >

var obj={};

obj[0] = "1";
obj[2] = "3"; .length = 3;


プッシュ、ポップ、シフト、結合などの一部の配列メソッドがありません。場合によっては、プッシュ、ポップ、その他のメソッドを使用できるように、これらの疑似配列を実際の配列に変換する必要があることがあります。以下はツール関数 makeArray です

コードをコピー

コードは次のとおりです: var makeArray = function(obj) { return Array.prototype.slice.call(obj,0);

}

try{
Array.prototype.slice.call(document.documentElement.childNodes, 0) )[0].nodeType;
}catch(e){
makeArray = function(obj){
for(var i=0,len=obj.length ; ires.push(obj[i]);
res
}
}


3 つの疑似配列

コードをコピー

コードは次のとおりです: //関数 fun を定義します内部的に makeArray を使用し、その引数は配列に変換されます。 function fun(){ var ary = makeArray(arguments); alert(ary.constructor ); Call

fun(3 ,5);

// ページ上に複数の段落要素 p があると仮定します
var els = document.getElementsByTagName("p"); var ary1 = makeArray(els);
alert(ary1.constructor);


//特殊な js オブジェクト (jquery オブジェクトなど)
var obj={}; obj[0] = "1" ;
obj[1] = "2";
obj.length = 3; = makeArray(obj);
alert(ary2.constructor);