Remover elementos vazios de uma matriz em JavaScript

Como faço para remover elementos vazios de um array em JavaScript?

Existe uma maneira simples, ou eu preciso passar por ele e removê-los manualmente?

   

Eu uso esse método, estendendo o protótipo nativo da matriz:

 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); 

Ou você pode simplesmente empurrar os elementos existentes para outro array:

 // Will remove all falsy values: undefined, null, 0, false, NaN and "" (empty string) 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,,,,]); 

Maneiras simples:

 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] 

ou – (apenas para itens de matriz única do tipo “texto”)

 ['','1','2',3,,'4',,undefined,,,'5'].join('').split(''); // output: ["1","2","3","4","5"] 

ou – maneira clássica: iteração simples

 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] 

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

UPDATE - apenas mais uma maneira rápida e legal (usando o 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; delete temp; // discard the variable arr // [1, 2, 3, 3, 4, 4, 5, 6] 

Remover valores vazios

 ['foo', '',,,'',,null, ' ', 3, true, [], [1], {}, undefined, ()=>{}].filter(String) // ["foo", null, " ", 3, true, [1], Object {}, undefined, ()=>{}] 

Se você precisar remover TODOS os valores vazios (“”, null, undefined e 0):

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

Para remover valores vazios e quebras de linha:

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

Exemplo:

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

Retorna:

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

ATUALIZAÇÃO (baseado no comentário de Alnitak)

Em algumas situações você pode querer manter “0” na matriz e remover qualquer outra coisa (nula, indefinida e “”), esta é uma maneira:

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

Retorna:

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

Simplesmente um forro:

 [1, false, "", undefined, 2].filter(Boolean); // [1, 2] 

ou usando underscorejs.org :

 _.filter([1, false, "", undefined, 2], Boolean); // [1, 2] // or even: _.compact([1, false, "", undefined, 2]); // [1, 2] 

Se você tiver o Javascript 1.6 ou posterior, você pode usar o Array.filter usando uma function de retorno de return true trivial, por exemplo:

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

já que o .filter salta automaticamente os elementos que faltam no array original.

A página do MDN vinculada acima também contém uma boa versão de filter de verificação de erros que pode ser usada em intérpretes de JavaScript que não suportam a versão oficial.

Observe que isso não removerá inputs null nem inputs com um valor undefined explícito, mas o OP solicitou especificamente inputs “ausentes”.

A maneira limpa de fazer isso.

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

Para remover furos, você deve usar

 arr.filter(() => true) 

Para remover os valores hole e falsy (null, undefined, 0, -0, NaN, “”, false, document.all):

 arr.filter(x => x) 

Para remover o furo, nulo e indefinido:

 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] 

ES6 simples

 ['a','b','',,,'w','b'].filter(v => v); 

Com Underscore / Lodash:

Caso de uso geral:

 _.without(array, emptyVal, otherEmptyVal); _.without([1, 2, 1, 0, 3, 1, 4], 0, 1); 

Com vazios:

 _.without(['foo', 'bar', '', 'baz', '', '', 'foobar'], ''); --> ["foo", "bar", "baz", "foobar"] 

Veja a documentação do lodash sem .

Se usar uma biblioteca é uma opção que eu sei que o underscore.js tem uma function chamada compact () http://documentcloud.github.com/underscore/ ela também tem várias outras funções úteis relacionadas a arrays e collections.

Aqui está um trecho de sua documentação:

_.compact (array)

Retorna uma cópia da matriz com todos os valores falsos removidos. Em JavaScript, false, null, 0, “”, undefined e NaN são todos falsificados.

_.compact ([0, 1, falso, 2, ”, 3]);

=> [1, 2, 3]

@Alnitak

Na verdade, o Array.filter funciona em todos os navegadores, se você adicionar algum código extra. Ver abaixo.

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

Este é o código que você precisa adicionar para o IE, mas o filtro e a functional programming valem a pena.

 //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; }; } 

Como ninguém mais mencionou isso e a maioria das pessoas tem sublinhado incluído em seu projeto, você também pode usar _.without(array, *values); .

 _.without(["text", "string", null, null, null, "text"], null) // => ["text", "string", "text"] 

Você pode achar mais fácil fazer um loop sobre seu array e construir um novo array a partir dos itens que deseja manter do array, em vez de tentar fazer o loop e splice como foi sugerido, desde a modificação do comprimento do array enquanto ele está sendo colocado em loop pode introduzir problemas.

Você poderia fazer algo assim:

 function removeFalsyElementsFromArray(someArray) { var newArray = []; for(var index = 0; index < someArray.length; index++) { if(someArray[index]) { newArray.push(someArray[index]); } } return newArray; } 

Na verdade, aqui está uma solução mais genérica:

 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] 

Você entendeu - você poderia ter outros tipos de funções de filtro. Provavelmente mais do que você precisa, mas eu estava me sentindo generoso ...;)

E sobre isso (ES6): Para remover o valor de Falsy de uma matriz.

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

Você deve usar o filtro para obter o array sem elementos vazios. Exemplo no ES6

 const array = [1, 32, 2, undefined, 3]; const newArray = array.filter(arr => arr); 

