79 Вопрос: Как удалить определенный элемент из массива в JavaScript?

вопрос создан в Thu, Feb 14, 2019 12:00 AM

У меня есть массив Numbers, и я использую метод .push() для добавления в него элементов.

Есть ли простой способ удалить определенный элемент из массива? Эквивалент чего-то вроде array.remove(number);.

Я должен использовать core JavaScript - никакие фреймворки не допускаются.

    
7214
  1. Если вам требуется поддержка < IE9 ( sigh ), тогда отметьте этот вопрос SO относительно indexOf в IE.
    2013-09-13 07: 48: 49Z
  2. (lodash) array = ['a', 'b', 'c']; _.pull (array, 'a') //array = > ['До нашей эры']; См. Также stackoverflow.com/questions/5767325/…
    2015-08-25 20: 28: 43Z
  3. метод фильтра может делать то, что вы хотите.
    2015-09-05 23: 43: 21Z
  4. Вы можете использовать удаление, но оно не будет переупорядочивать индекс, а установит для этого слота значение undefined × 1. Например: var list = [1,2,3,4,5,6] - > удалить список [1] ​​- > [1, неопределенное × 1, 3, 4, 5, 6].
    2016-05-24 23: 26: 45Z
  5. Вот эталон производительности двух основных возможностей: jsben .ch /# /b4Ume
    2017-03-03 16: 46: 45Z
30 ответов                              30                         

Найдите index элемента массива, который вы хотите удалить, затем удалите этот индекс с помощью splice .

  

Метод splice () изменяет содержимое массива, удаляя   существующие элементы и /или добавление новых элементов.

р>

var array = [2, 5, 9];
console.log(array)
var index = array.indexOf(5);
if (index > -1) {
  array.splice(index, 1);
}
// array = [2, 9]
console.log(array);

Второй параметр splice - это количество удаляемых элементов. Обратите внимание, что splice изменяет массив на месте и возвращает новый массив, содержащий элементы, которые были удалены.

    
10357
2019-02-17 00: 02: 23Z
  1. @ Питер, да, возможно, вы правы. Эта статья объясняет больше и имеет обходной путь для несовместимых браузеров: developer.mozilla. орг /EN /JavaScript /Справочник /Global_Objects /...
    2011-04-23 22: 28: 10Z
  2. Опасно! Если вы работаете с динамическими значениями (добавление и удаление динамических значений из массива), а значение не существует в массиве (индекс становится -1), приведенный выше код удалит последний элемент массива.
    2013-09-06 16: 44: 17Z
  3. @ AlexandreWiechersVaz Конечно, он сохраняет порядок, а если нет, то будет абсолютно бесполезным
    2013-12-11 19: 18: 02Z
  4. Вы можете преодолеть проблему поддержки браузера IE, включив код приведена здесь
    2014-06-08 10: 42: 27Z
  5. @ AdrianP. array.indexOf(testValue) для пустого массива будет равен -1, и если вы проверяете это, то нет соединения. Может быть, ответ изменился с тех пор.
    2015-01-19 15: 47: 21Z

Я не знаю, что вы ожидаете от array.remove(int). Есть три возможности, о которых вы можете подумать.

Чтобы удалить элемент массива с индексом i:

array.splice(i, 1);

Если вы хотите удалить каждый элемент со значением number из массива:

for(var i = array.length - 1; i >= 0; i--) {
    if(array[i] === number) {
       array.splice(i, 1);
    }
}

Если вы просто хотите, чтобы элемент с индексом i больше не существовал, но вы не хотите, чтобы индексы других элементов изменились:

delete array[i];
    
1077
2018-12-18 17: 42: 12Z
  1. delete - это неправильный способ удаления элемента из массива!
    2013-01-27 15: 30: 48Z
  2. @ FelixKling Зависит от того, работает ли он, если вы хотите, чтобы array.hasOwnProperty(i) возвращал false и чтобы элемент в этой позиции возвращал undefined. Но я признаю, что это так не очень то, что хочется делать.
    2013-01-27 15: 36: 52Z
  3. delete не обновит длину массива и не удалит элемент, а заменит его только специальным значением undefined.
    2013-02-17 03: 44: 59Z
  4. @ diosney Я не знаю, что вы имеете в виду, когда говорите, что на самом деле элемент не стирается. Кроме того, он не просто заменяет значение по этому индексу на undefined: он удаляет как индекс, так и значение из массива, т. Е. После delete array[0], "0" in array вернет false.
    2013-04-15 19: 13: 42Z
  5. удаление - это хороший механизм, если вы имеете дело с именованными свойствами var array=[];array['red']=1;array['green']=2;array['blue']=3;delete array['green'];
    2014-10-21 23: 00: 59Z

