Anda memiliki objek dengan beberapa properti dan Anda ingin menghapus beberapa properti ini sebelum menggunakan objek lebih lanjut
let person = { firstName: "John", lastName: "Doe", gender: "Male", age: 34 }; const json = JSON.stringify(person); console.log(json); // => {"firstName":"John","lastName":"Doe","gender":"Male","age":34} // What can we do if we don't want the `age` property in the JSON string? -->Di sini string JSON juga berisi properti age. Namun, Anda akan mengirimkan string melalui jaringan, dan server di ujung lainnya tidak akan menggunakan properti age. Jadi, Anda ingin menghapus properti age_ dari objek person sebelum mengubahnya menjadi string JSON
Solusinya
Anda dapat menggunakan operator delete_, yang lebih sederhana, atau penghancuran objek, yang dapat menghapus lebih dari satu properti sekaligus
Menggunakan operator delete
Gunakan operator delete untuk menghapus properti dari objek
let person = { firstName: "John", lastName: "Doe", gender: "Male", age: 34 }; // Delete the age property first delete person.age; let json = JSON.stringify(person); console.log(json); _Operator delete_ akan kembali jika berhasil dan selalu mengembalikan let person = { firstName: "John", lastName: "Doe", gender: "Male", age: 34 }; // Delete the age property first delete person.age; let json = JSON.stringify(person); console.log(json); 1 - bahkan ketika properti tidak ada. Panggilan hanya akan mengembalikan let person = { firstName: "John", lastName: "Doe", gender: "Male", age: 34 }; // Delete the age property first delete person.age; let json = JSON.stringify(person); console.log(json); 2 ketika properti tidak dapat dikonfigurasi - yang merupakan kasus untuk properti pada objek bawaan seperti let person = { firstName: "John", lastName: "Doe", gender: "Male", age: 34 }; // Delete the age property first delete person.age; let json = JSON.stringify(person); console.log(json); 3 dari let person = { firstName: "John", lastName: "Doe", gender: "Male", age: 34 }; // Delete the age property first delete person.age; let json = JSON.stringify(person); console.log(json); 4
Menggunakan penghancuran objek
Operator delete_ hanya dapat menghapus satu properti per panggilan. Jadi, jika Anda ingin menghapus properti age dan let person = { firstName: "John", lastName: "Doe", gender: "Male", age: 34 }; // Delete the age property first delete person.age; let json = JSON.stringify(person); console.log(json); 7, maka Anda harus melakukan dua panggilan delete. Sebagai alternatif, Anda dapat menggunakan penghancuran objek untuk menghapus beberapa properti dengan satu panggilan
const person = { firstName: "John", lastName: "Doe", gender: "Male", age: 34 }; // Destructure the age and gender const {age, gender, ...personTrimmed} = person; const json = JSON.stringify(personTrimmed); console.log(json);Perhatikan bahwa destrukturisasi secara signifikan lebih lambat daripada operator delete karena membuat salinan objek baru dari objek asli. Destrukturisasi juga tidak didukung oleh versi IE mana pun
Variabel
javascript
delete object.property;
0 berisi objek yang menggambarkan seorang karyawan. Objek berisi 2 properti yang menggambarkan data karyawan.javascript
delete object.property;
1 danjavascript
delete object.property;
2Namun, kadang-kadang, Anda perlu menghapus properti dari suatu objek. Misalnya, bagaimana Anda menghapus properti
javascript
delete object.property;
_2 dari objekjavascript
delete object.property;
4?Mari kita lihat 2 cara umum tentang cara menghapus properti dari objek dalam JavaScript — menggunakan operator
javascript
delete object.property;
5 (cara yang dapat diubah) dan penghancuran objek yang digabungkan dengan sisa objek (cara yang tidak dapat diubah)1. hapus operator
javascript
delete object.property;
5 adalah operator khusus dalam JavaScript yang menghapus properti dari objek. Operan tunggalnya biasanya menerima pengakses properti untuk menunjukkan properti apa yang akan dihapusA) Hapus menggunakan accessor properti dot
javascript
delete object.property;
_B) Hapus menggunakan pengakses properti tanda kurung siku
javascript
delete object['property'];
// or
const name = 'dynamicProperty';
delete object[name];
Saat menerapkan operator
javascript
delete object.property;
_5 pada pengakses properti, operator menghapus properti yang sesuai dari objekjavascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
delete employee.position;
console.log(employee); // { name: 'John Smith' }
Coba demonya
Awalnya,
javascript
delete object.property;
_4 memiliki 2 properti.javascript
delete object.property;
1 danjavascript
delete object.property;
2Namun setelah menerapkan operator
javascript
delete object.property;
_5 pada propertijavascript
delete object.property;
2.javascript
delete object['property'];
// or
const name = 'dynamicProperty';
delete object[name];
_3, properti dihapus dari objek. Sederhana seperti ituPenghapusan properti menggunakan operator
javascript
delete object.property;
5 dapat berubah karena bermutasi (alias mengubah, memodifikasi) objek asliJika nama properti yang akan dihapus ditentukan secara dinamis, maka Anda dapat menggunakan sintaks tanda kurung siku
javascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
const name = 'position';
delete employee[name];
console.log(employee); // { name: 'John Smith' }
Coba demonya
javascript
delete object['property'];
// or
const name = 'dynamicProperty';
delete object[name];
_5 menghapus properti yang namanya terkandung di dalam variabeljavascript
delete object.property;
12. Penghancuran objek dengan sintaks istirahat
Pendekatan lain untuk menghapus properti, tetapi dengan cara yang tidak dapat diubah tanpa mengubah objek aslinya, adalah dengan menggunakan the
Idenya sederhana. destruktur objek ke properti yang ingin Anda hapus, dan properti yang tersisa dikumpulkan menjadi objek istirahat
A) Nama properti diketahui
javascript
const { property, ...restObject } = object;
B) Nama properti bersifat dinamis
javascript
const name = 'property';
const { [name]: removedProperty, ...restObject } = object;
Setelah menerapkan sintaks destrukturisasi dan istirahat,
javascript
delete object['property'];
// or
const name = 'dynamicProperty';
delete object[name];
7 akan berisi properti yang sama denganjavascript
delete object['property'];
// or
const name = 'dynamicProperty';
delete object[name];
8, hanya tanpa properti yang dihapusMisalnya, mari kita hapus properti
javascript
delete object.property;
2 dari objekjavascript
delete object.property;
4javascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
const { position, ...employeeRest } = employee;
console.log(employeeRest); // { name: 'John Smith' }
console.log(employee);
// { name: 'John Smith',position: 'Sales Manager' }
Coba demonya
Pernyataan
javascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
delete employee.position;
console.log(employee); // { name: 'John Smith' }
_1 merusakjavascript
delete object.property;
4 objek dan mengumpulkan properti menjadi objek lainnyajavascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
delete employee.position;
console.log(employee); // { name: 'John Smith' }
3 tanpa menyertakan propertijavascript
delete object.property;
2Penghancuran objek dengan sintaks istirahat adalah cara penghapusan properti yang tidak dapat diubah. objek
javascript
delete object.property;
_4 asli tidak dimutasi. Sebaliknya objek barujavascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
delete employee.position;
console.log(employee); // { name: 'John Smith' }
_3 dibuat yang berisi semua propertijavascript
delete object.property;
4 tetapi tanpajavascript
delete object.property;
2 yang dihapusJika nama properti yang akan dihapus ditentukan secara dinamis, maka Anda dapat menggunakan sintaks destrukturisasi nama properti dinamis
javascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
const name = 'position';
const { [name]: removedProperty, ...employeeRest } = employee;
console.log(employeeRest); // { name: 'John Smith' }
Coba demonya
javascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
delete employee.position;
console.log(employee); // { name: 'John Smith' }
_9 mari kita hapus properti dengan nama dinamis dengan mengumpulkan properti, tetapi menghapus satu, menjadi objekjavascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
delete employee.position;
console.log(employee); // { name: 'John Smith' }
3Yang menarik adalah Anda dapat menghapus beberapa properti sekaligus menggunakan sintaks destrukturisasi dan istirahat
javascript
const employee = {
name: 'John Smith',
position: 'Sales Manager',
experience: 6, // years
};
const { position, experience, ...employeeRest } = employee;
console.log(employeeRest); // { name: 'John Smith' }
Coba demonya
javascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
const name = 'position';
delete employee[name];
console.log(employee); // { name: 'John Smith' }
1 telah menghapus 2 properti sekaligus.javascript
delete object.property;
2 danjavascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
const name = 'position';
delete employee[name];
console.log(employee); // { name: 'John Smith' }
33. Kesimpulan
Dalam JavaScript, ada 2 cara umum untuk menghapus properti dari suatu objek
Pendekatan pertama yang dapat diubah adalah menggunakan operator
javascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
const name = 'position';
delete employee[name];
console.log(employee); // { name: 'John Smith' }
4Pendekatan kedua, yang tidak dapat diubah karena tidak mengubah objek aslinya, adalah dengan memanggil penghancuran objek dan menyebarkan sintaks.
javascript
const employee = {
name: 'John Smith',
position: 'Sales Manager'
};
const name = 'position';
delete employee[name];
console.log(employee); // { name: 'John Smith' }
5Tantangan sampingan. berapa kompleksitas waktu dari penghapusan properti menggunakan
javascript
delete object.property;
5 dan sintaks istirahat objek?Suka postingannya?
Sarankan Perbaikan
Posting berkualitas ke kotak masuk Anda
Saya secara teratur menerbitkan posting yang berisi
- Konsep penting JavaScript dijelaskan dengan kata-kata sederhana
- Ikhtisar fitur JavaScript baru
- Cara menggunakan TypeScript dan mengetik
- Desain perangkat lunak dan praktik pengkodean yang baik
Berlangganan buletin saya untuk mengirimkannya langsung ke kotak masuk Anda
LanggananBergabunglah dengan 6926 pelanggan lainnya
Tentang Dmitri Pavlutin
Penulis dan pelatih teknologi. Rutinitas harian saya terdiri dari (namun tidak terbatas) minum kopi, coding, menulis, coaching, mengatasi kebosanan 😉