Как удалить пустые элементы из массива в JavaScript?
Есть ли простой способ, или мне нужно его пропустить и удалить вручную?
Удалить пустые элементы из массива в Javascript
Ответ 1
ОБНОВЛЕНИЕ: На этот вопрос ответили почти девять лет назад, когда в 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);Ответ 2
Простые способы:
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]
или - (только для отдельных элементов массива типа "текст")
['','1','2',3,,'4',,undefined,,,'5'].join('').split('');
// output: ["1","2","3","4","5"]
или - Классический способ: простая итерация
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]); // copy non-empty values to the end of the array
arr.splice(0 , len); // cut the array and leave only the non-empty values
arr // [1,2,3,3,[],Object{},5,6]
через JQuery:
var arr = [1,2,,3,,3,,,0,,,4,,4,,5,,6,,,,];
arr = $.grep(arr,function(n){ return n == 0 || n });
arr // [1, 2, 3, 3, 0, 4, 4, 5, 6]
ОБНОВЛЕНИЕ - просто еще один быстрый, крутой способ (с использованием ES6):
var arr = [1,2,null, undefined,3,,3,,,0,,,4,,4,,5,,6,,,,],
temp = [];
for(let i of arr)
i && temp.push(i); // copy each non-empty value to the 'temp' array
arr = temp;
arr // [1, 2, 3, 3, 4, 4, 5, 6]
Удалить пустые значения
['foo', '',,,'',,null, ' ', 3, true, [], [1], {}, undefined, ()=>{}].filter(String)
// ["foo", null, " ", 3, true, [1], Object {}, undefined, ()=>{}]
Ответ 3
Если вам нужно удалить ВСЕ пустые значения ("", null, undefined и 0):
arr = arr.filter(function(e){return e});
Чтобы удалить пустые значения и разрывы строк:
arr = arr.filter(function(e){ return e.replace(/(\r\n|\n|\r)/gm,"")});
Пример:
arr = ["hello",0,"",null,undefined,1,100," "]
arr.filter(function(e){return e});
Вернуть:
["hello", 1, 100, " "]
ОБНОВЛЕНИЕ (на основе комментария Алнитак)
В некоторых ситуациях вы можете захотеть сохранить "0" в массиве и удалить что-нибудь еще (null, undefined и ""), это один из способов:
arr.filter(function(e){ return e === 0 || e });
Вернуть:
["hello", 0, 1, 100, " "]
Ответ 4
Просто один вкладыш:
[1, false, "", undefined, 2].filter(Boolean); // [1, 2]
или используя underscorejs.org:
_.filter([1, false, "", undefined, 2], Boolean); // [1, 2]
// or even:
_.compact([1, false, "", undefined, 2]); // [1, 2]
Ответ 5
Если у вас есть Javascript 1.6 или более поздняя версия, вы можете использовать Array.filter с помощью тривиальной функции обратного вызова return true, например:
arr = arr.filter(function() { return true; });
так как .filter автоматически пропускает отсутствующие элементы в исходном массиве.
Страница MDN, связанная выше, также содержит хорошую версию проверки ошибок filter, которая может использоваться в интерпретаторах JavaScript, которые не поддерживают официальную версию.
Обратите внимание, что это не приведет к удалению записей null или записей с явным значением undefined, но OP специально запросил "отсутствующие" записи.
Ответ 6
Для удаления дырок следует использовать
arr.filter(() => true)
arr.flat(0) // Currently stage 3, check compatibility before using this
Для удаления значений отверстий и ложных значений (null, undefined, 0, -0, NaN, "", false, document.all):
arr.filter(x => x)
Для удаления отверстия, нуля и неопределенного:
arr.filter(x => x != null)
arr = [, null, (void 0), 0, -0, NaN, false, '', 42];
console.log(arr.filter(() => true)); // [null, (void 0), 0, -0, NaN, false, '', 42]
console.log(arr.filter(x => x)); // [42]
console.log(arr.filter(x => x != null)); // [0, -0, NaN, false, "", 42]Ответ 7
Чистый способ сделать это.
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"]
Ответ 8
Простой ES6
['a','b','',,,'w','b'].filter(v => v);
Ответ 9
С помощью Underscore/Lodash:
Общий прецедент:
_.without(array, emptyVal, otherEmptyVal);
_.without([1, 2, 1, 0, 3, 1, 4], 0, 1);
С опорожнениями:
_.without(['foo', 'bar', '', 'baz', '', '', 'foobar'], '');
--> ["foo", "bar", "baz", "foobar"]
Смотрите документацию lodash без.
Ответ 10
Просто ES6 и метод более новых версий, предположим, что массив находится ниже:
const arr = [1,2,3,undefined,4,5,6,undefined,7,8,undefined,undefined,0,9];
Простой способ:
const clearArray = arr.filter( i => i );
Ответ 11
Если использование библиотеки является опцией, я знаю, что функция underscore.js имеет функцию compact() http://documentcloud.github.com/underscore/, она также имеет несколько других полезных функции, связанные с массивами и коллекциями.
Вот выдержка из их документации:
_. compact (массив)
Возвращает копию массива со всеми потерянными значениями фальши. В JavaScript ложные, нулевые, 0, "", undefined и NaN являются ложными.
_. compact ([0, 1, false, 2, '', 3]);
= > [1, 2, 3]
Ответ 12
@Alnitak
Фактически Array.filter работает во всех браузерах, если вы добавляете дополнительный код. См. Ниже.
var array = ["","one",0,"",null,0,1,2,4,"two"];
function isempty(x){
if(x!=="")
return true;
}
var res = array.filter(isempty);
document.writeln(res.toJSONString());
// gives: ["one",0,null,0,1,2,4,"two"]
Это код, который вам нужно добавить для IE, но для фильтра и функционального программирования стоит imo.
//This prototype is provided by the Mozilla foundation and
//is distributed under the MIT license.
//http://www.ibiblio.org/pub/Linux/LICENSES/mit.license
if (!Array.prototype.filter)
{
Array.prototype.filter = function(fun /*, thisp*/)
{
var len = this.length;
if (typeof fun != "function")
throw new TypeError();
var res = new Array();
var thisp = arguments[1];
for (var i = 0; i < len; i++)
{
if (i in this)
{
var val = this[i]; // in case fun mutates this
if (fun.call(thisp, val, i, this))
res.push(val);
}
}
return res;
};
}
Ответ 13
Поскольку никто не упомянул об этом, и большинство людей подчеркивают, что они включены в их проект, вы также можете использовать _.without(array, *values);.
_.without(["text", "string", null, null, null, "text"], null)
// => ["text", "string", "text"]
Ответ 14
ES6: let newArr = arr.filter(e => e);
Ответ 15
Вам может показаться, что вам легче перебрать свой массив и построить новый массив из элементов, которые вы хотите сохранить из массива, чем пытаться выполнить цикл и сплайсинг, как было предложено, так как он изменяет длину массива, пока он зацикливается, может ввести проблемы.
Вы можете сделать что-то вроде этого:
function removeFalsyElementsFromArray(someArray) {
var newArray = [];
for(var index = 0; index < someArray.length; index++) {
if(someArray[index]) {
newArray.push(someArray[index]);
}
}
return newArray;
}
На самом деле это более общее решение:
function removeElementsFromArray(someArray, filter) {
var newArray = [];
for(var index = 0; index < someArray.length; index++) {
if(filter(someArray[index]) == false) {
newArray.push(someArray[index]);
}
}
return newArray;
}
// then provide one or more filter functions that will
// filter out the elements based on some condition:
function isNullOrUndefined(item) {
return (item == null || typeof(item) == "undefined");
}
// then call the function like this:
var myArray = [1,2,,3,,3,,,,,,4,,4,,5,,6,,,,];
var results = removeElementsFromArray(myArray, isNullOrUndefined);
// results == [1,2,3,3,4,4,5,6]
Вы получаете идею - вы могли бы иметь другие типы фильтров. Вероятно, больше, чем вам нужно, но я чувствовал себя великодушным...;)
Ответ 16
Как насчет этого (ES6): удалить значение Falsy из массива.
var arr = [0,1,2,"test","false",false,true,null,3,4,undefined,5,"end"];
arr.filter((v) => (!!(v)==true));
//output:
//[1, 2, "test", "false", true, 3, 4, 5, "end"]
Ответ 17
Вы должны использовать фильтр для получения массива без пустых элементов. Пример ES6
const array = [1, 32, 2, undefined, 3];
const newArray = array.filter(arr => arr);
Ответ 18
Я просто добавляю свой голос к вышеупомянутому "вызываю ES5 Array..filter() с помощью глобального конструктора" golf-hack ", но я предлагаю использовать Object вместо String, Boolean или Number как предложенной выше.
В частности, ES5 filter() уже не запускается для элементов undefined в массиве; поэтому функция, которая универсально возвращает true, которая возвращает все элементы filter() хитов, обязательно возвращает только элементы undefined:
> [1,,5,6,772,5,24,5,'abc',function(){},1,5,,3].filter(function(){return true})
[1, 5, 6, 772, 5, 24, 5, 'abc', function (){}, 1, 5, 3]
Однако запись ...(function(){return true;}) длиннее записи ...(Object); и возвращаемое значение конструктора Object будет при любых обстоятельствах каким-то объектом. В отличие от предложенных выше примитивных бокс-конструкторов, никакое возможное значение объекта не является ложным и, следовательно, в булевой установке Object является короткой для function(){return true}.
> [1,,5,6,772,5,24,5,'abc',function(){},1,5,,3].filter(Object)
[1, 5, 6, 772, 5, 24, 5, 'abc', function (){}, 1, 5, 3]
Ответ 19
При использовании наивысшего проголосовавшего ответа выше, в первом примере, я получал отдельные символы для длин строк больше 1. Ниже мое решение для этой проблемы.
var stringObject = ["", "some string yay", "", "", "Other string yay"];
stringObject = stringObject.filter(function(n){ return n.length > 0});
Вместо того, чтобы не возвращаться, если undefined, мы возвращаем, если длина больше 0. Надеюсь, что кто-то поможет там.
Возвращает
["some string yay", "Other string yay"]
Ответ 20
var data = [null, 1,2,3];
var r = data.filter(function(i){ return i != null; })
console.log(r)
[1,2,3]
Ответ 21
Как насчет этого:
js> [1,2,,3,,3,,,0,,,4,,4,,5,,6,,,,].filter(String).join(',')
1,2,3,3,0,4,4,5,6
Ответ 22
Это работает, я тестировал его в AppJet (вы можете скопировать-вставить код в свою IDE и нажать "перезагрузить" на см. его работу, не нужно создавать учетную запись)
/* appjet:version 0.1 */
function Joes_remove(someArray) {
var newArray = [];
var element;
for( element in someArray){
if(someArray[element]!=undefined ) {
newArray.push(someArray[element]);
}
}
return newArray;
}
var myArray2 = [1,2,,3,,3,,,0,,,4,,4,,5,,6,,,,];
print("Original array:", myArray2);
print("Clenased array:", Joes_remove(myArray2) );
/*
Returns: [1,2,3,3,0,4,4,5,6]
*/
Ответ 23
Другой способ сделать это - использовать свойство length массива: упаковать ненулевые элементы в "левом" массиве, а затем уменьшить длину. Это алгоритм на месте - не выделяет память, что слишком плохо для сборщика мусора, и у него очень хорошее поведение в наилучшем/среднем/худшем случае.
Это решение, по сравнению с другими здесь, в Chrome от 2 до 50 раз быстрее и в Firefox в 5-50 раз быстрее, чем вы можете здесь: http://jsperf.com/remove-null-items-from-array
В приведенном ниже коде добавляется неперечислимый метод removeNull к массиву, который возвращает 'this' для последовательного соединения:
var removeNull = function() {
var nullCount = 0 ;
var length = this.length ;
for (var i=0, len=this.length; i<len; i++) { if (!this[i]) {nullCount++} }
// no item is null
if (!nullCount) { return this}
// all items are null
if (nullCount == length) { this.length = 0; return this }
// mix of null // non-null
var idest=0, isrc=length-1;
length -= nullCount ;
while (true) {
// find a non null (source) slot on the right
while (!this[isrc]) { isrc--; nullCount--; }
if (!nullCount) { break } // break if found all null
// find one null slot on the left (destination)
while ( this[idest]) { idest++ }
// perform copy
this[idest]=this[isrc];
if (!(--nullCount)) {break}
idest++; isrc --;
}
this.length=length;
return this;
};
Object.defineProperty(Array.prototype, 'removeNull',
{ value : removeNull, writable : true, configurable : true } ) ;
Ответ 24
foo = [0, 1, 2, "", , false, 3, "four", null]
foo.filter(function(e) {
return e === 0 ? '0' : e
})
возвращает
[0, 1, 2, 3, "four"]
Ответ 25
"Неправильное использование" цикла for... in (object-member). = > В теле цикла появляются только правдивые значения.
// --- Example ----------
var field = [];
field[0] = 'One';
field[1] = 1;
field[3] = true;
field[5] = 43.68;
field[7] = 'theLastElement';
// --- Example ----------
var originalLength;
// Store the length of the array.
originalLength = field.length;
for (var i in field) {
// Attach the truthy values upon the end of the array.
field.push(field[i]);
}
// Delete the original range within the array so that
// only the new elements are preserved.
field.splice(0, originalLength);
Ответ 26
Это может помочь вам: https://lodash.com/docs/4.17.4#remove
var details = [
{
reference: 'ref-1',
description: 'desc-1',
price: 1
}, {
reference: '',
description: '',
price: ''
}, {
reference: 'ref-2',
description: 'desc-2',
price: 200
}, {
reference: 'ref-3',
description: 'desc-3',
price: 3
}, {
reference: '',
description: '',
price: ''
}
];
scope.removeEmptyDetails(details);
expect(details.length).toEqual(3);
scope.removeEmptyDetails = function(details){
_.remove(details, function(detail){
return (_.isEmpty(detail.reference) && _.isEmpty(detail.description) && _.isEmpty(detail.price));
});
};
Ответ 27
var data= {
myAction: function(array){
return array.filter(function(el){
return (el !== (undefined || null || ''));
}).join(" ");
}
};
var string = data.myAction(["I", "am","", "working", "", "on","", "nodejs", "" ]);
console.log(string);
Вывод:
Я работаю над nodejs
Он удалит пустой элемент из массива и отобразит другой элемент.
Ответ 28
Фильтрация недопустимых записей с регулярным выражением
array = array.filter(/\w/);
filter + regexp
Ответ 29
Лучший способ удалить пустые элементы - использовать Array.prototype.filter(), как уже упоминалось в других ответах.
К сожалению, Array.prototype.filter() не поддерживается IE < 9. Если вам все еще нужно поддерживать IE8 или даже более старую версию IE, вы можете использовать следующие polyfill, чтобы добавьте поддержку для Array.prototype.filter() в этих браузерах:
if (!Array.prototype.filter) {
Array.prototype.filter = function(fun/*, thisArg*/) {
'use strict';
if (this === void 0 || this === null) {
throw new TypeError();
}
var t = Object(this);
var len = t.length >>> 0;
if (typeof fun !== 'function') {
throw new TypeError();
}
var res = [];
var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
for (var i = 0; i < len; i++) {
if (i in t) {
var val = t[i];
if (fun.call(thisArg, val, i, t)) {
res.push(val);
}
}
}
return res;
};
}
Ответ 30
Если кто-то ищет очистку всего массива или объекта, это может помочь.
var qwerty = {
test1: null,
test2: 'somestring',
test3: 3,
test4: {},
test5: {
foo: "bar"
},
test6: "",
test7: undefined,
test8: " ",
test9: true,
test10: [],
test11: ["77","88"],
test12: {
foo: "foo",
bar: {
foo: "q",
bar: {
foo:4,
bar:{}
}
},
bob: {}
}
}
var asdfg = [,,"", " ", "yyyy", 78, null, undefined,true, {}, {x:6}, [], [2,3,5]];
function clean_data(obj) {
for (var key in obj) {
// Delete null, undefined, "", " "
if (obj[key] === null || obj[key] === undefined || obj[key] === "" || obj[key] === " ") {
delete obj[key];
}
// Delete empty object
// Note : typeof Array is also object
if (typeof obj[key] === 'object' && Object.keys(obj[key]).length <= 0) {
delete obj[key];
}
// If non empty object call function again
if(typeof obj[key] === 'object'){
clean_data(obj[key]);
}
}
return obj;
}
var objData = clean_data(qwerty);
console.log(objData);
var arrayData = clean_data(asdfg);
console.log(arrayData);
Вывод:
Удаляет все, что есть null, undefined, "", " ", empty object или empty array
jsfiddle здесь