Отредактировано в октябре 2016 года

  • Делайте это просто, интуитивно понятно и понятно ( https://en.wikipedia.org/wiki/Окки% 27s_razor )
  • сделать его неизменным (исходный массив остается неизменным)
  • Делайте это со стандартными функциями JS, если ваш браузер их не поддерживает - используйте polyfill

В этом примере кода я использую функцию array.filter (...) " для удаления ненужных элементов из массива, эта функция не меняет исходный массив и создает новый. Если ваш браузер не поддерживает эту функцию (например, IE до версии 9 или Firefox до версии 1.5), рассмотрите возможность использования Полифилл фильтра из Mozilla .

Удаление элемента (код ECMA-262 Edition 5, также известный как JS старого стиля)

var value = 3

var arr = [1, 2, 3, 4, 5, 3]

arr = arr.filter(function(item) { 
    return item !== value
})

console.log(arr)
// [ 1, 2, 4, 5 ]

Удаление элемента (код ES2015)

let value = 3

let arr = [1, 2, 3, 4, 5, 3]

arr = arr.filter(item => item !== value)

console.log(arr)
// [ 1, 2, 4, 5 ]

ВАЖНО ES2015 "() = > {}" Синтаксис функции стрелки не поддерживается в IE вообще, Chrome до 45 версии, Firefox до 22 версии, Safari до 10 версии. Чтобы использовать синтаксис ES2015 в старых браузерах, вы можете использовать BabelJS

Удаление нескольких элементов (код ES2016)

Дополнительным преимуществом этого метода является то, что вы можете удалить несколько элементов

let forDeletion = [2, 3, 5]

let arr = [1, 2, 3, 4, 5, 3]

arr = arr.filter(item => !forDeletion.includes(item))
// !!! Read below about array.includes(...) support !!!

console.log(arr)
// [ 1, 4 ]

ВАЖНО Функция "array.includes (...)" вообще не поддерживается в IE, Chrome до 47 версии, Firefox до 43 версии, Safari до 9 версии и Edge до 14 версии, так что здесь - полифилл из Mozilla

Удаление нескольких элементов (возможно, в будущем)

Если предложение "Синтаксис этого связывания" будет принято, вы быть в состоянии сделать это:

// array-lib.js

export function remove(...forDeletion) {
    return this.filter(item => !forDeletion.includes(item))
}

// main.js

import { remove } from './array-lib.js'

let arr = [1, 2, 3, 4, 5, 3]

// :: This-Binding Syntax Proposal
// using "remove" function as "virtual method"
// without extending Array.prototype
arr = arr::remove(2, 3, 5)

console.log(arr)
// [ 1, 4 ]

Попробуйте сами в BabelJS:)

Ссылка сильный> р>

906
2019-06-23 08: 16: 58Z
  1. но иногда мы хотим удалить элемент из исходного массива (неизменяемого), например, массив, используемый в директиве Angular 2 * ngFor
    2017-02-08 14: 06: 04Z
  2. Лучше, чем принятое решение, поскольку оно не предполагает единственного совпадения, и предпочтительна неизменность
    2017-03-06 16: 46: 21Z
  3. filter должен быть намного медленнее для большого массива?
    2017-07-17 01: 02: 59Z
  4. Какой смысл неизменности упоминается, если вы использовали присвоение той же переменной в ваших примерах? :)
    2017-08-19 11: 36: 51Z
  5. Это отличный ответ. Splice - это специализированная функция для мутации без фильтрации. filter может иметь меньшую производительность, но это более безопасный и лучший код. Кроме того, вы можете фильтровать по индексу, указав второй аргумент в лямбда-выражении: arr.filter((x,i)=>i!==2)
    2018-08-15 12: 50: 44Z

Зависит от того, хотите ли вы оставить пустое место или нет.

Если вам нужен пустой слот, удаление возможно.

delete array[ index ];

Если вы этого не сделаете, вам следует использовать метод splice : р>

array.splice( index, 1 );

И если вам нужно значение этого элемента, вы можете просто сохранить элемент возвращаемого массива:

var value = array.splice( index, 1 )[0];

Если вы хотите сделать это в каком-то порядке, вы можете использовать array.pop() для последнего или array.shift() для первого (и оба возвращают значение элемента тоже).

И если вы не знаете индекс элемента, вы можете использовать array.indexOf( item ), чтобы получить его (в if(), чтобы получить один элемент, или в while(), чтобы получить их все). array.indexOf( item ) возвращает индекс или -1, если не найден.

    
401
2014-07-10 22: 43: 25Z
  1. Стоит отметить, что var value не будет хранить удаленное значение, а массив будет содержать удаленное значение.
    2013-07-10 09: 55: 45Z
  2. delete - неправильный способ удаления элемента из массива !!
    2014-07-04 14: 20: 43Z
  3. Если вы хотите "очистить слот", используйте array[index] = undefined;. Использование delete разрушит оптимизацию.
    2014-08-11 16: 40: 29Z
  4. @ Jakub очень хороший комментарий, потому что понять, что я потерял много времени, и подумал, что мой код приложения каким-то образом поврежден ...
    2014-12-14 19: 14: 58Z
  5. Последний абзац с объяснением того, что вы получаете от indexOf, был действительно полезен
    2019-02-05 16: 31: 34Z

У друга возникли проблемы в Internet Explorer 8 , и он показал мне, что он сделал. Я сказал ему, что это неправильно, и он сказал мне, что получил ответ здесь. Текущий верхний ответ не будет работать во всех браузерах (например, Internet Explorer 8), и он удалит только первое вхождение элемента.

Удалить ВСЕ экземпляры из массива

function remove(arr, item) {
    for (var i = arr.length; i--;) {
        if (arr[i] === item) {
            arr.splice(i, 1);
        }
    }
}

