Jak usunąć element z tablicy w JavaScript?

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

Usuń pierwszy element

Chcę usunąć pierwszy element tablicy, aby stał się:

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

Usuń drugi element

Aby rozszerzyć to pytanie, co jeśli chcę usunąć drugi element tablicy, aby stał się:

var arr = [1,3,5,6];
użytkownik198729
źródło
1
slice(start, end)nie „how_many_to_remove”
seanjacob
2
@Ped arr.unshift () nie USUWA, ale „Dodaje jeden lub więcej elementów na początek tablicy”
psycho brm
@seanjacob chyba splicenie slice.
Animesh Singh,

Odpowiedzi:

346

Aby uzyskać bardziej elastyczne rozwiązanie, użyj splice()funkcji. Pozwala usunąć dowolny element z tablicy w oparciu o wartość indeksu:

var indexToRemove = 0;
var numberToRemove = 1;

arr.splice(indexToRemove, numberToRemove);
Gabriel McAdams
źródło
12
I kolejne pytanie: arr.splice(1,1)dla drugiego elementu.
slebetman
1
Wolę splice()ponad, shift()ponieważ jest bardziej elastyczny. W przyszłości mogę chcieć zrobić coś innego i nie zawsze chcę usunąć tylko jeden element, a nawet pierwszy element.
Gabriel McAdams
14
Jeśli przychodzisz tutaj z Google: Gabriel woli tę odpowiedź, ale powinieneś być świadomy, że jest także shift (), patrz odpowiedź Józefa.
SHernandez
668

shift()jest idealny do twojej sytuacji. shift()usuwa pierwszy element z tablicy i zwraca ten element. Ta metoda zmienia długość tablicy.

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

array.shift(); // 1

array // [2, 3, 4, 5]
JP Silvashy
źródło
To działa, ale usunie tylko pierwszy element z tablicy.
Gabriel McAdams
53
@Gabriel: czy nie było to dokładnie pytanie? Wolę shift()się splice(..., ...), ponieważ jest znacznie bardziej wyraźne, bezpośrednie.
Bruno Reis,
6
Korekta: Zwraca pierwszy element, a nie nową tablicę minus pierwszy element, zgodnie z podanym linkiem :)
DanH
Chociaż przykład kod jest poprawny, opis jest mylące: (A) @DanH zaznacza się, że jest to pierwszy element, który jest zwracany , oraz (b) to, że tablica wejściowa jest modyfikowany nie jest jasne. Dlatego odpowiedź Peda jest lepsza.
mklement0
2
shiftjest szybszy, chyba że łączysz duże listy jsperf.com/splice-vs-shift3 i jsperf.com/splice-vs-shift2
kcathode
61

Array.prototype.shiftSposób usuwa się pierwszy element tablicy i zwraca go. Zmienia oryginalną tablicę.

var a = [1,2,3]
// [1,2,3]
a.shift()
// 1
a
//[2,3]
p3drosola
źródło
4
Znaczna poprawa odpowiedzi Josepha Silvashy'a - brak niespójności między opisem a kodem.
mklement0
48
arr.slice(begin[,end])

nie jest destrukcyjny, splot i shift zmodyfikują twoją oryginalną tablicę

kiuma
źródło
3
Tak za brak mutacji. To powinno być bardziej widoczne.
użytkownik
16

Napisałem mały artykuł o wstawianiu i usuwaniu elementów z dowolnych pozycji w tablicach Javascript.

Oto mały fragment, aby usunąć element z dowolnej pozycji. Rozszerza to klasę Array w JavaScript i dodaje metodę remove (index).

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

Aby więc usunąć pierwszy element z twojego przykładu, wywołaj arr.remove ():

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

Aby usunąć drugi element,

arr.remove(1);

Oto mały artykuł z metodami wstawiania i usuwania dla klasy Array.

Zasadniczo nie różni się to od innych odpowiedzi z użyciem splajnu, ale nazwa splicenie jest intuicyjna, a jeśli masz to wywołanie w całej aplikacji, sprawia to, że kod jest trudniejszy do odczytania.

