Làm cách nào để xóa phần tử khỏi một mảng trong JavaScript?


340
var arr = [1,2,3,5,6];

Xóa phần tử đầu tiên

Tôi muốn loại bỏ phần tử đầu tiên của mảng để nó trở thành:

var arr = [2,3,5,6];

Xóa phần tử thứ hai

Để mở rộng câu hỏi này, điều gì sẽ xảy ra nếu tôi muốn loại bỏ phần tử thứ hai của mảng để nó trở thành:

var arr = [1,3,5,6];

1
slice(start, end)không phải 'how_many_to_remove'
seanjacob

2
@Ped Array.unshift () không XÓA, nhưng "Thêm một hoặc nhiều yếu tố vào đầu một mảng"
psycho brm

@seanjacob splicekhông phải slicetôi đoán.
Animesh Singh

Câu trả lời:


346

Đối với một giải pháp linh hoạt hơn, sử dụng splice()chức năng. Nó cho phép bạn xóa bất kỳ mục nào trong Mảng dựa trên Giá trị Chỉ mục:

var indexToRemove = 0;
var numberToRemove = 1;

arr.splice(indexToRemove, numberToRemove);

12
Và câu hỏi tiếp theo: arr.splice(1,1)cho phần tử thứ hai.
slebetman

1
Tôi thích splice()hơn shift()vì nó linh hoạt hơn. Tôi có thể muốn làm một cái gì đó khác biệt trong tương lai và không phải lúc nào tôi cũng muốn loại bỏ chỉ một yếu tố, hoặc thậm chí là yếu tố đầu tiên.
Gabriel McAdams

14
Nếu bạn đến đây từ Google: Gabriel thích câu trả lời này, nhưng bạn nên biết rằng cũng có ca (), hãy xem câu trả lời của Joseph.
SHernandez

668

shift()là lý tưởng cho tình huống của bạn. shift()loại bỏ phần tử đầu tiên khỏi một mảng và trả về phần tử đó. Phương pháp này thay đổi độ dài của mảng.

array = [1, 2, 3, 4, 5];

array.shift(); // 1

array // [2, 3, 4, 5]

Điều này hoạt động, nhưng sẽ chỉ loại bỏ phần tử đầu tiên trong mảng.
Gabriel McAdams

53
@Gabriel: chính xác đó không phải là câu hỏi? Tôi thích shift()đến splice(..., ...)vì nó là nhiều hơn nữa rõ ràng, chỉ đạo.
Bruno Reis

6
Sửa lỗi: Nó trả về phần tử đầu tiên, không phải là một mảng mới trừ phần tử đầu tiên, theo liên kết bạn đã cung cấp :)
DanH

Trong khi ví dụ mã là chính xác, mô tả sai lệch: (a) như @DanH chỉ ra, đó là phần tử đầu tiên được trả về và (b) thực tế là mảng đầu vào được sửa đổi không được làm rõ. Do đó, câu trả lời của Ped là vượt trội.
mkuity0

2
shiftnhanh hơn trừ khi bạn ghép các danh sách lớn jsperf.com/splice-vs-shift3jsperf.com/splice-vs-shift2
kcathode

61

Các Array.prototype.shiftphương pháp loại bỏ phần tử đầu tiên từ một mảng, và trả về nó. Nó sửa đổi các mảng ban đầu.

var a = [1,2,3]
// [1,2,3]
a.shift()
// 1
a
//[2,3]

4
Một cải tiến tuyệt vời cho câu trả lời của Joseph Silvashy - không có sự mâu thuẫn giữa mô tả và mã.
mkuity0

48
arr.slice(begin[,end])

không phá hủy, mối nối và sự thay đổi sẽ sửa đổi mảng ban đầu của bạn


3
Yea cho không đột biến. Điều này nên được nhìn thấy rõ hơn.
người dùng

16

Đã viết một bài viết nhỏ về việc chèn và xóa các phần tử tại các vị trí tùy ý trong Mảng Javascript.

Đây là đoạn nhỏ để xóa phần tử khỏi bất kỳ vị trí nào. Điều này mở rộng lớp Array trong Javascript và thêm phương thức remove (index).

// Remove element at the given index
Array.prototype.remove = function(index) {
    this.splice(index, 1);
}

Vì vậy, để loại bỏ mục đầu tiên trong ví dụ của bạn, hãy gọi Array.remove ():

var arr = [1,2,3,5,6];
arr.remove(0);

Để xóa mục thứ hai,

arr.remove(1);

Đây là một bài viết nhỏ với các phương thức chèn và xóa cho lớp Array.

Về cơ bản, điều này không khác gì các câu trả lời khác khi sử dụng splice, nhưng tên splicenày không trực quan và nếu bạn có cuộc gọi đó trên tất cả ứng dụng của mình, nó chỉ khiến mã khó đọc hơn.



7

Những câu trả lời khác rất hay, tôi chỉ muốn thêm một giải pháp thay thế với ES6hàm Array : filter.

filter() tạo một mảng mới với các phần tử nằm trong một tiêu chí nhất định từ một mảng hiện có.

Vì vậy, bạn có thể dễ dàng sử dụng nó để loại bỏ các mục không vượt qua các tiêu chí. Lợi ích của chức năng này là bạn có thể sử dụng nó trên mảng phức tạp không chỉ chuỗi và số.

