ホームページ > 記事 > ウェブフロントエンド > JavaScript で動的な値とオブジェクトを作成するにはどうすればよいですか?
JavaScript で動的な値とオブジェクトを作成するにはどうすればよいですか?
- WBOY転載
- 2023-09-20 10:57:04681ブラウズ
動的値は、動的変数に割り当てる値です。ダイナミック変数は、特定の名前のないコード内にハードコーディングされた変数であり、そのアドレスはコードの実行中に決定されます。 「動的」という名前は、操作および変更できる値を指します。
ここでは、JavaScript で動的値 (オブジェクト値の一部) を作成し、今後グループにアクセスせずに動的変数名を変更する方法を説明します。これは、変数を宣言し、その同じ変数をオブジェクト内のキーの 1 つとして使用し、将来的に変数の名前を変更する必要がある場合に、オブジェクトにアクセスせずに変更できることを意味します。
上記のタスクを実行するには、以下に示すように角括弧 [ ] を使用してオブジェクトに変数名を割り当てるだけです -
構文
次は、動的な値とオブジェクトを作成するための構文です -
const key = 'KeyName';
const obj = { [key] : 'value'};ここで、key と value は、次の目的で使用されるキーと値のペアです。オブジェクトを作成する場合、「 obj 」と keyName > はキーの値です。
アルゴリズム
ステップ 1 - オブジェクトの作成に使用するキーを定義します。
ステップ 2 - オブジェクトを作成し、上で定義したキーを使用します。
-
ステップ 3 - 上で作成したオブジェクトに JSON.stringify() を適用して、オブジェクトを表示します。
例 1
次の HTML プログラムを使用して、動的変数の宣言を表示できます。
<!DOCTYPE html>
<html>
<body>
<h2> JavaScript Dynamic values </h2>
<div id = "result"> </div>
<script>
const key1 = "Haircolour";
const key2 = "Eyecolour";
const person = {
f_name : "Rohan",
l_name :"Joshi",
[key1] : "Black",
[key2] : "Brown"
};
// Converting the object value to show its value in html
str = JSON.stringify(person);
document.getElementById("result").innerHTML = str;
// To print value of object in console
console.log(person);
</script>
</body>
</html>つまり、上記のコードでは、中括弧 [] を使用せずにオブジェクト内で 2 つのキー f_name と l_name を宣言し、 key1 変数と key2 変数に中括弧を使用していることがわかります。動的な値。
出力では、key1 変数の名前が Eyecolour で、key2 変数の値が Haircolour であることがわかります。
例 2
これは、オブジェクトにアクセスせずに動的変数の名前を変更する方法を詳しく説明する別のコードです。ここでは、コード内の 2 つの動的変数の名前を交換するだけです。
<!DOCTYPE html>
<html>
<body>
<h2> JavaScript Dynamic values </h2>
<div id = "result"> </div>
<script>
const key1 = "Haircolour";
const key2 = "Eyecolour";
const person = {
f_name : "Rohan",
l_name :"Joshi",
[key1] : "Black",
[key2] : "Brown"
};
// Converting the object value to show its value in html
str = JSON.stringify(person);
document.getElementById("result").innerHTML = str;
// To print value of object in console
console.log(person);
</script>
</body>
</html>出力では、2 つの変数 key1 と key2 の値は同じままですが、それらの名前はオブジェクトにアクセスせずに変更されていることがわかります。つまり、これが JavaScript での動的作成方法です。の値とオブジェクト。
以上がJavaScript で動的な値とオブジェクトを作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。