Trong bài đăng này, bạn sẽ tìm hiểu cách xóa các thuộc tính khỏi một đối tượng trong JavaScript bằng cách sử dụng cấu trúc hủy và cú pháp ...rest
Cách mới này để loại bỏ các thuộc tính của đối tượng [bằng cách loại trừ chúng khỏi một đối tượng mới] mang lại cho chúng ta một cách viết JavaScript rõ ràng hơn, với ít mã hơn và dễ đọc hơn - cũng như đây là một hoạt động không thể thay đổi
Trước khi phá hủy, chúng tôi thường sử dụng từ khóa
const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
0 để xóa các thuộc tính khỏi một đối tượng. Vấn đề với const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
0 là nó là một hoạt động có thể thay đổi, thay đổi vật lý đối tượng và có khả năng gây ra các tác dụng phụ không mong muốn do cách JavaScript xử lý các tham chiếu đối tượngBằng cách sử dụng tính năng hủy đối tượng, kết hợp với toán tử còn lại ...rest
, chúng ta có một cách tiếp cận đơn giản
Phá hủy đối tượng là gì?
Việc hủy đối tượng cho phép chúng ta tạo các biến từ tên thuộc tính đối tượng và biến sẽ chứa giá trị của tên thuộc tính - ví dụ
const data = { a: 1, b: 2, c: 3 };
const { a, b, c } = data;
console.log[a, b, c]; // 1, 2, 3
Bằng cách sử dụng
const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
3, chúng tôi đang khai báo 3 biến mới [const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
0, const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
1 và const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
2]Nếu
const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
0, const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
1 và const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
2 tồn tại dưới dạng tên thuộc tính trên const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
6, thì các biến sẽ được tạo có chứa các giá trị của thuộc tính đối tượng. Nếu tên thuộc tính không tồn tại, bạn sẽ nhận được const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
console.log[a]; // 1
console.log[rest]; // { b: 2, c: 3 }
7…nghỉ ngơi trong quá trình phá hủy đối tượng
Đầu tiên là các tham số còn lại, sau đó là các thuộc tính còn lại
Đã thêm vào ECMAScript 2015 và hiện ở Giai đoạn 4 - chúng ở đây để duy trì và sử dụng cho đến ngày hôm nay
Với suy nghĩ này, làm thế nào để ...rest
giúp chúng ta loại bỏ một thuộc tính khỏi một đối tượng thông qua phá hủy?
Sách điện tử miễn phí
Chỉ thị, đơn giản phải không? . Nhìn bề ngoài chúng có vẻ đơn giản, nhưng ngay cả các nhà phát triển Angular lành nghề cũng chưa nắm hết mọi khái niệm trong eBook này