Он перебирает массив в обратном направлении (так как индексы и длина изменяются при удалении элементов) и удаляет элемент, если он найден. Работает во всех браузерах.

    
255
2018-06-08 08: 26: 59Z
  1. @ sro это не должно быть, потому что цикл начинается в i = arr.length -1 или i--, делая его таким же, как индекс max. arr.length - это просто начальное значение для i. i-- всегда будет правдивым (и уменьшится на 1 при каждой операции цикла) до тех пор, пока оно не станет равным 0 (ложное значение) и цикл затем остановится
    2014-01-29 20: 06: 34Z
  2. Вторая функция довольно неэффективна. На каждой итерации indexOf будет начинать поиск с начала массива.
    2015-02-25 13: 32: 12Z
  3. @ AmberdeBlack, в коллекции с более чем 1 вхождением item , намного лучше вызвать filter вместо этого используйте метод arr.filter(function (el) { return el !== item }), избегая необходимости многократного изменения массива. Это потребляет немного больше памяти, но работает намного эффективнее, поскольку требуется меньше работы.
    2015-03-30 09: 37: 04Z
  4. @ AlJey, он доступен только из IE9 +. Есть шанс, что это не сработает.
    2015-03-30 16: 23: 56Z
  5. Этот ответ работал для меня, потому что мне нужно было удалить несколько элементов, но не в каком-то определенном порядке. Обратная последовательность цикла for прекрасно обрабатывает удаление элементов из массива.
    2015-07-14 23: 39: 58Z

Есть два основных подхода:

  1. splice () : anArray.splice(index, 1);

  2. удалить : delete anArray[index];

Будьте осторожны, когда используете delete для массива. Это хорошо для удаления атрибутов объектов, но не так хорошо для массивов. Лучше использовать splice для массивов.

Имейте в виду, что при использовании delete для массива вы можете получить неправильные результаты для anArray.length. Другими словами, delete удалит элемент, но не обновит значение свойства length.

Вы также можете ожидать наличия дырок в индексах после использования delete, например, вы можете получить индексы 1,3,4,8,9,11 и длину, как это было до использования delete. В этом случае всеиндексированные циклы for будут аварийно завершать работу, поскольку индексы больше не являются последовательными.

Если вы по какой-то причине вынуждены использовать delete, вам следует использовать for each зацикливается, когда необходимо перебрать массивы. На самом деле, всегда избегайте использования индексированных циклов for, если это возможно. В этом случае код будет более надежным и менее подверженным проблемам с индексами.

    
150
2017-10-03 12: 04: 03Z
Array.prototype.remByVal = function(val) {
    for (var i = 0; i < this.length; i++) {
        if (this[i] === val) {
            this.splice(i, 1);
            i--;
        }
    }
    return this;
}
//Call like
[1, 2, 3, 4].remByVal(3);

р>

Array.prototype.remByVal = function(val) {
    for (var i = 0; i < this.length; i++) {
        if (this[i] === val) {
            this.splice(i, 1);
            i--;
        }
    }
    return this;
}

var rooms = ['hello', 'something']

rooms = rooms.remByVal('hello')

console.log(rooms)
    
125
2017-09-25 04: 56: 18Z
  1. Я не большой поклонник этого подхода. Если вы в конечном итоге используете разные библиотеки или фреймворки, они могут конфликтовать друг с другом.
    2011-04-23 22: 30: 15Z
  2. Это тоже сработало, хотя я решил в конце пойти с функцией indexOf. Спасибо за помощь!
    2011-04-23 22: 35: 58Z
  3. Плохая идея, см. этот пост: stackoverflow.com/questions/948358/array-prototype-problem
    2012-07-09 22: 10: 08Z
  4. Если вы делаете for in для массива, у вас уже есть проблема.
    2014-05-14 13: 01: 58Z
  5. если вы делаете for in для массивов, у вас уже есть большие проблемы.
    2018-08-01 06: 20: 21Z

Нет необходимости использовать indexOf или splice. Однако он работает лучше, если вы хотите удалить только одно вхождение элемента.

Найти и переместить (переместить):

function move(arr, val) {
  var j = 0;
  for (var i = 0, l = arr.length; i < l; i++) {
    if (arr[i] !== val) {
      arr[j++] = arr[i];
    }
  }
  arr.length = j;
}

Используйте indexOf и splice (indexof):

function indexof(arr, val) {
  var i;
  while ((i = arr.indexOf(val)) != -1) {
    arr.splice(i, 1);
  }
}

Используйте только splice (соединение):

function splice(arr, val) {
  for (var i = arr.length; i--;) {
    if (arr[i] === val) {
      arr.splice(i, 1);
    }
  }
}

Время выполнения на nodejs для массива с 1000 элементов (в среднем более 10000 запусков):

indexof примерно в 10 раз медленнее, чем move . Даже если его улучшить, удалив вызов indexOf в сращивании , он работает намного хуже, чем move .

Remove all occurrences:
    move 0.0048 ms
    indexof 0.0463 ms
    splice 0.0359 ms

Remove first occurrence:
    move_one 0.0041 ms
    indexof_one 0.0021 ms
    
