Trong bài viết này, biên tập viên chia sẻ với các bạn một số phương pháp xóa một hoặc nhiều phần tử trong mảng JS, những ai quan tâm có thể học thử.
1: Phương pháp splice
trong JS
splice(index,len,[item])
Chú thích: Phương pháp này thay đổi mảng gốc.
splice
có 3 tham số, nó có thể được dùng để thay thế / xóa / thêm một hoặc một vài giá trị trong mảng.
-
index
: chỉ số bắt đầu trong mảng -
len
: độ dài cần thay thế / xóa -
item
: giá trị thay thế, nếu là thao tác xóa thìitem
để trống
Ví dụ: arr = ['a','b','c','d']
Xóa —- item
không được thiết lập
arr.splice(1,1) //['a','c','d'] Xóa phần tử bắt đầu từ chỉ số 1, độ dài 1, nếu `len` đặt là 0 thì mảng không thay đổi
arr.splice(1,2) //['a','d'] Xóa phần tử bắt đầu từ chỉ số 1, độ dài 2
Thay thế —- item
là giá trị thay thế
arr.splice(1,1,'ttt') //['a','ttt','c','d'] Thay thế phần tử tại chỉ số 1, độ dài 1 bằng 'ttt'
arr.splice(1,2,'ttt') //['a','ttt','d'] Thay thế 2 phần tử bắt đầu từ chỉ số 1 bằng 'ttt'
Thêm —- len
đặt là 0, item
là giá trị được thêm vào
arr.splice(1,0,'ttt') //['a','ttt','b','c','d'] Thêm một phần tử 'ttt' tại chỉ số 1
Xem ra dùng splice
vẫn là tiện nhất.
2: delete
Khi dùng delete
để xóa phần tử trong mảng, giá trị tại chỉ số đó sẽ được đặt thành undefined
, độ dài của mảng không thay đổi.
Ví dụ:
delete arr[1] //['a', ,'c','d'] giữa sẽ xuất hiện hai dấu phẩy, độ dài mảng không đổi, có một phần tử là `undefined`
JS – Một vài phương pháp xóa phần tử trong mảng
var arr=['a','b','c'];
Nếu muốn xóa phần tử 'b'
, có hai cách:
1. Phương pháp delete
: delete arr[1]
Cách này không thay đổi độ dài mảng, arr[1]
lúc này trở thành undefined
, nhưng có ưu điểm là chỉ số ban đầu của mảng được giữ nguyên, khi duyệt mảng có thể dùng:
for(index in arr)
{
document.write('arr['+index+']='+arr[index]);
}
Cách duyệt này sẽ bỏ qua các phần tử undefined
-
Cách này được hỗ trợ từ IE4.0 trở lên
2. Phương pháp splice
của đối tượng mảng: arr.splice(1,1);
Cách này sẽ làm thay đổi độ dài của mảng, đồng thời các chỉ số của mảng cũng sẽ thay đổi theo.
Tham số thứ nhất 1
trong splice
là chỉ số bắt đầu xóa (bắt đầu từ 0), ở đây là phần tử thứ hai trong mảng
Tham số thứ hai 1
là số lượng phần tử cần xóa, ở đây chỉ xóa một phần tử, chính là 'b'
Lúc này có thể dùng cách duyệt mảng thông thường như for
, vì phần tử đã bị xóa sẽ không còn trong mảng
-
Phương pháp này chỉ được hỗ trợ từ IE5.5 trở lên
Cần nhấn mạnh rằng splice
không chỉ có thể xóa phần tử trong mảng, mà còn có thể thêm mới phần tử vào mảng
Ví dụ: arr.splice(1,1,'d','e')
, hai phần tử d
, e
sẽ được thêm vào mảng arr
Kết quả mảng sẽ trở thành: arr:'a','d','e','c'
Bài viết bổ sung:
JavaScript thông qua việc thiết lập thuộc tính length
của mảng là cách duy nhất để rút ngắn độ dài của mảng. Nếu dùng toán tử delete
để xóa phần tử trong mảng, tuy phần tử đó trở thành undefined
, nhưng thuộc tính length
của mảng không thay đổi. Có hai cách xóa phần tử và thay đổi độ dài của mảng.
/*
* Phương pháp: Array.remove(dx)
* Chức năng: Xóa phần tử trong mảng
* Tham số: dx là chỉ số phần tử cần xóa
* Trả về: Thay đổi trực tiếp trên mảng gốc
*/
// Thường dùng là thông qua duyệt mảng, tái cấu trúc lại mảng.
Array.prototype.remove=function(dx)
{
if(isNaN(dx)||dx>this.length){return false;}
for(var i=0,n=0;i<this.length;i++)
{
if(this[i]!=this[dx])
{
this[n++]=this[i]
}
}
this.length-=1
}
a = ['1','2','3','4','5'];
alert("elements: "+a+"nLength: "+a.length);
a.remove(0); // Xóa phần tử có chỉ số là 0
alert("elements: "+a+"nLength: "+a.length);
/*
* Phương pháp: Array.baoremove(dx)
* Chức năng: Xóa phần tử trong mảng
* Tham số: dx là chỉ số phần tử cần xóa
* Trả về: Thay đổi trực tiếp trên mảng gốc
*/
// Chúng ta cũng có thể dùng splice để thực hiện
Array.prototype.baoremove = function(dx)
{
if(isNaN(dx)||dx>this.length){return false;}
this.splice(dx,1);
}
b = ['1','2','3','4','5'];
alert("elements: "+b+"nLength: "+b.length);
b.baoremove(1); // Xóa phần tử có chỉ số là 1
alert("elements: "+b+"nLength: "+b.length);
Chúng ta biết rằng, trong IE5 hoặc các phiên bản thấp hơn, đối tượng Array (mảng) của JavaScript không cung cấp sẵn phương pháp xóa phần tử trong mảng. Trong IE5.5+ tuy có phương pháp splice
, nhưng thực ra không xóa triệt để một (hoặc vài) phần tử, mà chỉ là làm rỗng giá trị của phần tử đó, nói cách khác phần tử đó vẫn tồn tại, độ dài mảng không thay đổi.
Thực tế, chúng ta có thể tự thêm một phương pháp xóa phần tử cho mảng (lưu ý: ở đây là thực sự xóa phần tử khỏi mảng). Có thể bạn sẽ nghĩ đến dùng vòng lặp để gán lại giá trị cho mảng, cách đó tuy được nhưng hiệu suất không cao.
Sau đây là cách dùng hai phương pháp slice
, concat
của đối tượng Array để tự định nghĩa phương pháp xóa phần tử mảng.
Mã cụ thể như sau, chú ý phần chú thích trong đó:
Array.prototype.del=function(n) { // n biểu thị phần tử thứ mấy, bắt đầu từ 0
// prototype là nguyên mẫu của đối tượng, lưu ý đây là cách thêm phương pháp tùy chỉnh cho đối tượng
if(n<0) // Nếu n < 0 thì không làm gì cả
return this;
else
return this.slice(0,n).concat(this.slice(n+1,this.length));
/*
Phương pháp concat: Trả về một mảng mới, là sự kết hợp của hai hoặc nhiều mảng
Ở đây trả về this.slice(0,n) / this.slice(n+1,this.length)
Kết quả là một mảng mới thiếu phần tử thứ n
Phương pháp slice: Trả về một đoạn của mảng, hai tham số xác định vị trí bắt đầu và kết thúc
*/
}
// Thử phương pháp tự thêm này
var test=new Array(0,1,2,3,4,5);
test=test.del(3); // Bắt đầu từ 0, tức là xóa phần tử thứ 4
alert(test);
Tài nguyên này được người dùng tải lên và nội dung được lấy từ Internet. Trang web này chỉ giới thiệu miễn phí để học tập và chia sẻ. Nếu có bất kỳ vấn đề bản quyền hoặc vấn đề nào khác, vui lòng liên hệ với biên tập viên của trang web này để xử lý!
Lưu ý quan trọng: : Nếu phần mềm liên quan đến thanh toán, thành viên, nạp tiền, v.v., thì đây là những hành động của nhà phát triển phần mềm hoặc công ty sở hữu phần mềm đó và không liên quan gì đến trang web này. Cư dân mạng cần phải tự đưa ra phán đoán của mình.