Xóa đối tượng trong javascript

Trong lập trình, chắc chắn là chúng ta phải xử lý rất nhiều vấn đề về mảng hay các đối tượng. Sẽ có nhiều cách khác nhau để có thể xóa một phần tử trong mảng hoặc là một mảng đối tượng dựa trên một hoặc nhiều thuộc tính của phần tử đó

Trong bài viết này, chúng ta cùng tìm hiểu về cách xóa hoặc lọc một phần tử từ một mảng hoặc đối tượng dựa trên các thuộc tính của nó. Đó là toán tử xóa (toán tử xóa) trong Javascript

Delete the

Không giống C/C++, xóa toán tử trong JavaScript không liên quan gì đến việc phân chia bộ nhớ. Những gì nó thực sự làm là xóa một thuộc tính khỏi đối tượng cha của nó

cú pháp

delete object.property
delete object['property']

thong số

  • mục tiêu. Tên của một đối tượng hoặc một biểu thức đánh giá một đối tượng
  • tài sản. Thuộc tính cần xóa

Trong ví dụ sau, after when delete property

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
0, string "yolo" will be remove from the objects
let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
1

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }

Xóa đối tượng trong javascript

Khi có hai đối tượng cùng sử dụng tham chiếu, toán tử chỉ xóa bỏ thuộc tính tại đối tượng mà chúng ta đã gọi

let boo = { c: true };
 
let foo = {
    a: 12,
    b: boo
};
 
let bar = {
    b: boo
};
 
// foo = { a: 12, b: { c: true } }
// bar = { b: { c: true } }
 
delete foo.b;
 
// foo = { a: 12 }
// bar = { b: { c: true } }

Xóa đối tượng trong javascript

Chuỗi

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
2 được chia sẻ giữa
let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
1 và
let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
4 dưới dạng thuộc tính
let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
5, khi bạn xóa tham chiếu
let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
0, chuỗi
let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
2 vẫn đang được tham chiếu trong
let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
8 sẽ không bị ảnh hưởng


Trong chế độ nghiêm ngặt (strict mode), khi lệnh xóa được gọi và không thể xóa mục tiêu, sẽ xảy ra lỗi cú pháp. Nếu đang chạy ở chế độ không nghiêm ngặt (non-strict mode - sloopy mode), giá trị

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
9 sẽ được trả về thay thế

Khi một thuộc tính được tạo dưới dạng không thể định cấu hình (không thể định cấu hình), nó sẽ không thể bị xóa và thay vào đó, TypeError sẽ xuất hiện

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
3

Ngoài ra, ở chế độ nghiêm ngặt (strict mode), lệnh xóa không thể sử dụng trên một tham chiếu trực tiếp đến một biến, đối số hàm hoặc tên hàm

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
4

Xóa một biến đã được xác định bằng

let boo = { c: true };
 
let foo = {
    a: 12,
    b: boo
};
 
let bar = {
    b: boo
};
 
// foo = { a: 12, b: { c: true } }
// bar = { b: { c: true } }
 
delete foo.b;
 
// foo = { a: 12 }
// bar = { b: { c: true } }
0 bên trong một hàm cũng sẽ không hoạt động

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
6

Trong chế độ không nghiêm ngặt (non-strict mode), nếu bạn xác định một biến mà không có từ khóa

let boo = { c: true };
 
let foo = {
    a: 12,
    b: boo
};
 
let bar = {
    b: boo
};
 
// foo = { a: 12, b: { c: true } }
// bar = { b: { c: true } }
 
delete foo.b;
 
// foo = { a: 12 }
// bar = { b: { c: true } }
0, thì nó sẽ được bổ sung vào các đối tượng toàn cục dưới dạng có thể định cấu hình
let boo = { c: true };
 
let foo = {
    a: 12,
    b: boo
};
 
let bar = {
    b: boo
};
 
// foo = { a: 12, b: { c: true } }
// bar = { b: { c: true } }
 
delete foo.b;
 
// foo = { a: 12 }
// bar = { b: { c: true } }
2

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
9

Và nếu bạn xóa một cái gì đó không tồn tại, nó cũng trả về đúng

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
0

Nếu bạn xóa một phần tử khỏi một mảng, phần tử đó sẽ biến mất, nhưng độ dài của mảng không thay đổi

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
1

Xóa đối tượng trong javascript

Nếu độ dài của mảng không thay đổi, các logic sẽ bị ảnh hưởng và kết quả sẽ không như mong đợi. Vì vậy, cách phù hợp để xóa một phần tử khỏi một mảng là đặt nó thành

let boo = { c: true };
 
let foo = {
    a: 12,
    b: boo
};
 
let bar = {
    b: boo
};
 
// foo = { a: 12, b: { c: true } }
// bar = { b: { c: true } }
 
delete foo.b;
 
// foo = { a: 12 }
// bar = { b: { c: true } }
3 hoặc sử dụng
let boo = { c: true };
 
let foo = {
    a: 12,
    b: boo
};
 
let bar = {
    b: boo
};
 
// foo = { a: 12, b: { c: true } }
// bar = { b: { c: true } }
 
delete foo.b;
 
// foo = { a: 12 }
// bar = { b: { c: true } }
4

let foo = {
    a: 12,
    b: "yolo"
};
 
delete foo.b;
 
// foo = { a: 12 }
4Kết thúc

Hy vọng, bài viết này sẽ có những thông tin hữu ích, giúp anh chị em trong công việc hằng ngày của mình