92
2015-09-11 12: 47: 59Z
  1. Похоже, что представленный здесь метод 'move' должен работать во всех браузерах, а также избегает создания дополнительного массива; большинство других решений здесь имеют одну или обе из этих проблем. Я думаю, что этот заслуживает гораздо больше голосов, даже если он не выглядит "симпатичным".
    2015-07-29 11: 50: 21Z

Слишком стар, чтобы отвечать, но может кому-то помочь, предоставив предикат вместо значения.

ПРИМЕЧАНИЕ. обновит указанный массив и возвратит затронутые строки

Использование

var removed = helper.removeOne(arr, row => row.id === 5 );

var removed = helper.remove(arr, row => row.name.startsWith('BMW'));

Определение

var helper = {

    // Remove and return the first occurrence     

    removeOne: function(array, predicate) {
        for (var i = 0; i < array.length; i++) {
            if (predicate(array[i])) {
                return array.splice(i, 1);
            }
        }
    },

    // Remove and return all occurrences  

    remove: function(array, predicate) {
        var removed = [];

        for (var i = 0; i < array.length;) {

            if (predicate(array[i])) {
                removed.push(array.splice(i, 1));
                continue;
            }

            i++;                
        }

        return removed;
    }
};
    
62
2016-12-26 10: 57: 02Z
  1. Я не знаю, что вам нужноОтредактировал проверку -1 (i > -1). Кроме того, я думаю, что эти функции действуют скорее как фильтр, чем как удаление. Если вы передадите row.id === 5, это приведет к массиву только с идентификатором 5, поэтому он выполняет противоположное удаление. Это будет хорошо выглядеть в ES2015: var result = ArrayHelper.remove (myArray, row = > row.id === 5);
    2015-09-20 19: 42: 45Z
  2. @ WhatWouldBeCool эта функция изменяет исходный массив и возвращает удаленный элемент вместо копирования результата в новый массив
    2015-09-21 07: 21: 13Z

Джон Ресиг опубликовал хорошую реализацию :

// Array Remove - By John Resig (MIT Licensed)
Array.prototype.remove = function(from, to) {
  var rest = this.slice((to || from) + 1 || this.length);
  this.length = from < 0 ? this.length + from : from;
  return this.push.apply(this, rest);
};

Если вы не хотите расширять глобальный объект, вместо этого вы можете сделать что-то вроде следующего:

// Array Remove - By John Resig (MIT Licensed)
Array.remove = function(array, from, to) {
    var rest = array.slice((to || from) + 1 || array.length);
    array.length = from < 0 ? array.length + from : from;
    return array.push.apply(array, rest);
};

Но главная причина, по которой я публикую это, состоит в том, чтобы предостеречь пользователей от альтернативной реализации, предложенной в комментариях на этой странице (14 декабря 2007 г.):

Array.prototype.remove = function(from, to){
  this.splice(from, (to=[0,from||1,++to-from][arguments.length])<0?this.length+to:to);
  return this.length;
};

Поначалу кажется, что он работает хорошо, но через болезненный процесс я обнаружил, что он не работает при попытке удалить второй или последний элемент в массиве. Например, если у вас есть массив из 10 элементов, и вы пытаетесь удалить 9-й элемент следующим образом:

myArray.remove(8);

Вы получите массив из 8 элементов. Не знаю почему, но я подтвердил, что оригинальная реализация Джона не имеет этой проблемы.

    
58
2015-02-16 12: 51: 30Z
  1. Просто на собственном опыте усвоил, почему стоит использовать Object.prototype.hasOwnProperty всегда ¬¬
    2015-04-11 04: 58: 05Z

Underscore.js можно использовать для решения проблем с несколькими браузерами. Он использует встроенные методы браузера, если таковые имеются. Если они отсутствуют, как в случае более старых версий Internet Explorer, он использует свои собственные пользовательские методы.

Простой пример удаления элементов из массива (с веб-сайта):

_.without([1, 2, 1, 0, 3, 1, 4], 0, 1); // => [2, 3, 4]
    
56
2017-05-21 11: 29: 54Z

Это легко сделать с помощью метода фильтра : р>

function remove(arrOriginal, elementToRemove){
    return arrOriginal.filter(function(el){return el !== elementToRemove});
}
console.log( remove([1, 2, 1, 0, 3, 1, 4], 1) );

Это удаляет все элементы из массива, а также работает быстрее, чем комбинация slice и indexOf

    
55
2014-02-10 22: 06: 01Z
  1. У вас есть источник того, что это быстрее?
    2017-07-28 18: 21: 57Z
  2. Хорошее решение. Но, как вы отметили, но важно сделать лысый, он не даст тот же результат, что и slice и indexOf, так как он удалит все вхождения 1
    2017-07-28 18: 28: 36Z
  3. @ user3711421 это потому, что просто slice и indexOf не делают то, что он хочет "удалить определенный элемент". Он удаляет элемент только один раз, это удаляет определенный элемент независимо от того, сколько у вас их
    2017-07-28 20: 05: 09Z

Если вы хотите новый массив с удаленными удаленными позициями, вы всегда можете удалить определенный элемент и отфильтровать массив. Может потребоваться расширение объекта массива для браузеров, которыене реализуйте метод фильтра, но в долгосрочной перспективе это проще, так как все, что вы делаете, это:

