JavaScriptの擬似配列と配列の使い方と違い

擬似配列と配列

JavaScript では、5 つのプリミティブデータ型を除き、関数を含め、その他すべてはオブジェクトです。

オブジェクトと配列の関係

違いについて話す前に、JavaScript のプロトタイプ継承という別の知識について触れておく必要があります。

JavaScript の組み込みコンストラクターはすべて Object.prototype から継承します。

この前提の下では、new Array() または [] を使用して作成された配列オブジェクトは Object.prototype のプロパティ値を持つことがわかります。

var obj = {}; // Object.prototype のプロパティ値を持ちます var arr = [];
//Array.prototypeのプロパティはObject.prototypeから継承されるため、配列リテラルを使用して配列が作成されます。
//するとArray.prototypeとObject.prototypeの両方のプロパティ値を持つことになります

オブジェクトと配列の最初の違いは、オブジェクトには配列の Array.prototype プロパティ値がないことです。

配列とは何か

配列には、オブジェクトにはない基本的な機能であるインデックスがあります。コードの一部を見てみましょう。

var obj = {};
var arr = [];
 
obj[2] = 'a';
arr[2] = 'a';
 
console.log(obj[2]); // => a
console.log(arr[2]); // => a
console.log(obj.length); // => 未定義
console.log(arr.length); // => 3

オブジェクトはデータにアクセスするための通常のキーと値のペアであるため、obj[2]は「a」を出力します。
ただし、arr[2]は「a」を出力します。配列はインデックスによってデータを格納およびアクセスします。arr[2]が「a」を出力する理由は、データがすでに配列arrのインデックス2に格納されているためです。
obj.lengthは配列の特性を持たず、objは属性の長さを保存しないので、当然undefinedを出力します。
配列の場合、長さは配列の組み込みプロパティであり、配列はインデックスの長さに応じて長さの値を変更します。
arr.length が 1 ではなく 3 を出力するのはなぜですか?
- 配列に要素を追加する場合、連続したインデックスに従って追加されるわけではないため、配列のインデックスは不連続になり、インデックスの長さが要素数よりも大きくなります。

疑似配列とは何ですか?

長さプロパティがあり、その他のプロパティ（インデックス）は非負の整数です（オブジェクト内のインデックスは文字列として扱われるため、非負の整数の文字列として理解できます）
配列が持つメソッドを持たない

疑似配列は、配列のような長さ属性を持ち、さらに 0、1、2、3 などの属性も持つオブジェクトです。配列のように見えますが、配列ではありません。例:

var 偽の配列 = {
  "0": "最初",
  "1": "秒",
  "2": "3番目",
  長さ: 3
};
 
(var i = 0; i < fakeArray.length; i++) {
  コンソールにログ出力します。
}
 
Array.prototype.join.call(fakeArray,'+');

一般的な疑似配列は次のとおりです。

関数内の引数
DOM オブジェクトのリスト (document.getElementsByTags によって取得されるリストなど)
jQuery オブジェクト (例: $("div") )

疑似配列はオブジェクトですが、実際の配列は配列です。

疑似配列の目的は、通常のオブジェクトが次のような配列の多くのメソッドを通常どおりに使用できるようにすることです。

var arr = Array.prototype.slice.call(引数);
 
Array.prototype.forEach.call(引数, 関数(v) {
  // 引数オブジェクトをループします });

// 押す
//いくつかの
// 毎
// フィルター
// マップ
// ...

上記は、配列プロトタイプメソッドを借用するときに配列リテラルを使用することで簡略化できます。

var obj = {
  0: 'あ'、
  1: 'b'、
  2: 'c'、
  長さ: 3
}

;[].push.call(obj, 'd')

コンソールログ([].slice.call(obj))

;[].forEach.call(obj, 関数(num, インデックス) {
  コンソール.log(数値)
})

両者の違い

1. 長さ:

真の配列は可変長である
擬似配列の長さは不変である

2. 方法の使用：

真の配列は配列メソッドを使用できる
擬似配列では配列メソッドを使用できません

まとめ

オブジェクトには配列プロパティ値がありません。プロトタイプの型は Object ですが、配列の型は Array です。
配列はインデックスに基づいて実装され、長さは自動的に更新され、オブジェクトはキーと値のペアです。オブジェクトを使用すると、疑似配列を作成でき、疑似配列では配列のほとんどのメソッドを正常に使用できます。

要約する

JavaScript の擬似配列と配列の使い方と違いについての記事はこれで終わりです。JavaScript の擬似配列と配列に関するより詳しい内容については、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続きご覧ください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません: