Tambahkan lebih banyak properti ke objek javascript

Question

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

Table of Contents Show

Bagaimana cara menambahkan properti baru ke objek array yang ada di JavaScript?
Bagaimana cara menambahkan properti baru ke objek yang ada di TypeScript?
Bagaimana cara mendapatkan semua properti dari objek JavaScript?
Bisakah properti objek memiliki banyak nilai?

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 Objek

Seseorang 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 ada

Seseorang 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 Object

Di 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 Objek

Di 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 }

_2

Objek 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

Bagaimana cara menambahkan properti baru ke objek array yang ada di JavaScript?

Untuk menambahkan properti ke objek, .

Gunakan map() dan ulangi elemen array

Selama setiap iterasi, buat objek baru dengan memperluas objek yang ada menggunakan operator spread dan menambahkan properti baru sebagai tambahan

Tetapkan array baru ke variabel

Bagaimana cara menambahkan properti baru ke objek yang ada di TypeScript?

Cara menetapkan properti secara dinamis ke objek di TypeScript .

Solusi 1. Ketik objek secara eksplisit pada waktu deklarasi

Solusi 2. Gunakan tanda tangan indeks objek

Solusi 3. Gunakan jenis utilitas Rekam

Solusi 4. Gunakan tipe data Peta

Solusi 5. Pertimbangkan properti objek opsional

Bagaimana cara mendapatkan semua properti dari objek JavaScript?

getOwnPropertyNames() Objek. getOwnPropertyNames() metode statis mengembalikan array dari semua properti (termasuk properti non-enumerable kecuali yang menggunakan Simbol) yang ditemukan langsung di objek yang diberikan.

Bisakah properti objek memiliki banyak nilai?

Objek memungkinkan penyimpanan pasangan kunci-nilai untuk mengakses data menggunakan kunci (atau properti ) untuk indeks , dan juga dapat menyimpan banyak nilai untuk satu kunci dalam larik< . Objek tidak boleh memiliki kunci duplikat , dan JavaScript hanya mengizinkan string menjadi kunci dalam suatu objek. . Objects cannot have duplicate keys , and JavaScript only allows strings to be keys in an object .

kode javascript