Eu estou simplesmente adicionando a minha voz ao acima chamado ” Array..filter() do ES5 chamado com um construtor global” golf-hack, mas sugiro usar Object vez de String , Boolean ou Number como sugerido acima.

Especificamente, o filter() do ES5 filter() já não triggers para elementos undefined dentro do array; Portanto, uma function que universalmente retorna true , que retorna todos os elementos hits filter() , necessariamente retornará apenas elementos não 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] 

No entanto, escrever ...(function(){return true;}) é mais longo que escrever ...(Object) ; e o valor de retorno do construtor Object será, sob qualquer circunstância , algum tipo de object. Ao contrário dos construtores de boxe primitivo sugeridos acima, nenhum valor de object possível é falsey e, portanto, em uma configuração booleana, Object é um atalho para 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] 

Ao usar a resposta mais votada acima, primeiro exemplo, eu estava recebendo caracteres individuais para comprimentos de string maiores que 1. Abaixo está a minha solução para esse problema.

 var stringObject = ["", "some string yay", "", "", "Other string yay"]; stringObject = stringObject.filter(function(n){ return n.length > 0}); 

Em vez de não retornar se indefinido, retornamos se o comprimento for maior que 0. Espero que ajude alguém de fora.

Retorna

 ["some string yay", "Other string yay"] 
 var data = [null, 1,2,3]; var r = data.filter(function(i){ return i != null; }) 

 console.log(r) 

[1,2,3]

Que tal:

 js> [1,2,,3,,3,,,0,,,4,,4,,5,,6,,,,].filter(String).join(',') 1,2,3,3,0,4,4,5,6 

Isso funciona, eu testei no AppJet (você pode copiar e colar o código em seu IDE e pressionar “reload” para ver se funciona, não precisa criar uma conta)

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

Outra maneira de fazer isso é aproveitar a propriedade length do array: compactar os itens não nulos à esquerda da matriz e reduzir o comprimento. É um algoritmo in-loco – não aloca memory, muito ruim para o coletor de lixo – e tem um comportamento muito bom / médio / pior.

Esta solução, comparada a outras aqui, é entre 2 a 50 vezes mais rápida no Chrome e 5 a 50 vezes mais rápida no Firefox, como você pode ver aqui: http://jsperf.com/remove-null-items-from-array

O código abaixo adiciona o método ‘removeNull’ não enumerável ao Array, que retorna ‘this’ para daisy-chain:

 var removeNull = function() { var nullCount = 0 ; var length = this.length ; for (var i=0, len=this.length; i 
 foo = [0, 1, 2, "", , false, 3, "four", null] foo.filter(function(e) { return e === 0 ? '0' : e }) 

retorna

 [0, 1, 2, 3, "four"] 

‘Uso incorreto’ do loop for … in (object-membro). => Somente valores verdadeiros aparecem no corpo do loop.

 // --- 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); 

Isso pode ajudá-lo: 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)); }); }; 

ES6: let newArr = arr.filter (e => e);

Filtrando inputs inválidas com uma expressão regular

 array = array.filter(/\w/); filter + regexp 

A melhor maneira de remover elementos vazios é usar Array.prototype.filter() , como já mencionado em outras respostas.

Infelizmente, Array.prototype.filter() não é suportado pelo IE <9. Se você ainda precisar dar suporte ao IE8 ou a uma versão ainda mais antiga do IE, poderá usar o seguinte polyfill para adicionar suporte a Array.prototype.filter() nesses navegadores:

 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; }; } 

Se alguém está procurando limpar toda a Matriz ou Objeto, isso pode ajudar .

 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); 

Saída:

Remove tudo o que é null , undefined , "" , " " , empty object empty array ou empty array

jsfiddle aqui

Este só removerá valores vazios e não falsey, o que eu acho que é mais desejável.

Existe uma opção para também remover valores nulos.

Esse método deve ser muito mais rápido do que usar splice.

  function cleanArray(a, removeNull) { var i, l, temp = []; l = a.length; if (removeNull) { for (i = 0; i < l; i++) { if (a[i] !== undefined && a[i] !== null) { temp.push(a[i]); } } } else { for (i = 0; i < l; i++) { if (a[i] !== undefined) { temp.push(a[i]); } } } a.length = 0; l = temp.length; for (i = 0; i < l; i++) { a[i] = temp[i]; } temp.length = 0; return a; } var myArray = [1, 2, , 3, , 3, , , 0, , null, false, , NaN, '', 4, , 4, , 5, , 6, , , , ]; cleanArray(myArray); myArray; 

Use o filtro para remover uma string vazia na matriz.

 var s = [ '1,201,karthikeyan,K201,HELPER,karthikeyan.a@limitlessmobil.com,8248606269,7/14/2017,45680,TN-KAR24,8,800,1000,200,300,Karthikeyan,11/24/2017,Karthikeyan,11/24/2017,AVAILABLE\r', '' ] var newArr = s.filter(function(entry) { return entry.trim() != ''; }) console.log(newArr);