変数を使用して JS 属性名を動的に設定する_JavaScript スキル

ターゲット: js 属性名で変数を使用できる

例: js オブジェクト オブジェクトに属性を割り当てる場合、次のメソッドを使用できます

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

変数オブジェクト
object.prop1 = "値1";
object.prop2 = "値2"

次の方法も使用できます:

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

object.push({prop1:"value1"});
object.push({prop2:"value2"});

ここで prop1 は属性名として使用されており、直接使用することも、
のように引用符で囲んで使用することもできます。

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

object.push({"prop1":"value1"});

式の意味は同じです。つまり、prop1 は定数としてのみ認識され、変数であっても役に立ちません。次に例を示します。

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

var prop1 = "prop2"; object.push({prop1:"value1"});

たとえば、
のようにオブジェクトを通じて prop2 にアクセスするとどうなりますか?

コードをコピー

コードは次のとおりです: alert(object.prop2)

もちろん未定義ですが、object.prop1 にアクセスするのは "value1"

です。
その理由はすでに述べましたが、引用符が含まれているかどうかに関係なく、属性は定数として扱われます。

コードをコピー

コードは次のとおりです: var arr=[]; arr['js']='jquery'; arr['css']='oocss'; var obj={}; for(arr の変数 i) {

obj.i=arr[i]

}
アラート(obj.js);


読者の皆さん、どのようなアラートが出力されるか推測してください。

もちろん未定義です。

もう一度考えてみましょう。alert(obj.i) の場合は何が出力されるでしょうか?

もちろん、それは oocss ですが、なぜですか? obj には属性 i が 1 つしかなく、2 つのループを通じて obj.i の前が後者によって上書きされるからです。

需要がある場合は、属性を動的に追加する必要があります。つまり、上記のコード例のように、alert(obj.js) は未定義ではなく、jquery を使用する必要があります。変更しますか?

コードをコピー

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

var arr=[]; arr['js']='jquery'; arr['css']='oocss'; var obj={}; for(arr の変数 i)

{ obj[i]=arr[i] } アラート(obj.js); それは非常に簡単です! オブジェクト obj を配列として扱い、添字と同様のメソッドを使用してオブジェクトに属性と属性値を割り当てることができます。ただし、オブジェクトは依然としてオブジェクトであり、