16

Убрать пустые элементы из массива в JavaScript

13

Как удалить пустые элементы из массива в JavaScript?

Существует ли простой способ сделать это, или мне придется проходить по массиву и удалять их вручную?

5 ответ(ов)

18

Несколько простых способов:

var arr = [1, 2, , 3, , -3, null, , 0, , undefined, 4, , 4, , 5, , 6, , , , ,];

arr.filter(n => n)
// [1, 2, 3, -3, 4, 4, 5, 6]

arr.filter(Number)
// [1, 2, 3, -3, 4, 4, 5, 6]

arr.filter(Boolean)
// [1, 2, 3, -3, 4, 4, 5, 6]

или - классический способ: простая итерация

var arr = [1, 2, null, undefined, 3, , 3, , , 0, , , [], , {}, , 5, , 6, , , , ,],
    len = arr.length, i;

for (i = 0; i < len; i++)
    arr[i] && arr.push(arr[i]);  // копируем непустые значения в конец массива

arr.splice(0, len);  // обрезаем массив, оставляя только непустые значения
// [1, 2, 3, 3, [], Object{}, 5, 6]

jQuery:

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

arr = $.grep(arr, n => n == 0 || n);
// [1, 2, 3, 3, 0, 4, 4, 5, 6]
14

Редактировать: Этот вопрос был задан почти девять лет назад, когда в Array.prototype не было так много полезных встроенных методов.

Теперь я определенно рекомендую использовать метод filter.

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

Например, если вы хотите удалить значения null или undefined:

var array = [0, 1, null, 2, "", 3, undefined, 3,,,,,, 4,, 4,, 5,, 6,,,,];

var filtered = array.filter(function (el) {
  return el != null;
});

console.log(filtered);

Это будет зависеть от того, что вы считаете "пустым". Например, если вы работаете со строками, приведенная выше функция не удалит элементы, которые являются пустыми строками.

Одним из типичных паттернов, которые я часто наблюдаю, является удаление элементов, которые являются ложными (falsy), включая пустую строку "", 0, NaN, null, undefined и false.

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

var filtered = array.filter(Boolean);

Или

var filtered = array.filter(function(el) { return el; });

В обоих случаях это работает, потому что в первом случае метод filter вызывает конструктор Boolean как функцию, преобразуя значение, а во втором случае метод filter внутри себя неявно преобразует возвращаемое значение обратного вызова в Boolean.

Если вы работаете с разреженными массивами и пытаетесь избавиться от "пустот", вы можете использовать метод filter, передав ему обратный вызов, который всегда возвращает true, например:

var sparseArray = [0, , , 1, , , , , 2, , , , 3],
    cleanArray = sparseArray.filter(function () { return true });

console.log(cleanArray); // [ 0, 1, 2, 3 ]

Старый ответ: Не делайте этого!

Я использую этот метод, расширяя нативный прототип массива:

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

test = new Array("", "One", "Two", "", "Three", "", "Four").clean("");
test2 = [1, 2,, 3,, 3,,,,,, 4,, 4,, 5,, 6,,,,];
test2.clean(undefined);

Или вы можете просто добавить существующие элементы в другой массив:

// Удалит все ложные значения: undefined, null, 0, false, NaN и "" (пустую строку)
function cleanArray(actual) {
  var newArray = new Array();
  for (var i = 0; i < actual.length; i++) {
    if (actual[i]) {
      newArray.push(actual[i]);
    }
  }
  return newArray;
}

cleanArray([1, 2,, 3,, 3,,,,,, 4,, 4,, 5,, 6,,,,]);
2

Если вам нужно удалить все пустые значения ("" , null, undefined и 0), вы можете использовать метод filter следующим образом:

arr = arr.filter(function(e) { return e }); 

Для удаления пустых значений и символов переноса строки (Line breaks) вы можете использовать следующий код:

arr = arr.filter(function(e) { return e.replace(/(\r\n|\n|\r)/gm, ""); });

Вот пример использования:

arr = ["hello", 0, "", null, undefined, 1, 100, " "];  
arr = arr.filter(function(e) { return e });

Результат:

["hello", 1, 100, " "]

ОбНОВЛЕНИЕ (основано на комментарии Alnitak)

В некоторых случаях вам может потребоваться оставить "0" в массиве и удалить все остальные значения (null, undefined и ""), в этом случае вы можете использовать такой подход:

arr = arr.filter(function(e) { return e === 0 || e });

Результат будет следующим:

["hello", 0, 1, 100, " "]
1

Для удаления "дырок" в массивах можно использовать следующий код:

arr.filter(() => true);
arr.flat(0); // Новинка в ES2019

Чтобы удалить "дыры", null и undefined:

arr.filter(x => x != null);

Для удаления "дыр", а также ложных (null, undefined, 0, -0, 0n, NaN, "", false) значений:

arr.filter(x => x);

Пример использования:

arr = [, null, (void 0), 0, -0, 0n, NaN, false, '', 42];
console.log(arr.filter(() => true)); // [null, (void 0), 0, -0, 0n, NaN, false, '', 42]
console.log(arr.filter(x => x != null)); // [0, -0, 0n, NaN, false, "", 42]
console.log(arr.filter(x => x)); // [42]

Примечание:

  • "Дыры" — это индексы массива, которые не содержат элементов.
arr = [, ,];
console.log(arr[0], 0 in arr, arr.length); // undefined, false, 2; arr[0] - это дыра
arr[42] = 42;
console.log(arr[10], 10 in arr, arr.length); // undefined, false, 43; arr[10] - это дыра

arr1 = [1, 2, 3];
arr1[0] = (void 0);
console.log(arr1[0], 0 in arr1); // undefined, true; a[0] - это undefined, а не дыра

arr2 = [1, 2, 3];
delete arr2[0]; // НИКОГДА так не делайте
console.log(arr2[0], 0 in arr2, arr2.length); // undefined, false; a[0] - это дыра
  • Все вышеупомянутые методы возвращают копию заданного массива, не изменяя его на месте.
arr = [1, 3, null, 4];
filtered = arr.filter(x => x != null);
console.log(filtered); // [1, 3, 4]
console.log(arr); // [1, 3, null, 4]; не изменён
0

Самый чистый способ сделать это — использовать метод filter с конструктором Boolean в качестве колбэка. Это позволит вам отфильтровать все "ложные" значения из массива. Вот пример:

var arr = [0, 1, 2, "Thomas", "false", false, true, null, 3, 4, undefined, 5, "end"];
arr = arr.filter(Boolean);
// Результат: [1, 2, "Thomas", "false", true, 3, 4, 5, "end"]

В этом коде filter(Boolean) удаляет все значения, которые приводятся к false, включая 0, false, null, undefined, и т. д. Таким образом, в массив остаются только "истинные" значения.

Чтобы ответить на вопрос, пожалуйста, войдите или зарегистрируйтесь