var my_array = [1,2,3,4,5,6];
delete my_array[4];
console.log(my_array.filter(function(a){return typeof a !== 'undefined';}));

Должен отображаться [1, 2, 3, 4, 6]

    
46
2014-09-05 07: 59: 57Z

Вы можете использовать ES6.

var array=['1','2','3','4','5','6']
var index = array.filter((value)=>value!='3');

Вывод:

["1", "2", "4", "5", "6"]
    
39
2016-11-19 08: 59: 00Z
  1. Этот ответ хорош, потому что он создает копию исходного массива вместо непосредственного изменения оригинала.
    2017-03-16 15: 27: 40Z
  2. Примечание. Array.prototype.filter - это ECMAScript 5.1 (без IE8). для более конкретных решений: stackoverflow.com/a/54390552/8958729
    2019-01-27 19: 45: 05Z

Проверьте этот код. Он работает в каждом главном браузере .

remove_item = function (arr, value) {
    var b = '';
    for (b in arr) {
        if (arr[b] === value) {
            arr.splice(b, 1);
            break;
        }
    }
    return arr;
}

вызвать эту функцию

remove_item(array,value);
    
36
2014-05-24 07: 02: 53Z
  1. @ RolandIllig За исключением использования цикла for in и того факта, что сценарий можно было остановить раньше, возвращая результат из цикла напрямую. Прогнозы разумны;)
    2014-12-30 16: 13: 41Z
  2. Это отличный подход для небольших массивов. Он работает в любом браузере, использует минимальный и интуитивно понятный код и не требует каких-либо дополнительных сложных каркасов, прокладок или полифилов.
    2016-08-21 23: 12: 41Z
  3. Я также должен повторить комментарий yckart о том, что for( i = 0; i < arr.length; i++ ) будет лучшим подходом, поскольку он сохраняет точные индексы в зависимости от того, в каком порядке браузер решит хранить элементы (с for in). Это также позволяет вам получить индекс массива значения, если вам это нужно.
    2016-08-21 23: 20: 39Z

Вы можете использовать lodash _.pull (мутировать массив), _. pullAt (массив мутирования) или _.without (не изменяет массив),

var array1 = ['a', 'b', 'c', 'd']
_.pull(array1, 'c')
console.log(array1) // ['a', 'b', 'd']

var array2 = ['e', 'f', 'g', 'h']
_.pullAt(array2, 0)
console.log(array2) // ['f', 'g', 'h']

var array3 = ['i', 'j', 'k', 'l']
var newArray = _.without(array3, 'i') // ['j', 'k', 'l']
console.log(array3) // ['i', 'j', 'k', 'l']
    
34
2015-08-25 21: 19: 16Z
  1. Это не основной JS, как запрашивал OP, не так ли?
    2015-09-24 21: 01: 50Z
  2. @ some-non-descript-user Вы правы. Но многие пользователи, такие как я, приходят сюда в поисках общего ответа, а не только для OP.
    2015-10-01 03: 38: 30Z
  3. @ ChunYang Вы абсолютно правы. Я уже использую lodash, почему бы просто не использовать его, если это экономит время.
    2018-06-08 21: 48: 30Z

ОК, например, у вас есть приведенный ниже массив:

var num = [1, 2, 3, 4, 5];

И мы хотим удалить номер 4, вы можете просто сделать следующий код:

num.splice(num.indexOf(4), 1); //num will be [1, 2, 3, 5];

Если вы повторно используете эту функцию, вы пишете функцию многократного использования, которая будет присоединена к функции Native array, как показано ниже:

Array.prototype.remove = Array.prototype.remove || function(x) {
  const i = this.indexOf(x);
  if(i===-1) return;
  this.splice(i, 1); //num.remove(5) === [1, 2, 3];
}

Но как насчет того, чтобы вместо этого у вас был массив ниже с несколькими [5] в массиве?

var num = [5, 6, 5, 4, 5, 1, 5];

Нам нужен цикл, чтобы проверить их все, но более простой и эффективный способ - использовать встроенные функции JavaScript, поэтому мы пишем функцию, которая использует фильтр, как показано ниже:

const _removeValue = (arr, x) => arr.filter(n => n!==x);
//_removeValue([1, 2, 3, 4, 5, 5, 6, 5], 5) //return [1, 2, 3, 4, 6]

Также есть сторонние библиотеки, которые могут помочь вам сделать это, например, Lodash или Underscore, для получения дополнительной информации смотрите lodash _.pull, _.pullAt или _.without.

    
32
2018-03-26 00: 23: 30Z
  1. Существует небольшая опечатка. Пожалуйста исправьте. this.splice(num.indexOf(x), 1); = > this.splice(this.indexOf(x), 1);
    2017-05-11 12: 28: 30Z
  2. Пожалуйста, не расширяйте встроенные модули (присоединяйте функции к Array.prototype) в JavaScript. Это считается плохой практикой.
    2017-05-24 03: 29: 54Z
  3. Я согласен, что это не лучшая вещь в мире, но как в этом случае передать ее функции?
    2017-05-25 08: 45: 07Z
  4. Вы должны проверить индекс. Если index = -1, splice (-1,1) удалит последний элемент
    2018-01-26 09: 38: 10Z

Вот несколько способов удалить элемент из массива с помощью JavaScript .

