Tambahkan properti ke objek JavaScript menggunakan variabel sebagai namanya?

Saya menarik item dari DOM dengan jQuery dan ingin mengatur properti pada objek menggunakan idelemen DOM.

Contoh

const obj = {}

jQuery(itemsFromDom).each(function() {
  const element = jQuery(this)
  const name = element.attr('id')
  const value = element.attr('value')

  // Here is the problem
  obj.name = value
})

Jika itemsFromDommenyertakan elemen dengan id"myId", saya ingin objmemiliki properti bernama "myId". Di atas memberi saya name.

Bagaimana cara saya memberi nama properti suatu objek menggunakan variabel menggunakan JavaScript?

Anda dapat menggunakan sintaks yang setara ini:

obj[name] = value

Dengan ECMAScript 2015 Anda dapat melakukannya secara langsung dalam deklarasi objek menggunakan notasi braket:

var obj = {
  [key]: value
}

Di mana keysegala jenis ekspresi (misalnya variabel) yang mengembalikan nilai:

var obj = {
  ['hello']: 'World',
  [x + 2]: 42,
  [someObject.getId()]: someVar
}

Anda bahkan dapat membuat Daftar objek seperti ini

var feeTypeList = [];
$('#feeTypeTable > tbody > tr').each(function (i, el) {
    var feeType = {};

    var $ID = $(this).find("input[id^=txtFeeType]").attr('id');

    feeType["feeTypeID"] = $('#ddlTerm').val();
    feeType["feeTypeName"] = $('#ddlProgram').val();
    feeType["feeTypeDescription"] = $('#ddlBatch').val();

    feeTypeList.push(feeType);
});

Ada dua notasi yang berbeda untuk mengakses properti objek

• Notasi dot : myObj.prop1
• Notasi braket : myObj ["prop1"]

Notasi dot cepat dan mudah tetapi Anda harus menggunakan nama properti yang sebenarnya secara eksplisit. Tidak ada substitusi, variabel, dll.

Notasi braket terbuka berakhir. Ini menggunakan string tetapi Anda dapat menghasilkan string menggunakan kode js hukum. Anda dapat menentukan string sebagai literal (meskipun dalam kasus ini notasi titik akan lebih mudah dibaca) atau menggunakan variabel atau menghitung dengan cara tertentu.

Jadi, ini semua mengatur properti myObj bernama prop1 ke nilai Halo :

// quick easy-on-the-eye dot notation
myObj.prop1 = "Hello";

// brackets+literal
myObj["prop1"] = "Hello";

// using a variable
var x = "prop1"; 
myObj[x] = "Hello";                     

// calculate the accessor string in some weird way
var numList = [0,1,2];
myObj[ "prop" + numList[1] ] = "Hello";     

Perangkap:

myObj.[xxxx] = "Hello";      // wrong: mixed notations, syntax fail
myObj[prop1] = "Hello";      // wrong: this expects a variable called prop1

tl; dnr : Jika Anda ingin menghitung atau merujuk kunci, Anda harus menggunakan notasi braket . Jika Anda menggunakan kunci secara eksplisit, maka gunakan notasi titik untuk kode yang jelas sederhana.

Catatan: ada beberapa jawaban lain yang baik dan benar, tetapi saya pribadi menemukan mereka agak singkat berasal dari keakraban dengan JS on-the-fly quirkiness. Ini mungkin bermanfaat bagi sebagian orang.

Dengan lodash, Anda dapat membuat objek baru seperti ini _.set :

obj = _.set({}, key, val);

Atau Anda dapat mengatur ke objek yang ada seperti ini:

var existingObj = { a: 1 };
_.set(existingObj, 'a', 5); // existingObj will be: { a: 5 }

Anda harus berhati-hati jika Anda ingin menggunakan titik (".") Di jalur Anda, karena lodash dapat mengatur hierarki, misalnya:

_.set({}, "a.b.c", "d"); // { "a": { "b": { "c": "d" } } }

Pertama kita perlu mendefinisikan kunci sebagai variabel dan kemudian kita perlu menetapkan kunci sebagai objek., Misalnya

var data = {key:'dynamic_key',value:'dynamic_value'}
var key = data.key;
var obj = { [key]: data.value}
console.log(obj)

Dengan munculnya ES2015 Object.assign dan nama properti yang dikomputasi, kode OP bermuara pada:

var obj = Object.assign.apply({}, $(itemsFromDom).map((i, el) => ({[el.id]: el.value})));

Jika Anda ingin menambahkan bidang ke objek secara dinamis, cara termudah untuk melakukannya adalah sebagai berikut:

 var params= [
{key: "k1", value=1},
{key: "k2", value=2},
{key: "k3", value=3}];

for(i=0; i< params.len; i++) {
  data[params[i].key] = params[i].value
}

Ini akan membuat objek data yang memiliki bidang berikut:

{k1:1, k2:2, k3:3}

Jika Anda memiliki objek, Anda dapat membuat array kunci, dari memetakan melalui, dan membuat objek baru dari kunci objek sebelumnya, dan nilai-nilai.

Object.keys(myObject)
.map(el =>{
 const obj = {};
 obj[el]=myObject[el].code;
 console.log(obj);
});

ajavascript memiliki dua jenis anotasi untuk mengambil properti Objek javascript:

Obj = {};

1) (.) Anotasi mis. Obj.id ini hanya akan berfungsi jika objek sudah memiliki properti dengan nama 'id'

2) ([]) anotasi misalnya. Obj [id] di sini jika objek tidak memiliki properti dengan nama 'id', itu akan membuat properti baru dengan nama 'id'.

jadi untuk contoh di bawah ini:

Properti baru akan selalu dibuat ketika Anda menulis Obj [nama]. Dan jika properti sudah ada dengan nama yang sama itu akan menimpanya.

const obj = {}
    jQuery(itemsFromDom).each(function() {
      const element = jQuery(this)
      const name = element.attr('id')
      const value = element.attr('value')
      // This will work
      obj[name]= value;
    })

Terkait dengan subjek, tidak khusus untuk jquery. Saya menggunakan ini dalam proyek reaksi EC6, mungkin membantu seseorang:

this.setState({ [`${name}`]: value}, () => {
      console.log("State updated: ", JSON.stringify(this.state[name]));
    });

NB: Harap perhatikan karakter kutipan.

objectname.newProperty = value;

const data = [{
    name: 'BMW',
    value: '25641'
  }, {
    name: 'Apple',
    value: '45876'
  },
  {
    name: 'Benz',
    value: '65784'
  },
  {
    name: 'Toyota',
    value: '254'
  }
]

const obj = {
  carsList: [{
    name: 'Ford',
    value: '47563'
  }, {
    name: 'Toyota',
    value: '254'
  }],
  pastriesList: [],
  fruitsList: [{
    name: 'Apple',
    value: '45876'
  }, {
    name: 'Pineapple',
    value: '84523'
  }]
}

let keys = Object.keys(obj);

result = {};

for(key of keys){
    let a =  [...data,...obj[key]];
    result[key] = a;

}