Anurag
źródło
14

Może coś takiego:

arr=arr.slice(1);
ThatGuyYouKnow
źródło
7

Inne odpowiedzi są świetne, chciałem tylko dodać alternatywne rozwiązanie ES6funkcji Array: filter.

filter() tworzy nową tablicę z elementami spełniającymi określone kryteria z istniejącej tablicy.

Dzięki temu możesz łatwo używać go do usuwania elementów, które nie spełniają kryteriów. Zaletą tej funkcji jest to, że można jej używać na złożonej tablicy, a nie tylko na ciągach i liczbach.

Kilka przykładów :

Usuń pierwszy element :

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

Usuń drugi element :

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

Usuń nieparzysty element :

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

Usuń przedmioty, których nie ma na magazynie

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

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

Martin Choraine
źródło
2

Możesz użyć funkcji ES6 Destr Struktura Assignment z operatorem spoczynkowym. Przecinek wskazuje miejsce, w którym chcesz usunąć element, a operator reszty (... arr), aby dać ci pozostałe elementy tablicy.

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]

Brendan
źródło
1

Array.splice()ma interesującą właściwość, której nie można użyć do usunięcia pierwszego elementu. Musimy się więc uciekać

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

    if ( index === -1 ) {
        return array.shift();
    } else {
        return array.splice( index, 1 );
    }
}
Gabriel Schulhof
źródło
3
Array.splice (0,1) usuwa pierwszy element. Zgodnie z każdą inną odpowiedzią tutaj i zgodnie z developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… . Ponadto, dlaczego ktoś miałby przekazać -1, aby usunąć pierwszy element? Czy nie przejdą 0?
kamień
@skypecakes Nie mogę mówić o ważności łączenia na 0. indeksie, ale tutaj indeks jest pomniejszany przed tym sprawdzeniem, więc przy przekazaniu byłby 0.
Jake T.
Tak, zdecydowanie może usunąć pierwszy element. Testowałem to tutaj: jsfiddle.net/sijpkes/d87rcLob/2
sijpkes
1

Rozwiązanie maszynopisu, które nie mutuje oryginalnej tablicy

function removeElementAtIndex<T>(input: T[], index: number) {
  return input.slice(0, index).concat(input.slice(index + 1));
}
pie6k
źródło
1

Istnieje wiele sposobów usunięcia elementu z tablicy. Pozwól mi wskazać najczęściej używane opcje poniżej. Piszę tę odpowiedź, ponieważ ze wszystkich tych opcji nie mogłem znaleźć odpowiedniego powodu. Odpowiedź na pytanie to opcja 3 ( Splice () ).

1) SHIFT () - Usuń pierwszy element z oryginalnej tablicy i zwróć pierwszy element

Zobacz odwołanie do Array.prototype.shift () . Użyj tego tylko wtedy, gdy chcesz usunąć pierwszy element i tylko jeśli nie masz nic przeciwko zmianie oryginalnej tablicy.

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 () - Zwraca kopię tablicy oddzieloną początkowym indeksem i końcowym indeksem

Zobacz odwołanie do Array.prototype.slice () . Nie można usunąć określonego elementu z tej opcji. Możesz tylko wyciąć istniejącą tablicę i uzyskać ciągłą część tablicy. To jak wycinanie tablicy z określonych indeksów. Oryginalna tablica nie ulega zmianie.

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 () - Zmień zawartość tablicy, usuwając lub zastępując elementy o określonych indeksach.

Zobacz odwołanie do Array.prototype.splice () . Metoda splice () zmienia zawartość tablicy, usuwając lub zastępując istniejące elementy i / lub dodając nowe elementy na miejscu. Zwraca zaktualizowaną tablicę. Oryginalna tablica zostanie zaktualizowana.

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"]
Keet Sugathadasa
źródło
0

Możesz to również zrobić, zmniejszając:

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())
JESTEM NAJLEPSZA
źródło