Все описанные методы не изменяют исходный массив , а вместо этого создают новый.

Если вам известен индекс элемента

Предположим, у вас есть массив, и вы хотите удалить элемент в позиции i.

Одним из способов является использование slice():

р>

const items = ['a', 'b', 'c', 'd', 'e', 'f']
const i = 3
const filteredItems = items.slice(0, i).concat(items.slice(i+1, items.length))

console.log(filteredItems)

slice() создает новый массив с полученными индексами. Мы просто создаем новый массив от начала до индекса, который мы хотим удалить, и объединяем другой массив с первой позиции, следующей за той, которую мы удалили, до конца массива.

Если вы знаете значение

В этом случае один хороший вариант - использовать filter(), который предлагает более декларативный подход:

р>

const items = ['a', 'b', 'c', 'd', 'e', 'f']
const valueToRemove = 'c'
const filteredItems = items.filter(item => item !== valueToRemove)

console.log(filteredItems)

Используются функции стрелок ES6. Вы можете использовать традиционные функции для поддержки старых браузеров:

р>

const items = ['a', 'b', 'c', 'd', 'e', 'f']
const valueToRemove = 'c'
const filteredItems = items.filter(function(item) {
  return item !== valueToRemove
})

console.log(filteredItems)

или вы можете использовать Babel и перенести код ES6 обратно в ES5, чтобы сделать его более удобным для старых браузеров, и в то же время написать современный JavaScript в своем коде.

Удаление нескольких элементов

Что если вместо одного элемента вы хотите удалить много элементов?

Давайте найдем самое простое решение.

По индексу

Вы можете просто создать функцию и удалять элементы последовательно:

р>

const items = ['a', 'b', 'c', 'd', 'e', 'f']

const removeItem = (items, i) =>
  items.slice(0, i-1).concat(items.slice(i, items.length))

let filteredItems = removeItem(items, 3)
filteredItems = removeItem(filteredItems, 5)
//["a", "b", "c", "d"]

console.log(filteredItems)

По значению

Вы можете искать включение внутри функции обратного вызова:

р>

const items = ['a', 'b', 'c', 'd', 'e', 'f']
const valuesToRemove = ['c', 'd']
const filteredItems = items.filter(item => !valuesToRemove.includes(item))
// ["a", "b", "e", "f"]

console.log(filteredItems)

Избегайте мутации исходного массива

splice() (не путать с slice()) изменяет исходный массив, и его следует избегать.

(первоначально размещено на https://flaviocopes.com/how-to -remove-элемент-из-массива /) р>     

29
2019-04-14 16: 39: 51Z
  1. Я думаю, что в вашем примере вы хотите items.slice(0, i).concat(items.slice(i+1, items.length)), (0, i) вместо (0, i-1), поскольку элемент массива 'end' не являетсявключены в результат. Кроме того, i + 1 подходит для второй части, так как он возвращает пустой массив, если он выходит за пределы.
    2019-03-17 17: 02: 30Z
  2. Вы правы. Я исправил это в своем блоге некоторое время назад, но никогда не менял его в ответе! Спасибо, что сказали мне
    2019-04-14 16: 40: 33Z

Я довольно новичок в JavaScript и мне нужна эта функциональность. Я просто написал это:

function removeFromArray(array, item, index) {
  while((index = array.indexOf(item)) > -1) {
    array.splice(index, 1);
  }
}

Тогда, когда я захочу это использовать:

//Set-up some dummy data
var dummyObj = {name:"meow"};
var dummyArray = [dummyObj, "item1", "item1", "item2"];

//Remove the dummy data
removeFromArray(dummyArray, dummyObj);
removeFromArray(dummyArray, "item2");

Вывод - как и ожидалось. ["item1", "item1"]

У вас могут быть другие потребности, чем у меня, поэтому вы можете легко изменить их в соответствии с их потребностями. Надеюсь, это кому-нибудь поможет.

    
27
2014-12-30 16: 17: 43Z
  1. Это будет иметь ужасное поведение, если ваш массив очень длинный и в нем есть несколько экземпляров элемента. Метод indexOf массива будет начинаться каждый раз с начала, поэтому ваша стоимость будет O (n ^ 2).
    2019-05-24 18: 22: 30Z

ES6 & без мутации: (октябрь 2016 г.)

const removeByIndex = (list, index) =>
  [
    ...list.slice(0, index),
    ...list.slice(index + 1)
  ];

Тогда:

removeByIndex([33,22,11,44],1) //=> [33,11,44]
    
25
2016-10-07 19: 42: 51Z
  1. вверх вверх вверх вверх вверх uuuuuuuuuuuuup! это более актуально, это должен быть ответ № 1, а не № 20 !!!
    2018-09-14 09: 28: 18Z

Обновление . Этот метод рекомендуется, только если вы не можете использовать ECMAScript 2015 (ранее известный как ES6). Если вы можете использовать его, другие ответы здесь обеспечивают более аккуратные реализации.

Этот раздел решит вашу проблему, а также удалит все вхождения аргумента вместо только 1 (или указанное значение).

Array.prototype.destroy = function(obj){
    // Return null if no objects were found and removed
    var destroyed = null;

    for(var i = 0; i < this.length; i++){

        // Use while-loop to find adjacent equal objects
        while(this[i] === obj){

            // Remove this[i] and store it within destroyed
            destroyed = this.splice(i, 1)[0];
        }
    }

    return destroyed;
}

Использование:

var x = [1, 2, 3, 3, true, false, undefined, false];

x.destroy(3);         // => 3
x.destroy(false);     // => false
x;                    // => [1, 2, true, undefined]

x.destroy(true);      // => true
x.destroy(undefined); // => undefined
x;                    // => [1, 2]

x.destroy(3);         // => null
x;                    // => [1, 2]
    
23
2017-09-01 22: 41: 13Z

Если у вас есть сложные объекты в массиве, вы можете использовать фильтры? В ситуациях, когда $.inArray или array.splice не так просты в использовании. Особенно если объекты, возможно, мелкие в массиве.

например. если у вас есть объект с полем Id и вы хотите, чтобы объект был удален из массива:

this.array = this.array.filter(function(element, i) {
    return element.id !== idToRemove;
});
    
22
2015-11-10 04: 20: 21Z
  1. Вот как мне нравится это делать. Используя функцию стрелки это может быть однострочник. Мне интересно о производительности. Также ничего не стоит, что этот заменяет массив. Любой код со ссылкой на старый массив не заметит изменения.
    2016-07-29 08: 50: 36Z

Я хочу ответить на основании ES6 . Предположим, у вас есть массив, как показано ниже:

let arr = [1,2,3,4];

Если вы хотите удалить специальный индекс, например 2, напишите следующий код:

arr.splice(2, 1); //=> arr became [1,2,4]

Но если вы хотите удалить специальный элемент, например 3, и вы не знаете его индекс, сделайте, как показано ниже:

arr = arr.filter(e => e !== 3); //=> arr became [1,2,4]

Подсказка : используйте функцию стрелки дляфильтруйте обратный вызов, если только вы не получите пустой массив.

    
21
2019-02-24 12: 06: 30Z
  1. последний параметр вернет пустой массив
    2018-12-18 09: 24: 36Z
  2. @ Dejan.S, я удивлен, какой у вас массив и что вы хотите опустить в своем массиве?
    2018-12-18 09: 35: 11Z
  3. Это было плохо, я использовал обычную функцию и должен был явно сделать оператор возврата. Извините за это:)
    2018-12-18 09: 39: 43Z
  4. @ Dejan.S, я отредактировал ответ для некоторых ошибок, таких как ваша ошибка, и добавил подсказку, если вы отрицаете меня, вы можете поднять сейчас.
    2018-12-18 11: 50: 51Z