Vài ví dụ :

Xóa phần tử đầu tiên :

// Not very useful but it works
function removeFirst(element, index) {
  return index > 0;
}
var arr = [1,2,3,5,6].filter(removeFirst); // [2,3,4,5,6]

Xóa phần tử thứ hai :

function removeSecond(element, index) {
  return index != 1;
}
var arr = [1,2,3,5,6].filter(removeSecond); // [1,3,4,5,6]

Xóa phần tử lẻ :

function removeOdd(element, index) {
  return !(element % 2);
}
var arr = [1,2,3,5,6].filter(removeOdd); [2,4,6]

Loại bỏ các mặt hàng không có trong kho

const inventory = [
  {name: 'Apple', qty: 2},
  {name: 'Banana', qty: 0},
  {name: 'Orange', qty: 5}
];

const res = inventory.find( product => product.qty > 0);


2

Bạn có thể sử dụng tính năng Phân công hủy cấu trúc ES6 với toán tử nghỉ. Dấu phẩy cho biết nơi bạn muốn xóa phần tử và toán tử phần còn lại (... mảng) để cung cấp cho bạn các phần tử còn lại của mảng.

const source = [1,2,3,5,6];

function removeFirst(list) {
   var  [, ...arr] = list;
   return arr;
}
const arr = removeFirst(source);
console.log(arr); // [2, 3, 5, 6]
console.log(source); // [1, 2, 3, 5, 6]


1

Array.splice()có thuộc tính thú vị mà người ta không thể sử dụng nó để loại bỏ phần tử đầu tiên. Vì vậy, chúng ta cần phải dùng đến

function removeAnElement( array, index ) {
    index--;

    if ( index === -1 ) {
        return array.shift();
    } else {
        return array.splice( index, 1 );
    }
}

3
Array.splice (0,1) loại bỏ phần tử đầu tiên. Theo mọi câu trả lời khác ở đây và theo developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/ trộm . Ngoài ra, tại sao ai đó sẽ vượt qua -1 để loại bỏ phần tử đầu tiên? Họ sẽ không vượt qua 0?
đá

@skypecakes Tôi không thể nói về tính hợp lệ của mối nối trên chỉ số 0, nhưng ở đây chỉ số này bị giảm trước khi kiểm tra, vì vậy nó sẽ là 0 khi được thông qua.
Jake T.

Yup, nó chắc chắn có thể loại bỏ các yếu tố đầu tiên. Tôi đã thử nghiệm nó ở đây: jsfiddle.net/sijpkes/d87rcLob/2
sijpkes

1

Giải pháp bản in không làm thay đổi mảng ban đầu

function removeElementAtIndex<T>(input: T[], index: number) {
  return input.slice(0, index).concat(input.slice(index + 1));
}

1

Có nhiều cách để loại bỏ một phần tử khỏi Mảng. Hãy để tôi chỉ ra hầu hết các tùy chọn được sử dụng dưới đây. Tôi đang viết câu trả lời này vì tôi không thể tìm thấy lý do chính đáng để sử dụng những gì từ tất cả các tùy chọn này. Câu trả lời cho câu hỏi là tùy chọn 3 ( Splice () ).

1) SHIFT () - Xóa phần tử đầu tiên khỏi mảng gốc và trả về phần tử đầu tiên

Xem tài liệu tham khảo cho Array.prototype.shift () . Chỉ sử dụng điều này nếu bạn muốn loại bỏ phần tử đầu tiên và chỉ khi bạn ổn với việc thay đổi mảng ban đầu.

const array1 = [1, 2, 3];

const firstElement = array1.shift();

console.log(array1);
// expected output: Array [2, 3]

console.log(firstElement);
// expected output: 1

2) SLICE () - Trả về một bản sao của mảng, được phân tách bằng chỉ mục bắt đầu và chỉ mục kết thúc

Xem tài liệu tham khảo cho Array.prototype.slice () . Bạn không thể loại bỏ một yếu tố cụ thể khỏi tùy chọn này. Bạn chỉ có thể cắt lát mảng hiện có và lấy một phần liên tục của mảng. Nó giống như cắt mảng từ các chỉ mục bạn chỉ định. Các mảng ban đầu không bị ảnh hưởng.

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]

3) SPLICE () - Thay đổi nội dung của mảng bằng cách xóa hoặc thay thế các thành phần tại các chỉ mục cụ thể.

Xem tài liệu tham khảo cho Array.prototype.splice () . Phương thức splice () thay đổi nội dung của một mảng bằng cách loại bỏ hoặc thay thế các phần tử hiện có và / hoặc thêm các phần tử mới vào vị trí. Trả về mảng cập nhật. Mảng gốc được cập nhật.

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// inserts at index 1
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
// replaces 1 element at index 4
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "May"]

0

Bạn cũng có thể làm điều này với giảm:

let arr = [1, 2, 3]

arr.reduce((xs, x, index) => {
        if (index == 0) {
            return xs
        } else {
            return xs.concat(x)
        }
    }, Array())

// Or if you like a oneliner
arr.reduce((xs, x, index) => index == 0 ? xs : xs.concat(x), Array())
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.