Як видалити елемент з масиву в JavaScript?


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

Видаліть перший елемент

Я хочу видалити перший елемент масиву, щоб він став:

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

Видаліть другий елемент

Щоб розширити це питання, що робити, якщо я хочу видалити другий елемент масиву, щоб він став:

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

1
slice(start, end)не 'how_many_to_remove'
seanjacob

2
@Ped arr.unshift () не видаляє, але "додає один або кілька елементів до початку масиву"
psycho brm

@seanjacob це spliceне sliceгадаю.
Анімеш Сінгх

Відповіді:


346

Для більш гнучкого рішення використовуйте splice()функцію. Це дозволяє видалити будь-який елемент із масиву на основі значення індексу:

var indexToRemove = 0;
var numberToRemove = 1;

arr.splice(indexToRemove, numberToRemove);

12
І наступне питання: arr.splice(1,1)для другого елемента.
slebetman

1
Я вважаю splice()за краще, shift()тому що його більш гнучким. Я, можливо, захочу зробити щось інше в майбутньому, і не завжди я хочу видалити лише один елемент, або навіть перший елемент.
Габріель МакАдамс

14
Якщо ви приїхали сюди з Google: Габріель віддає перевагу цій відповіді, але ви повинні знати, що також є shift (), дивіться відповідь Йосифа.
Шернандес

668

shift()ідеально підходить для вашої ситуації. shift()видаляє перший елемент з масиву і повертає цей елемент. Цей метод змінює довжину масиву.

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

array.shift(); // 1

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

Це працює, але видалить лише перший елемент з масиву.
Габріель МакАдамс

53
@Gabriel: не було саме це питання? Я вважаю shift()за краще, splice(..., ...)оскільки це набагато більш чітко, прямо.
Бруно Рейс

6
Виправлення: Він повертає перший елемент, а не новий масив мінус перший елемент, відповідно до наданого посилання :)
DanH

Хоча приклад коду правильний, опис вводить в оману: (a) як вказує @DanH, це перший елемент, який повертається , і (b) той факт, що вхідний масив модифікований , не з'ясовується. Тому відповідь Педа вища.
mklement0

2
shiftшвидше, якщо ви не зробите великі списки jsperf.com/splice-vs-shift3 та jsperf.com/splice-vs-shift2
kcathode

61

Array.prototype.shiftМетод видаляє перший елемент з масиву і повертає його. Він змінює вихідний масив.

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

4
Велике вдосконалення у відповіді Йосифа Сильваші - відсутність невідповідностей між описом та кодом.
mklement0

48
arr.slice(begin[,end])

не руйнує, зрощення та зсув змінить ваш початковий масив


3
Так, не мутуючи. Це повинно бути більш помітним.
користувач

16

Написав невелику статтю про вставлення та видалення елементів у довільних положеннях у масивах Javascript.

Ось невеликий фрагмент для видалення елемента з будь-якої позиції. Це розширює клас Array в Javascript і додає метод видалення (індекс).

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

Отже, щоб видалити перший елемент у вашому прикладі, зателефонуйте arr.remove ():

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

Щоб видалити другий елемент,

arr.remove(1);

Ось крихітна стаття з методами вставлення та видалення для класу Array.

По суті, це не відрізняється від інших відповідей за допомогою сплайсу, але це ім'я spliceне інтуїтивно зрозуміло, і якщо у вас є такий дзвінок у всій програмі, це просто робить код важче читати.



7

Відповіді інших чудові, я просто хотів додати альтернативне рішення з ES6функцією Array : filter.

filter() створює новий масив з елементами, які підпадають під задані критерії з існуючого масиву.

Таким чином, ви можете легко використовувати його для видалення елементів, які не відповідають критеріям. Переваги цієї функції полягають у тому, що ви можете використовувати її для складного масиву не просто рядка та числа.

Деякі приклади:

Видаліть перший елемент :

// 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]

Видаліть другий елемент :

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

Видалити непарний елемент :

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

Видаліть предмети, які відсутні на складі

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

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


2

Ви можете використовувати функцію присвоєння руйнування ES6 з оператором відпочинку. Кома вказує, куди ви хочете видалити елемент, а решта (... arr) оператора, щоб дати вам інші елементи масиву.

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()має цікаву властивість, що не можна використовувати його для видалення першого елемента. Отже, нам потрібно вдатися

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

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

3
Array.splice (0,1) видаляє перший елемент. Відповідно до будь-якої іншої відповіді тут, і відповідно до developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… . Крім того, чому хтось пропустить -1, щоб видалити перший елемент? Хіба вони не пройдуть 0?
камінь

@skypecakes Я не можу говорити про дійсність сплайсу на 0-му індексі, але тут індекс зменшується перед цією перевіркою, тому він би був 0 при передачі.
Джейк Т.

Так, це однозначно може видалити перший елемент. Я перевірив це тут: jsfiddle.net/sijpkes/d87rcLob/2
sijpkes

1

Рішення машинопису, яке не мутує вихідний масив

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

1

Існує кілька способів видалення елемента з масиву. Дозвольте зазначити найбільш часто використовувані варіанти нижче. Я пишу цю відповідь, тому що я не зміг знайти належну причину, що використовувати з усіх цих варіантів. Відповідь на питання - варіант 3 ( Splice () ).

1) SHIFT () - Видаліть перший елемент з початкового масиву та поверніть перший елемент

Дивіться посилання на Array.prototype.shift () . Використовуйте це лише в тому випадку, якщо ви хочете видалити перший елемент, і лише якщо ви не в порядку зі зміною вихідного масиву.

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 () - повертає копію масиву, розділену індексом початку та індексом кінця

Дивіться посилання на Array.prototype.slice () . Ви не можете видалити певний елемент із цієї опції. Ви можете взяти лише фрагмент існуючого масиву і отримати безперервну частину масиву. Це як вирізати масив із вказаних вами індексів. На оригінальний масив це не впливає.

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 () - зміна вмісту масиву шляхом видалення або заміни елементів на конкретні індекси.

Дивіться посилання на Array.prototype.splice () . Метод splice () змінює вміст масиву шляхом видалення або заміни існуючих елементів та / або додавання нових елементів на місце. Повертає оновлений масив. Оригінальний масив оновлюється.

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

Ви також можете зробити це за допомогою зменшення:

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())
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.