Вы никогда не должны мутировать ваш массив. Как это против функционального шаблона программирования. Что вы можете сделать, это создать новый массив без ссылки на массив, для которого вы хотите изменить данные, используя метод es6 filter;

var myArray = [1,2,3,4,5,6];

Предположим, что вы хотите удалить 5 из массива, вы можете просто сделать это следующим образом.

myArray = myArray.filter(value => value !== 5);

Это даст вам новый массив без значения, которое вы хотите удалить. Таким образом, результат будет

 [1,2,3,4,6]; // 5 has been removed from this array

Для дальнейшего понимания вы можете прочитать документацию по MDN на Array.filter https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter р>     

19
2017-12-26 19: 32: 06Z

Более современный подход ECMAScript 2015 (ранее известный как Harmony или ES 6). Дано:

const items = [1, 2, 3, 4];
const index = 2;

Тогда:

items.filter((x, i) => i !== index);

Уступая:

[1, 2, 4]

Вы можете использовать Babel и polyfill сервис , чтобы обеспечить его хорошую поддержку во всех браузерах.

    
18
2016-06-25 13: 01: 46Z
  1. Обратите внимание, что .filter возвращает новый массив, который не совсем совпадает с удалением элемента из того же массива. Преимущество этого подхода заключается в том, что вы можете объединять методы массива вместе. например: [1,2,3].filter(n => n%2).map(n => n*n) === [ 1, 9 ]
    2016-05-06 18: 58: 02Z
  2. Отлично, если у меня есть 600k элементов в массиве и я хочу удалить первые 50k, вы можете себе представить эту медлительность? Это не решение, нужна функция, которая просто удаляет элементы и ничего не возвращает.
    2016-05-30 15: 11: 17Z
  3. @ Seraph Для этого вы, вероятно, захотите использовать splice или slice.
    2016-05-31 22: 04: 28Z
  4. @ bjfletcher Это даже лучше, в процессе удаления, просто выделите 50K элементов и бросьте их куда-нибудь. (с фрагментом 550K элементов, но не выбрасывая их из окна).
    2016-05-31 23: 06: 07Z
  5. Я бы предпочел ответ bjfletcher, который может быть таким же коротким, как items= items.filter(x=>x!=3). Кроме того, OP не указал никаких требований для большого набора данных.
    2016-08-27 01: 55: 25Z

Я знаю, что ответов уже много, но многие из них, кажется, слишком усложняют проблему. Вот простой рекурсивный способ удаления всех экземпляров ключа - вызывает self, пока индекс не будет найден. Да, он работает только в браузерах с indexOf, но он прост и может быть легко заполнен.

Автономная функция

function removeAll(array, key){
    var index = array.indexOf(key);

    if(index === -1) return;

    array.splice(index, 1);
    removeAll(array,key);
}

