Objek JavaScript adalah kumpulan properti, dan properti adalah asosiasi antara nama (atau kunci) dan nilai. Dan kami sebagai pengembang menggunakannya secara berlebihan. Pada hari-hari awal karir pemrograman saya, saya merasa sulit untuk bekerja dengan manipulasi objek. Jadi hari ini saya ingin mencantumkan cara untuk menambahkan, memperbarui, dan menghapus properti dari suatu objek
Tambahkan properti ke Objek
Seseorang dapat menambahkan properti ke objek hanya dengan memberinya nilai. Seperti contoh di bawah ini, kita menjumlahkan harta suami dan memberikan nilainya secara langsung. Kita juga dapat menggunakan tanda kurung saat menetapkan nilai
Seseorang dapat menggunakan Sintaks ES7 dan pendekatan fungsional dan menambahkan properti yang akan menghasilkan hasil yang sama
Hapus properti dari ObjekSeseorang dapat menghapus properti dari objek menggunakan kata kunci delete. Kata kunci delete_ menghapus nilai properti dan properti itu sendiri. Setelah dihapus, properti tidak dapat digunakan sebelum ditambahkan kembali
Perbarui nilai properti yang adaSeseorang dapat memperbarui nilai properti hanya dengan menugaskan kembali nilainya ke kunci yang sama
Tambahkan properti ke array Object
Anggap kita memiliki larik objek dan kita ingin menambahkan properti ke setiap objek dalam larik. Kita dapat mencapai ini dengan menggunakan banyak metode array (juga menggunakan for loop). Tapi di sini saya telah menggunakan metode array. forEach untuk beralih melalui array dan menambahkan properti ke objek
Hapus properti dari array ObjectDi sini, penghapusan dilakukan mirip dengan penambahan. Iterasi dilakukan dengan menggunakan metode array. forEach dan kemudian penghapusan dilakukan dengan menggunakan kata kunci delete
Perbarui setiap nilai properti yang ada dalam larik ObjekDi sini metode array. every digunakan untuk melakukan iterasi melalui elemen-elemen array. Properti 'tanggung jawab' dipindahkan ('jantung pertunjukan untuk' membuat orang tertawa ') ke nilai yang berbeda
Saya telah membuat daftar beberapa cara yang saya tahu cara menambah, memperbarui, dan menghapus properti. Beri komentar di bawah jika Anda tahu cara lain
Metode statis const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 0 menyalin semua properti enumerable sendiri dari satu atau lebih objek sumber ke objek target. Ini mengembalikan objek target yang dimodifikasi
Object.assign(target, ...sources) _
const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } _1
Objek target — untuk apa menerapkan properti sumber, yang dikembalikan setelah dimodifikasi
const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } _2Objek sumber — objek yang berisi properti yang ingin Anda terapkan
Objek sasaran
Properti di objek target ditimpa oleh properti di sumber jika memiliki kunci yang sama. Properti sumber selanjutnya menimpa properti sebelumnya
Metode const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 0 hanya menyalin properti yang dapat dihitung dan dimiliki dari objek sumber ke objek target. Ini menggunakan const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } _4 pada sumber dan const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 5 pada target, sehingga akan memanggil getter dan setter. Oleh karena itu memberikan properti, versus menyalin atau mendefinisikan properti baru. Ini mungkin membuatnya tidak cocok untuk menggabungkan properti baru ke dalam prototipe jika sumber gabungan berisi getter
Untuk menyalin definisi properti (termasuk penghitungannya) ke dalam prototipe, gunakan const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 6 dan const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 7 sebagai gantinya
Properti const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 8 dan const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 9 disalin
Jika terjadi kesalahan, misalnya jika properti tidak dapat ditulisi, const obj1 = { a: 0, b: { c: 0 } }; const obj2 = Object.assign({}, obj1); console.log(obj2); // { a: 0, b: { c: 0 } } obj1.a = 1; console.log(obj1); // { a: 1, b: { c: 0 } } console.log(obj2); // { a: 0, b: { c: 0 } } obj2.a = 2; console.log(obj1); // { a: 1, b: { c: 0 } } console.log(obj2); // { a: 2, b: { c: 0 } } obj2.b.c = 3; console.log(obj1); // { a: 1, b: { c: 3 } } console.log(obj2); // { a: 2, b: { c: 3 } } // Deep Clone const obj3 = { a: 0, b: { c: 0 } }; const obj4 = JSON.parse(JSON.stringify(obj3)); obj3.a = 4; obj3.b.c = 4; console.log(obj4); // { a: 0, b: { c: 0 } } 0 dimunculkan, dan objek const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 1 diubah jika ada properti yang ditambahkan sebelum kesalahan dimunculkan
Catatan. const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 0 tidak membuang const obj1 = { a: 0, b: { c: 0 } }; const obj2 = Object.assign({}, obj1); console.log(obj2); // { a: 0, b: { c: 0 } } obj1.a = 1; console.log(obj1); // { a: 1, b: { c: 0 } } console.log(obj2); // { a: 0, b: { c: 0 } } obj2.a = 2; console.log(obj1); // { a: 1, b: { c: 0 } } console.log(obj2); // { a: 2, b: { c: 0 } } obj2.b.c = 3; console.log(obj1); // { a: 1, b: { c: 3 } } console.log(obj2); // { a: 2, b: { c: 3 } } // Deep Clone const obj3 = { a: 0, b: { c: 0 } }; const obj4 = JSON.parse(JSON.stringify(obj3)); obj3.a = 4; obj3.b.c = 4; console.log(obj4); // { a: 0, b: { c: 0 } } 3 atau const obj1 = { a: 0, b: { c: 0 } }; const obj2 = Object.assign({}, obj1); console.log(obj2); // { a: 0, b: { c: 0 } } obj1.a = 1; console.log(obj1); // { a: 1, b: { c: 0 } } console.log(obj2); // { a: 0, b: { c: 0 } } obj2.a = 2; console.log(obj1); // { a: 1, b: { c: 0 } } console.log(obj2); // { a: 2, b: { c: 0 } } obj2.b.c = 3; console.log(obj1); // { a: 1, b: { c: 3 } } console.log(obj2); // { a: 2, b: { c: 3 } } // Deep Clone const obj3 = { a: 0, b: { c: 0 } }; const obj4 = JSON.parse(JSON.stringify(obj3)); obj3.a = 4; obj3.b.c = 4; console.log(obj4); // { a: 0, b: { c: 0 } } 4 sumber
const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 }
Untuk kloning mendalam, kita perlu menggunakan alternatif, karena const obj = { a: 1 }; const copy = Object.assign({}, obj); console.log(copy); // { a: 1 } 0 menyalin nilai properti
Jika nilai sumber adalah referensi ke suatu objek, itu hanya menyalin nilai referensi
const obj1 = { a: 0, b: { c: 0 } }; const obj2 = Object.assign({}, obj1); console.log(obj2); // { a: 0, b: { c: 0 } } obj1.a = 1; console.log(obj1); // { a: 1, b: { c: 0 } } console.log(obj2); // { a: 0, b: { c: 0 } } obj2.a = 2; console.log(obj1); // { a: 1, b: { c: 0 } } console.log(obj2); // { a: 2, b: { c: 0 } } obj2.b.c = 3; console.log(obj1); // { a: 1, b: { c: 3 } } console.log(obj2); // { a: 2, b: { c: 3 } } // Deep Clone const obj3 = { a: 0, b: { c: 0 } }; const obj4 = JSON.parse(JSON.stringify(obj3)); obj3.a = 4; obj3.b.c = 4; console.log(obj4); // { a: 0, b: { c: 0 } }
const o1 = { a: 1 }; const o2 = { b: 2 }; const o3 = { c: 3 }; const obj = Object.assign(o1, o2, o3); console.log(obj); // { a: 1, b: 2, c: 3 } console.log(o1); // { a: 1, b: 2, c: 3 }, target object itself is changed.
const o1 = { a: 1, b: 1, c: 1 }; const o2 = { b: 2, c: 2 }; const o3 = { c: 3 }; const obj = Object.assign({}, o1, o2, o3); console.log(obj); // { a: 1, b: 2, c: 3 }
Properti ditimpa oleh objek lain yang memiliki properti yang sama nanti dalam urutan parameter