ES10
Bài đăng này tóm tắt các phương pháp phổ biến để loại bỏ phần tử từ một mảng kể từ Ecmascript 2019 [ES10].
1. Các trường hợp chung
1.1. Loại bỏ phần tử mảng bằng giá trị bằng cách sử dụng .splice[]
| Tại chỗ: Có | | Xóa các bản sao: Có [vòng lặp], không [indexof] | | Theo giá trị / chỉ mục: theo chỉ mục |In-place: Yes |
| Removes duplicates: Yes[loop], No[indexOf] |
| By value /
index: By index |
Nếu bạn biết giá trị bạn muốn xóa khỏi một mảng, bạn có thể sử dụng phương thức Splice. Đầu tiên, bạn phải xác định chỉ số của mục đích. Sau đó, bạn sử dụng chỉ mục làm phần tử bắt đầu và chỉ xóa một phần tử.
// With a 'for' loop
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
for[ let i = 0; i < arr.length; i++]{
if [ arr[i] === 5] {
arr.splice[i, 1];
}
} // => [1, 2, 3, 4, 6, 7, 8, 9, 0]
// With the .indexOf[] method
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
const i = arr.indexOf[5];
arr.splice[i, 1]; // => [1, 2, 3, 4, 6, 7, 8, 9, 0]
1.2. Loại bỏ phần tử mảng bằng phương thức const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
0
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
| Tại chỗ: Không | | Xóa các bản sao: Có | | Theo giá trị / chỉ mục: Theo giá trị |In-place: No |
| Removes duplicates: Yes |
| By value / index: By value |
Phần tử cụ thể có thể được lọc ra từ mảng, bằng cách cung cấp chức năng lọc. Hàm như vậy sau đó được gọi cho mọi yếu tố trong mảng.filtered out from the array, by providing a filtering function. Such function is then called for every element in the array.
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
1.3. Loại bỏ phần tử mảng bằng cách mở rộng const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
1
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
| Tại chỗ: Có/Không [phụ thuộc vào việc thực hiện] | | Xóa các bản sao: Có/Không [phụ thuộc vào việc thực hiện] | | Theo giá trị / chỉ mục: theo chỉ mục / theo giá trị [phụ thuộc vào việc thực hiện] |In-place: Yes/No [Depends on implementation] |
| Removes duplicates: Yes/No [Depends on implementation] |
| By value / index: By index / By value [Depends on implementation] |
Nguyên mẫu của mảng có thể được mở rộng với các phương pháp bổ sung. Các phương thức như vậy sau đó sẽ có sẵn để sử dụng trên các mảng đã tạo.
LƯU Ý: Mở rộng các nguyên mẫu của các đối tượng từ thư viện tiêu chuẩn của JavaScript [như mảng] được một số người coi là một antippotyn. Extending prototypes of objects from the standard library of JavaScript [like Array] is considered by some as an antipattern.
// In-place, removes all, by value implementation
Array.prototype.remove = function[item] {
for [let i = 0; i < this.length; i++] {
if [this[i] === item] {
this.splice[i, 1];
}
}
}
const arr1 = [1,2,3,1];
arr1.remove[1] // arr1 equals [2,3]
// Non-stationary, removes first, by value implementation
Array.prototype.remove = function[item] {
const arr = this.slice[];
for [let i = 0; i < this.length; i++] {
if [arr[i] === item] {
arr.splice[i, 1];
return arr;
}
}
return arr;
}
let arr2 = [1,2,3,1];
arr2 = arr2.remove[1] // arr2 equals [2,3,1]
1.4. Loại bỏ phần tử mảng bằng toán tử const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
2
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
| Tại chỗ: Có | | Xóa các bản sao: Không | | Theo giá trị / chỉ mục: theo chỉ mục |In-place: Yes |
| Removes duplicates: No |
| By value / index: By index |
Sử dụng toán tử xóa không ảnh hưởng đến thuộc tính chiều dài. Nó cũng không ảnh hưởng đến các chỉ số của các yếu tố tiếp theo. Mảng trở nên thưa thớt, đó là một cách lạ mắt để nói rằng vật phẩm đã bị xóa không được loại bỏ nhưng trở nên không xác định.
const arr = [1, 2, 3, 4, 5, 6];
delete arr[4]; // Delete element with index 4
console.log[ arr ]; // [1, 2, 3, 4, undefined, 6]
Toán tử xóa được thiết kế để loại bỏ các thuộc tính khỏi các đối tượng JavaScript, mảng là đối tượng.
1.5. Loại bỏ phần tử mảng bằng tiện ích const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
3 [> = ES10]
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
| Tại chỗ: Không | | Xóa các bản sao: Có | | Theo giá trị / chỉ mục: Theo giá trị |In-place: No |
| Removes duplicates: Yes |
|
By value / index: By value |
ES10 đã giới thiệu
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
const object = [1,2,3,4];
const valueToRemove = 3;
const arr = Object.values[Object.fromEntries[
Object.entries[object]
.filter[[[ key, val ]] => val !== valueToRemove]
]];
console.log[arr]; // [1,2,4]
2. Các trường hợp đặc biệt
2.1 Loại bỏ phần tử nếu nó ở cuối mảng
2.1.1. Thay đổi mảng const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
5
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
| Tại chỗ: Có | | Xóa các bản sao: Không | | Theo giá trị / chỉ mục: N / A |In-place: Yes |
| Removes duplicates: No |
| By value / index: N/A |
Các phần tử mảng JavaScript có thể được loại bỏ từ cuối một mảng bằng cách đặt thuộc tính độ dài thành giá trị nhỏ hơn giá trị hiện tại. Bất kỳ phần tử nào có chỉ số lớn hơn hoặc bằng chiều dài mới sẽ được loại bỏ.
const arr = [1, 2, 3, 4, 5, 6];
arr.length = 5; // Set length to remove element
console.log[ arr ]; // [1, 2, 3, 4, 5]
2.1.2. Sử dụng phương pháp const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
6
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
| Tại chỗ: Có | | Xóa các bản sao: Không | | Theo giá trị / chỉ mục: N / A |In-place: Yes |
| Removes duplicates: No |
| By value / index: N/A |
Các phần tử mảng JavaScript có thể được loại bỏ từ cuối một mảng bằng cách đặt thuộc tính độ dài thành giá trị nhỏ hơn giá trị hiện tại. Bất kỳ phần tử nào có chỉ số lớn hơn hoặc bằng chiều dài mới sẽ được loại bỏ.
const arr = [1, 2, 3, 4, 5, 6];
arr.pop[]; // returns 6
console.log[ arr ]; // [1, 2, 3, 4, 5]
2.1.2. Sử dụng phương pháp const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
6
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
| Tại chỗ: Có | | Xóa các bản sao: Không | | Theo giá trị / chỉ mục: N / A |In-place: Yes |
| Removes duplicates: No |
| By value / index: N/A |
Các phần tử mảng JavaScript có thể được loại bỏ từ cuối một mảng bằng cách đặt thuộc tính độ dài thành giá trị nhỏ hơn giá trị hiện tại. Bất kỳ phần tử nào có chỉ số lớn hơn hoặc bằng chiều dài mới sẽ được loại bỏ.
const arr = [1, 2, 3, 4];
arr.shift[]; // returns 1
console.log[ arr ]; // [2, 3, 4]
2.1.2. Sử dụng phương pháp const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
6
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]
Phương thức POP loại bỏ phần tử cuối cùng của mảng, trả về phần tử đó và cập nhật thuộc tính độ dài. Phương thức POP sửa đổi mảng mà nó được gọi, điều này có nghĩa là không giống như sử dụng xóa phần tử cuối cùng được loại bỏ hoàn toàn và độ dài mảng giảm.In-place: Yes |
| Removes duplicates: N/A |
| By value / index: N/A |
2.2. Loại bỏ phần tử nếu nó ở đầu mảng
let arr = [1];
arr = []; //empty array
Phương thức
const value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter[item => item !== value]
console.log[arr]
// [ 1, 2, 4, 5 ]