6 cách để xoá các phần tử nằm trong Array bằng Javascript

Có nhiều cách để xoá các Elements trong một Array bằng Javascript, chúng ta có thể xoá phần tử đầu, phần tử cuối hay bất kì đâu mà chúng ta cần bằng những cách sau:

Một số điều cần lưu ý:

• pop – Xoá Element cuối cùng của Array
• shift – Xoá Element đầu của Array
• splice – Xoá Element trong Array bằng index
• filter – Tính toán để xoá nhiều Element trong Array

Ngoài ra: Chúng ta sẽ sử dụng thư viện Lodash để có thể thực hiện nhiệm vụ trên.

1. Xoá các Elements từ phía cuối Array

Các đầu tiên cũng là đơn giản nhất, đó là giới hạn length của Array. Ví dụ như sau:

Ta có 1 array, sau khi đã giới hạn lại kích thước của mảng thì những phần tử đằng sau có index lớn hơn hoặc bằng đều bị xoá bỏ.

var ar = [1, 2, 3, 4, 5, 6];
ar.length = 4; // set length to remove elements
console.log(ar); // [1, 2, 3, 4]

Hoặc nếu bạn chỉ muốn xoá bỏ phần tử cuối cùng của mảng, bạn sử dụng pop:

var ar = [1, 2, 3, 4, 5, 6];
ar.pop(); // returns 6
console.log(ar); // [1, 2, 3, 4, 5]

2. Xoá bỏ Element đầu tiên của Array

Trái ngược lại với pop, shift là cách để chúng ta có thể xoá bỏ phần tử đầu tiên của mảng, cách dùng như sau:

var ar = ['zero', 'one', 'two', 'three'];
ar.shift(); // returns "zero"
console.log(ar); // ["one", "two", "three"]

3. Dùng Splice để xoá bỏ các Elements trong Array

Splice là phương thức có thể xoá hoặc thêm phần tử vào trong mảng. Phương thức này chứa 2 tham số, tham số đầu tiên là vị trí index mà chúng ta muốn thêm hoặc xoá phần tử (ở đây, ví dụ là xoá). Tham số thứ 2 là số phần tử chúng ta muốn xoá.

Ví dụ xoá 5 elements từ vị trí index thứ 2 trong array:

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
var removed = arr.splice(2, 5); // tham số đầu tiên index = 2, tham số hai bằng 5 là số element muốn xoá

/*
removed === [3, 4, 5, 6, 7]
arr === [1, 2, 8, 9, 0] // kết qủa
*/

["bar", "baz", "foo", "qux"]

list.splice(0, 2);
// bắt đầu với index bằng 0, xoá 2 elements ["bar", "baz"], kết qủa còn ["foo", "qux"].

Một giải pháp mà chúng ta hay sử dụng trong công việc, đó là tìm và so sánh index để xoá các phần tử element chúng ta mong muốn. Xem ví dụ dưới đây:

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];

for(var i = 0; i < arr.length; i++) { 
    if ( arr[i] === 5) { 
        arr.splice(i, 1); 
    } 
} 
//=> [1, 2, 3, 4, 6, 7, 8, 9, 0] kết quả

Đưa array vào vòng for, kiểm tra index bằng 5 thì xoá phần tử đó đi.

4. Sử dụng phương thức Filter để xoá các phần tử theo điều kiện

Không giống như splice, filter sẽ tạo ra mảng mới với điều kiện được áp dụng từ array ban đầu.

var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];

var filtered = array.filter(function(value, index, arr) {
    return value > 5;
});

//filtered => [6, 7, 8, 9]
//array => [1, 2, 3, 4, 5, 6, 7, 8, 9, 0]

Với điều kiện là những phần tử có giá trị lớn hơn 5, chúng ta đã tạo ra 1 array mới là filtered như ở ví dụ trên. Filter là phương thức rất hay được sử dụng để tìm kiếm giá trị trong mảng.

// tạo 1 function 
function arrayRemove(arr, value) {
   return arr.filter(function(ele){
       return ele != value;
   });
}

// sử dụng
var array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
var result = arrayRemove(array, 6);

// kết quả = [1, 2, 3, 4, 5, 7, 8, 9, 0]

5. Sử dụng Lodash

Lodash là tập thư viện cực mạnh chuyên để làm việc với Array hay Object, tìm kiếm và xoá bỏ là chuyện nhỏ đối với lodash. Để sử dụng thư viện lodash, bạn hãy vào trang chủ của nó, dưới đây là ví dụ xoá element bằng phương thức remove của lodash:

var array = [1, 2, 3, 4];
var evens = _.remove(array, function(n) {
  return n % 2 === 0; // xoá các phần từ chia hết cho 2
});

console.log(array);
// => [1, 3]

console.log(evens);
// => [2, 4]

6. Xoá toàn bộ

var ar = [1, 2, 3, 4, 5, 6];
// do stuff
ar = [];
// array đã trống

var arr1 = [1, 2, 3, 4, 5, 6];
var arr2 = arr1;  // gắn arr1 bằng arr2
arr1 = []; // xoá toàn bộ arr1
console.log(arr2); // Output [1, 2, 3, 4, 5, 6] arr2 vẫn còn y nguyên

var ar = [1, 2, 3, 4, 5, 6];
console.log(ar); // Output [1, 2, 3, 4, 5, 6]
ar.length = 0; // 
console.log(ar); // Output []

var ar = [1, 2, 3, 4, 5, 6];
console.log(ar); // Output [1, 2, 3, 4, 5, 6]
ar.splice(0, ar.length);
console.log(ar); // Output []

Chạy tới đâu, xoá tới đó

var ar = [1, 2, 3, 4, 5, 6];
console.log(ar); // Output [1, 2, 3, 4, 5, 6]
while (ar.length) {
    ar.pop();
}
console.log(ar); // Output []

Trên đây là 6 cách xoá phần tử trong mảng mà mr386 thấy hay và hữu dụng, hi vọng giúp ích được cho bạn

Mr386, Thân ái!