ホームページ >ウェブフロントエンド >フロントエンドQ&A >JavaScriptの擬似配列とは何ですか
JavaScript では、配列のようなオブジェクトとも呼ばれる擬似配列は、インデックスに従ってデータを格納し、長さ属性を持つ配列のようなオブジェクトです。オブジェクトであるため、擬似-array には、array.()、forEach() およびその他のメソッドのプッシュはありません。
このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。
擬似配列 (ArrayLike)、配列状とも呼ばれます。インデックスに従ってデータを格納し、長さプロパティを持つ配列のようなオブジェクトです。 しかし、次のような特徴があります。
0: xxx、1: xxx、2: xxx...
length 属性があります
length 属性は動的ではないため、メンバーが変化しても変化しません
arrayLike.__proto__ === Object.prototype; //true arrayLike instanceof Object; //true arrayLike instanceof Array; //false
例:
var arrLike = { 0: 'a', 1: 'b', 2: 'c', length: 3, } arrLike[1]; //'a' arrLike.length; //3 arrLike.push('d'); //Uncaught TypeError: arrLike.push is not a function
疑似配列を実際の配列に変換する方法
var arrLike = { 0: 'a', 1: 'b', 2: 'c', length: 3, };1. 空の配列をトラバースして追加します
var arr = [];
for(var i = 0; i < arrLike.length; i++){
arr.push(arrLike[i]);
}
比較的シンプルでわかりやすいですが、手順が少し面倒です。
;[].slice.call(arrLike);
または
Array.prototype.slice.apply(arrLike);
新しい配列を返すには、slice() を使用します。 call() または apply() は、そのスコープを疑似配列に指します。
インデックス値以外の追加の属性は、返された配列には保持されないことに注意してください。
たとえば、jQuery の $() で取得した DOM 擬似配列の context 属性は、このメソッドで変換すると保持されません。
slice() の内部実装をシミュレートする
Array.prtotype.slice = function(start, end){ var result = new Array(); var start = start | 0; var end = end | this.length; for(var i = start; i < end; i++){ result.push(this[i]); } return result; }3. プロトタイプ ポインターを変更する
arrLike.__proto__ = Array.prototype;
このようにして、arrLike は Array のメソッドを継承します。 .prototype では、push()、unshift() などのメソッドを使用でき、長さの値も動的に変更されます。
さらに、プロトタイプ チェーンを直接変更するこの方法では、インデックス値ではない属性を含むすべての属性も擬似配列に保持されます。
4. ES2015 の Array.from() メソッドArray.from() メソッドは、配列のようなオブジェクトまたは反復可能なオブジェクトから新しい配列インスタンスを作成します。 。
var arr = Array.from(arrLike);
得られる結果は 2 番目の方法と似ており、インデックス値内の属性のみが保持されます。
[推奨学習:
JavaScript 上級チュートリアル以上がJavaScriptの擬似配列とは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。