ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript オブジェクトで動的キーを作成するにはどうすればよいですか?

JavaScript オブジェクトで動的キーを作成するにはどうすればよいですか?

Susan Sarandon
Susan Sarandonオリジナル
2024-11-06 09:47:031044ブラウズ

How to Create Dynamic Keys in JavaScript Objects?

JavaScript オブジェクトでの動的キーの作成

オブジェクトにキーを動的に追加しようとすると、次のアプローチでは望ましい結果が得られない可能性があります:

jsObj = {};

for (let i = 1; i <= 10; i++) {
    jsObj{'key' + i} = 'example ' + 1;
}

動的キーを作成するには、ループ内で角かっこ表記を使用する必要があります:

jsObj['key' + i] = 'example ' + 1;

オブジェクトのプロパティと配列の動作について

JavaScript オブジェクトは、数値文字列 (「0」、「5」、「207」など) のプロパティ名を持つことができます。ただし、配列インスタンスの動作は大きく異なります。

  • 配列は、数値プロパティ名の数に 1 を加えたものを示す長さプロパティを維持します。
  • 長さプロパティを設定すると、数値プロパティ名が削除されます。

この動作は、オブジェクト プロパティへのアクセスと変更を提供する角かっこ演算子の機能には影響しません。

数値名によるプロパティの設定

角括弧表記を使用して数値名を持つプロパティを設定すると、次のことが発生します:

  • 配列インスタンスでは、数値名が既存の最大の場合、長さプロパティが更新されます。
  • プレーンなオブジェクトでは、そのような副作用は発生しません。

したがって、長さプロパティを維持する必要がある場合は、配列を使用して数値プロパティを格納すると有益である可能性があります。

JSON シリアル化に関する考慮事項

JSON シリアル化を使用する場合、数値的に名前が付けられた配列のプロパティのみがシリアル化された形式に含まれることに注意することが重要です。追加された他のプロパティはすべて失われます。

ES2015 計算プロパティ名

ES6 JavaScript では、計算プロパティ名を簡単に使用して動的キーを処理できます:

let key = 'DYNAMIC_KEY',
    obj = {
        [key]: 'ES6!'
    };

console.log(obj);
// { 'DYNAMIC_KEY': 'ES6!' }

以上がJavaScript オブジェクトで動的キーを作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。