Метод прототипа

Array.prototype.removeAll = function(key){
    var index = this.indexOf(key);

    if(index === -1) return;

    this.splice(index, 1);
    this.removeAll(key);
}
    
16
2014-02-19 22: 20: 53Z
  1. Просто примечание, 1 предостережение при использовании этого метода может привести к переполнению стека. Если вы не работаете с массивными массивами, у вас не должно быть проблем.
    2015-09-08 05: 57: 20Z

Вы можете сделать обратный цикл, чтобы убедиться, что индексы не испорчены, если имеется несколько экземпляров элемента.

var myElement = "chocolate";
var myArray = ['chocolate', 'poptart', 'poptart', 'poptart', 'chocolate', 'poptart', 'poptart', 'chocolate'];

/* Important code */
for (var i = myArray.length - 1; i >= 0; i--) {
    if (myArray[i] == myElement) myArray.splice(i, 1);
}

Демонстрационная версия

    
15
2013-08-12 17: 56: 39Z

У меня есть еще одно хорошее решение для удаления из массива:

var words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

https: //developer.mozilla. орг /EN-US /Docs /Web /JavaScript /Справка /Global_Objects /Array /фильтр

    
15
2018-06-05 15: 51: 34Z

У вас есть массив от 1 до 9, и вы хотите удалить 5 из приведенного ниже кода.

р>

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

var newNumberArray = numberArray.filter(m => {
  return m !== 5;
});

console.log("new Array, 5 removed", newNumberArray);

Если вы хотите получить несколько значений, например: - 1,7,8

р>

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

var newNumberArray = numberArray.filter(m => {
  return (m !== 1) && (m !== 7) && (m !== 8);
});

console.log("new Array, 5 removed", newNumberArray);

Если вы хотите удалить значение массива в массиве, например: - [3,4,5]

р>

var numberArray = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var removebleArray = [3,4,5];

var newNumberArray = numberArray.filter(m => {
    return !removebleArray.includes(m);
});

console.log("new Array, [3,4,5] removed", newNumberArray);

включает поддерживаемый браузер по ссылке

    
15
2018-08-21 04: 21: 54Z

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

function arrayWithout(arr, values) {
  var isArray = function(canBeArray) {
    if (Array.isArray) {
      return Array.isArray(canBeArray);
    }
    return Object.prototype.toString.call(canBeArray) === '[object Array]';
  };

  var excludedValues = (isArray(values)) ? values : [].slice.call(arguments, 1);
  var arrCopy = arr.slice(0);

  for (var i = arrCopy.length - 1; i >= 0; i--) {
    if (excludedValues.indexOf(arrCopy[i]) > -1) {
      arrCopy.splice(i, 1);
    }
  }

  return arrCopy;
}

Изучив вышеуказанную функцию, несмотря на то, что она работает нормально, я понял, что может быть некоторое улучшение производительности. Также использование ES6 вместо ES5 является гораздо лучшим подходом. Для этого это улучшенный код:

const arrayWithoutFastest = (() => {
  const isArray = canBeArray => ('isArray' in Array) 
    ? Array.isArray(canBeArray) 
    : Object.prototype.toString.call(canBeArray) === '[object Array]';

  let mapIncludes = (map, key) => map.has(key);
  let objectIncludes = (obj, key) => key in obj;
  let includes;

  function arrayWithoutFastest(arr, ...thisArgs) {
    let withoutValues = isArray(thisArgs[0]) ? thisArgs[0] : thisArgs;

    if (typeof Map !== 'undefined') {
      withoutValues = withoutValues.reduce((map, value) => map.set(value, value), new Map());
      includes = mapIncludes;
    } else {
      withoutValues = withoutValues.reduce((map, value) => { map[value] = value; return map; } , {}); 
      includes = objectIncludes;
    }

    const arrCopy = [];
    const length = arr.length;

    for (let i = 0; i < length; i++) {
      // If value is not in exclude list
      if (!includes(withoutValues, arr[i])) {
        arrCopy.push(arr[i]);
      }
    }

    return arrCopy;
  }

  return arrayWithoutFastest;  
})();

Как использовать:

const arr = [1,2,3,4,5,"name", false];

arrayWithoutFastest(arr, 1); // will return array [2,3,4,5,"name", false]
arrayWithoutFastest(arr, 'name'); // will return [2,3,4,5, false]
arrayWithoutFastest(arr, false); // will return [2,3,4,5]
arrayWithoutFastest(arr,[1,2]); // will return [3,4,5,"name", false];
arrayWithoutFastest(arr, {bar: "foo"}); // will return the same array (new copy)

В настоящее время я пишу сообщение в блоге, в котором проверил несколько решений для Array без проблем и сравнил время, необходимое для запуска. Я дополню этот ответ ссылкой, как только закончу этот пост. Просто чтобы вы знали, я сравнил вышеупомянутое с lodash без, и в случае, если браузер поддерживает Map, это лучше, чем lodash! Обратите внимание, что я не использую Array.prototype.indexOf или Array.prototype.includes как обертывание значений exlcudeValues ​​в Map или Object делает запросы быстрее!

    
15
2018-11-19 23: 02: 58Z
источник размещен Вот