Как удалить элемент из массива по значению?
Проблема: Как удалить элемент из массива в JavaScript по значению?
У меня есть массив:
var ary = ['three', 'seven', 'eleven'];
Я хочу удалить элемент, например, 'seven'
, используя что-то вроде:
removeItem('seven', ary);
Я рассматривал метод splice()
, но он удаляет элемент только по индексу, а мне нужно удалить элемент по его значению.
Есть ли способ сделать это в JavaScript?
5 ответ(ов)
Это может быть глобальной функцией или методом пользовательского объекта, если вам не разрешается добавлять функции к встроенным прототипам. Данная функция удаляет из массива все элементы, которые совпадают с любым из аргументов.
Вот пример реализации, добавляющей метод remove
к прототипу Array
:
Array.prototype.remove = function() {
var what, a = arguments, L = a.length, ax;
while (L && this.length) {
what = a[--L];
while ((ax = this.indexOf(what)) !== -1) {
this.splice(ax, 1);
}
}
return this;
};
var ary = ['three', 'seven', 'eleven'];
ary.remove('seven');
/* возвращаемое значение: (Array)
three,eleven
*/
Если вы хотите сделать это глобальной функцией, можно использовать следующий код:
function removeA(arr) {
var what, a = arguments, L = a.length, ax;
while (L > 1 && arr.length) {
what = a[--L];
while ((ax= arr.indexOf(what)) !== -1) {
arr.splice(ax, 1);
}
}
return arr;
}
var ary = ['three', 'seven', 'eleven'];
removeA(ary, 'seven');
/* возвращаемое значение: (Array)
three,eleven
*/
Также, если вам нужно обеспечить совместимость с IE8 и более ранними версиями, вы можете добавить полифилл для метода indexOf
, как показано ниже:
if(!Array.prototype.indexOf) {
Array.prototype.indexOf = function(what, i) {
i = i || 0;
var L = this.length;
while (i < L) {
if(this[i] === what) return i;
++i;
}
return -1;
};
}
Таким образом, приведенные примеры кода позволяют удалять элементы из массива, используя различные подходы, а также обеспечивать совместимость с устаревшими версиями браузеров.
Вы можете сделать это двумя способами:
const arr = ['1', '2', '3', '4']; // мы хотим удалить число "3"
Первый способ:
arr.indexOf('3') !== -1 && arr.splice(arr.indexOf('3'), 1);
Здесь мы используем метод
indexOf
, чтобы найти индекс элемента, и, если элемент существует (индекс не равен -1), мы применяем методsplice
, чтобы удалить его из массива.Второй способ (ES6), специально без мутации:
const newArr = arr.filter(e => e !== '3');
В этом варианте мы создаем новый массив с помощью метода
filter
, который включает все элементы, кроме '3'. Таким образом, исходный массив остается неизменным.
Метод 1
var ary = ['three', 'seven', 'eleven'];
var index = ary.indexOf('seven'); // получаем индекс, если значение найдено, иначе -1
if (index > -1) { // если найден
ary.splice(index, 1);
}
Метод 2
Однострочное решение
var ary = ['three', 'seven', 'eleven'];
filteredArr = ary.filter(function(v) { return v !== 'seven' });
// Или с использованием ECMA6:
filteredArr = ary.filter(v => v !== 'seven');
Оба метода позволяют удалить элемент из массива. В первом методе мы используем indexOf
для поиска индекса элемента, а затем splice
для его удаления. Во втором методе мы применяем метод filter
, который возвращает новый массив, исключая элемент 'seven'. Выбор метода зависит от ваших предпочтений и того, хотите ли вы изменить исходный массив или создать новый.
Посмотрите на этот способ:
for (var i in array) {
if (array[i] == 'seven') {
array.splice(i, 1);
break;
}
}
А вот реализация в виде функции:
function removeItem(array, item) {
for (var i in array) {
if (array[i] == item) {
array.splice(i, 1);
break;
}
}
}
removeItem(array, 'seven');
Таким образом, мы можем убрать элемент из массива в зависимости от его значения. Функция removeItem
принимает массив и элемент, который нужно удалить, и если элемент найден, он удаляется с помощью splice
. Обратите внимание, что в данном коде используется цикл for...in
, который может вести себя не совсем корректно при работе с массивами, так как он перебирает все перечисляемые свойства объекта. Лучше использовать цикл for
или метод forEach
для перебора массивов.
Самое простое решение:
array
— массив, из которого нужно удалить элемент;
valueForRemove
— элемент, который нужно удалить:
array.filter(arrayItem => !array.includes(valueForRemove));
Ещё проще:
array.filter(arrayItem => arrayItem !== valueForRemove);
Не очень красиво, но работает:
array.filter(arrayItem => array.indexOf(arrayItem) != array.indexOf(valueForRemove));
Не очень красиво, но тоже работает:
while(array.indexOf(valueForRemove) !== -1) {
array.splice(array.indexOf(valueForRemove), 1);
}
P.S. Метод filter()
создаёт новый массив со всеми элементами, прошедшими проверку, реализованную предоставленной функцией. Подробнее можно узнать здесь: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
Как перемешать (сделать случайным) массив в JavaScript?
Как объединить два массива в JavaScript и удалить дубликаты?
Как очистить массив в JavaScript?
Как удалить все дубликаты из массива объектов?
Выбор последнего элемента в массиве JavaScript