Javascript 配列とディクショナリの使用法とオブジェクト属性のトラバース テクニック_JavaScript テクニック

JavaScript の配列 Array は配列でもあり、辞書でもあります。配列の使用方法を例として見てみましょう。

コードをコピーします コードは次のとおりです。

var a = new Array(); 🎜>a [0] = "エイサー";
a[1] = "デル";
for (var i = 0; i alert(a[ i]) ;
}

辞書の使い方を見てみましょう。

コードをコピーします コードは次のとおりです。

varcomputer_price = new Array(); 🎜>computer_price ["Acer"] = 500;
computer_price["Dell"] = 600;


としてトラバースすることもできます。上記の配列 (辞書)

コードをコピー コードは次のとおりです。 for (var i incomputer_price) {

alert(i ": "computer_price[i]);

}


ここでの i は辞書の各キー値です。出力結果は次のようになります:
Acer: 500

Dell: 600

また、computer_price は辞書オブジェクトであり、その各キー値は属性です。つまり、Acer はcomputer_price の属性です。次のように使用できます:
computer_price.Acer

辞書と配列の単純化された宣言を見てみましょう。
var array = [1, 2, 3]; // Array
var array2 = { "Acer": 500, "Dell": 600 }; // Dictionary
alert(array2.Acer); // 500
この辞書の宣言は前の宣言と同じです。この例では、Acer はキー値であり、辞書オブジェクトの属性としても使用できます。

オブジェクトのプロパティをトラバースする方法を見てみましょう。 for in を使用して、オブジェクトのプロパティを反復処理できます。

コードをコピー コードは次のとおりです。 function Computer(brand,price) {

this .brand = ブランド;

this.price = 価格;
var mycomputer("Acer", 500);
for (var prop in mycomputer); >alert( "computer[" prop "]=" mycomputer[prop]);
}


上記のコードでは、Computer にはブランドと価格という 2 つの属性があるため、出力結果は次のようになります。 :
computer[brand]=Acer
computer[price]=500
上記の使用法は、オブジェクトがどのような属性を持っているかを確認するために使用できます。 Computer オブジェクトにブランド属性があることがすでにわかっている場合は、

mycomputer.brand
または mycomputer[brand]
を使用して属性値を取得できます。
要約: Javascript の配列は辞書の作成にも使用できます。辞書のキー値も辞書オブジェクトのプロパティです。オブジェクトのプロパティを調べるときは、for in を使用できます。

配列の走査とプロパティ
配列は JavaScript のオブジェクトですが、配列を走査するために for in ループを使用する正当な理由はありません。
逆に、配列の反復処理に for in を使用しない正当な理由がいくつかあります。
注: JavaScript の配列は連想配列ではありません。
JavaScript には、キーと値の対応を管理するオブジェクトのみがあります。ただし、連想配列は順序を維持しますが、オブジェクトは順序を維持しません。
for in ループはプロトタイプ チェーン上のすべてのプロパティを列挙するため、これらのプロパティをフィルタリングする唯一の方法は hasOwnProperty 関数を使用することです。
そのため、通常の for ループよりも何倍も遅くなります。
トラバーサル
配列のトラバースで最高のパフォーマンスを達成するには、従来の for ループを使用することをお勧めします。




コードをコピー

コードは次のとおりです: var list = [1, 2, 3 , 4, 5, ... 100000000]; for(var i = 0, l = list.length; i console.log(list[i]); >}

上記のコードには、l = list.length によって配列の長さをキャッシュする処理があります。
長さは配列のプロパティですが、各ループで長さにアクセスするとパフォーマンスのオーバーヘッドが発生します。
最新の JavaScript エンジンはこの点で最適化されている可能性がありますが、コードがこれらの最新のエンジンで実行されるかどうかは保証できません。
実際、配列の長さをキャッシュしない方法は、キャッシュされたバージョンよりもはるかに遅くなります。
length 属性

length 属性の getter メソッドは単純に配列の長さを返しますが、setter メソッドは配列を切り詰めます。




コードをコピー

コードは次のとおりです:

var foo = [1, 2, 3, 4, 5, 6];
foo.length = 3; // [1, 2, 3]
foo; .length = 6;
foo; // [1, 2, 3]

翻訳者注:
この時点の foo の値を表示します: [1, 2 , 3、未定義、未定義、未定義]
しかし、Chrome のコンソールで foo の結果を表示すると、次のようになっていることがわかります: [1, 2, 3]
JavaScript では、未定義は変数です。変数はキーワードではないため、上記の 2 つの結果の意味はまったく異なります。
// 翻訳者注: 検証するために、次のコードを実行して、シリアル番号 5 が foo に存在するかどうかを確認してみましょう。
5 in foo; // Firebug または Chrome のどちらでも false を返します。
foo[5] = unknown;
5 in foo; // Firebug または Chrome の場合、
は長さ A に設定されます。値を小さくすると配列が切り詰められますが、length プロパティを増やしても配列には影響しません。
結論
パフォーマンスを向上させるには、通常の for ループを使用し、配列の長さプロパティをキャッシュすることをお勧めします。
for in を使用して配列を反復処理することは、間違ったコーディング方法とみなされ、エラーが生成され、パフォーマンスの問題が発生する傾向があります。