Cara mengatur nama properti objek JS dari variabel


178

Saya perlu menetapkan nama properti objek JS secara dinamis.

for(i=1; i<3; i++) {
    var key  = i+'name';

    data = {
        key : 'name1',
    }
}

Hasilnya harus:

data = {
    1name: 'name1'
    2name: 'name1'
}

Jika mereka berurutan, mengapa Anda tidak menggunakan Array?
epascarello

Saya ingin tahu kalian bertiga yang memukul panah yang salah. Ayo, cepat.
Charles

Jawaban:


194
var jsonVariable = {};
for(var i=1; i < 3; i++) {
  jsonVariable[i + 'name'] = 'name' + i;        
}

4
Respons Musa di bawah ini juga dengan benar menyatakan bahwa menggunakan notasi [] sebenarnya satu-satunya cara untuk melakukannya.
Dennis Plucinik

1
Perhatikan juga bahwa respons @ ChilNut di bawah sekarang menjelaskan cara termudah untuk melakukan ini menggunakan ES6
rambossa

1
Sebenarnya, dengan sintaks baru yang ingin dicapai oleh OP hanya akan mungkin jika batas loop hardcoded dan kecil.
Musa

168

Anda harus menggunakan []notasi untuk mengatur kunci secara dinamis.

var jsonVariable = {};
for(i=1; i<3; i++) {        
 var jsonKey  = i+'name';
 jsonVariable[jsonKey] = 'name1';

}

Sekarang di ES6 Anda dapat menggunakan sintaks literal objek untuk membuat kunci objek secara dinamis, cukup bungkus variabelnya []

var key  = i + 'name';
data = {
    [key] : 'name1',
}

3
jsonVariable = {}; seharusnya tidak diinisialisasi di dalam for loop.
penutupan

Anda juga membuat jsonVariable global di sini
Dennis Plucinik

130

Dengan ECMAScript 6, Anda bisa menggunakan nama properti variabel dengan sintaks literal objek, seperti ini:

var keyName = 'myKey';
var obj = {
              [keyName]: 1
          };
obj.myKey;//1

Sintaks ini tersedia di browser yang lebih baru berikut:

Edge 12+ (Tanpa dukungan IE), FF34 +, Chrome 44+, Opera 31+, Safari 7.1+

( https://kangax.github.io/compat-table/es6/ )

Anda dapat menambahkan dukungan ke browser lama dengan menggunakan transpiler seperti babel . Sangat mudah untuk mengubah seluruh proyek jika Anda menggunakan bundler modul seperti rollup atau webpack .


2
Terima kasih telah menambahkan sintaks ES6 yang mengagumkan
rambossa

Tanpa ES6 saya tidak dapat mendefinisikan var payload = {dynamicKey: val}, saya perlu melakukan var payload = {} dan payload [variableName] = val.
Sainath SR

23

Ini adalah cara untuk menetapkan nilai secara dinamis

var jsonVariable = {};
for (var i = 1; i < 3; i++) {
    var jsonKey = i + 'name';
    jsonVariable[jsonKey] = 'name' + i;
}


7

Tidak masalah dari mana variabel tersebut berasal. Hal utama yang kita miliki satu ... Tetapkan nama variabel antara tanda kurung "[..]".

var optionName = 'nameA';
var JsonVar = {
[optionName] : 'some value'
}

Ini berfungsi dengan baik, saya bertanya-tanya apakah itu bekerja di semua browser / versi
Merkurius

1
jsonVariable = {}
for(i=1; i<3; i++) {        
   var jsonKey  = i+'name';
   jsonVariable[jsonKey] = 'name1'
}

ini akan mirip dengan

    jsonVariable = {
    1name : 'name1'
    2name : 'name1'
}

0

Sejalan dengan komentar Sainath SR di atas, saya dapat menetapkan nama properti objek js dari variabel di Google Apps Script (yang belum mendukung ES6) dengan mendefinisikan objek lalu menentukan kunci / nilai lain di luar objek:

var salesperson = ...

var mailchimpInterests = { 
        "aGroupId": true,
    };

mailchimpInterests[salesperson] = true;
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.