Pertanyaan Bagaimana saya bisa menambahkan pasangan kunci / nilai ke objek JavaScript?


Berikut adalah literal objek saya:

var obj = {key1: value1, key2: value2};

Bagaimana saya bisa menambahkan {key3: value3} ke objek?


974
2017-07-22 23:21


asal


Jawaban:


Ada dua cara untuk menambahkan yang baru properti ke suatu objek:

var obj = {
    key1: value1,
    key2: value2
};

Menggunakan notasi titik:

obj.key3 = "value3";

Menggunakan notasi braket persegi:

obj["key3"] = "value3";

Bentuk pertama digunakan ketika Anda tahu nama properti. Bentuk kedua digunakan ketika nama properti ditentukan secara dinamis. Seperti dalam contoh ini:

var getProperty = function (propertyName) {
    return obj[propertyName];
};

getProperty("key1");
getProperty("key2");
getProperty("key3");

SEBUAH nyata Array JavaScript dapat dibangun menggunakan:

Notasi literal Array:

var arr = [];

Notasi konstruktor Array:

var arr = new Array();

1654
2017-07-22 23:25



Jawaban tahun 2017: Object.assign()

Object.assign (dest, src1, src2, ...) menggabungkan objek.

Itu menimpa dest dengan properti dan nilai-nilai (bagaimanapun banyak) objek sumber, kemudian kembali dest.

Itu Object.assign() metode digunakan untuk menyalin nilai dari semua properti sendiri yang ada dari satu atau lebih objek sumber ke objek target. Ini akan mengembalikan objek target.

Contoh langsung

var obj = {key1: "value1", key2: "value2"};
Object.assign(obj, {key3: "value3"});

document.body.innerHTML = JSON.stringify(obj);

Jawaban tahun 2018: operator spread objek {...}

obj = {...obj, ...pair};

Dari MDN:

Ini menyalin properti enumerable dari objek yang disediakan ke objek baru.

Shallow-cloning (tidak termasuk prototipe) atau penggabungan objek sekarang mungkin menggunakan sintaks yang lebih pendek dari Object.assign().

Perhatikan itu Object.assign() pemicu setter sedangkan spread syntax tidak.

Contoh langsung

Ini berfungsi di Chrome saat ini dan Firefox saat ini. Mereka mengatakan itu tidak berfungsi di Edge saat ini.

var obj = {key1: "value1", key2: "value2"};
var pair = {key3: "value3"};
obj = {...obj, ...pair};

document.body.innerHTML = JSON.stringify(obj);

Jawaban tahun 2019

Operator penugasan objek  +=:

obj += {key3: "value3"};


81
2017-11-04 23:51



Saya telah menyukai hal itu LoDash / Menggarisbawahi saat menulis proyek yang lebih besar.

Tambahkan oleh obj['key'] atau obj.key semua jawaban JavaScript murni murni. Namun, baik perpustakaan LoDash dan Underscore menyediakan banyak fungsi tambahan yang mudah saat bekerja dengan Objects and Arrays pada umumnya.

.push() adalah untuk Array, tidak untuk objek.

Tergantung apa yang Anda cari, ada dua fungsi spesifik yang mungkin bagus untuk digunakan dan memberikan fungsionalitas yang serupa dengan yang dirasakan arr.push(). Untuk info lebih lanjut periksa dokumen, mereka memiliki beberapa contoh bagus di sana.

_.menggabungkan (Hanya Lodash)

Objek kedua akan menimpa atau menambah objek dasar. undefined nilai tidak disalin.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.merge(obj, obj2);
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3"} 

_.extend / _.assign

Objek kedua akan menimpa atau menambah objek dasar. undefined akan disalin.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend(obj, obj2);
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

_.defaults

Objek kedua berisi default yang akan ditambahkan ke objek dasar jika tidak ada. undefined nilai akan disalin jika kunci sudah ada.

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults(obj, obj2);
console.log(obj);
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

$ .extend

Selain itu, mungkin ada baiknya menyebutkan jQuery.extend, fungsinya mirip dengan _.merge dan mungkin menjadi opsi yang lebih baik jika Anda sudah menggunakan jQuery.

Objek kedua akan menimpa atau menambah objek dasar. undefined nilai tidak disalin.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
$.extend(obj, obj2); 
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3"}

Object.assign ()

Ini mungkin layak disebutkan ES6 / ES2015 Object.assign, fungsinya mirip dengan _.merge dan mungkin menjadi pilihan terbaik jika Anda sudah menggunakan polyfill ES6 / ES2015 seperti Babel jika Anda menghendaki polyfill sendiri.

Objek kedua akan menimpa atau menambah objek dasar. undefined akan disalin.

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign(obj, obj2); 
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

77
2017-11-24 18:11



Anda bisa menggunakan salah satu dari ini (asalkan key3 adalah kunci acutal yang ingin Anda gunakan)

arr[ 'key3' ] = value3;

atau

arr.key3 = value3;

Jika key3 adalah variabel, maka Anda harus melakukan:

var key3 = 'a_key';
var value3 = 3;
arr[ key3 ] = value3;

Setelah ini, meminta arr.a_key akan mengembalikan nilai value3, secara harfiah 3.


62
2017-07-22 23:22



arr.key3 = value3;

karena array Anda tidak benar-benar sebuah array ... Ini adalah objek prototipe. Array yang sebenarnya adalah:

var arr = [{key1: value1}, {key2: value2}];

tapi itu masih belum benar. Ini sebenarnya harus:

var arr = [{key: key1, value: value1}, {key: key2, value: value2}];

26
2017-07-22 23:25



var employees = []; 
employees.push({id:100,name:'Yashwant',age:30});
employees.push({id:200,name:'Mahesh',age:35});

23
2017-10-27 17:49



Saya tahu sudah ada jawaban yang diterima untuk ini, tetapi saya pikir saya akan mendokumentasikan ide saya di suatu tempat. Tolong [orang] merasa bebas untuk melubangi ide ini, karena saya tidak yakin apakah itu solusi terbaik ... tapi saya hanya menyatukan ini beberapa menit yang lalu:

Object.prototype.push = function( key, value ){
   this[ key ] = value;
   return this;
}

Anda akan menggunakannya dengan cara ini:

var obj = {key1: value1, key2: value2};
obj.push( "key3", "value3" );

Karena, fungsi prototipe kembali this Anda dapat terus berantai .pushke ujung dari Anda obj variabel: obj.push(...).push(...).push(...);

Fitur lainnya adalah Anda bisa mengirimkan array atau objek lain sebagai nilai dalam argumen fungsi push. Lihat biola saya untuk contoh kerja: http://jsfiddle.net/7tEme/


8
2018-06-26 18:34



Anda dapat membuat kelas dengan jawabannya @ Ionuț G. Stan

function obj(){
    obj=new Object();
    this.add=function(key,value){
        obj[""+key+""]=value;
    }
    this.obj=obj
}

Membuat objek baru dengan kelas terakhir:

my_obj=new obj();
my_obj.add('key1', 'value1');
my_obj.add('key2', 'value2');
my_obj.add('key3','value3');

Mencetak objek

console.log(my_obj.obj) // Return {key1: "value1", key2: "value2", key3: "value3"} 

Mencetak Kunci

console.log(my_obj.obj["key3"]) //Return value3

Saya pemula dalam javascript, komentar dipersilahkan. Bekerja untukku.


8
2017-12-28 01:34