在Javascript中删除数组中的空元素
如何从JavaScript中的数组中删除空元素？
有没有一个简单的方法，或者我需要循环并手动删除它们？
我使用这个方法，扩展了本地数组的原型：
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);
或者您可以简单地将现有的元素推送到其他数组中：
// 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,,,,]);
简单的方法：
var arr = [1,2,,3,,3,null,,0,,undefined,4,,4,,5,,6,,,,]; // (filter - JS 1.6 and above) arr = arr.filter(function(n){ return n != undefined }); arr // [1, 2, 3, 3, 0, 4, 4, 5, 6] //or - (only for arrays items which are numbers is numbers' strings)** arr = arr.filter(Number) // [1, 3, 3, 4, 4, 5, 6] // ES6 style (Firefox FTW) arr.filter(n => true) // [1, 2, 3, 3, null, 0, undefined, 4, 4, 5, 6] // or if "null" values are to be removed: arr.filter(n => n)
或 – （仅适用于“文本”types的单个数组项）
['','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; delete temp; // discard the variable arr // [1, 2, 3, 3, 4, 4, 5, 6]
删除空值
['foo', '',, ' ', true, [], [1], {}, undefined].filter(String) // ["foo", " ", true, [1], Object {}, undefined]
删除错误的值
另一种删除空string""的"falsey"值的方法， 0和undefined
[1, 2,, 3,, 3,undefined,,"",false,null,0,NaN, 4," ", 4,true, 5,, 6,,,,].filter(Boolean); // [1, 2, 3, 3, 4, " ", 4, true, 5, 6]
如果您需要删除所有空值（“”，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, " "]
更新（基于Alnitak的评论）
在某些情况下，你可能想在数组中保留“0”，并删除其他任何东西（null，undefined和“”），这是一种方法：
arr.filter(function(e){ return e === 0 || e });
返回：
["hello", 0, 1, 100, " "]
只需一个衬垫：
[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]
如果你有Javascript 1.6或更高版本，你可以使用一个简单的return truecallback函数使用Array.filter ，例如：
arr = arr.filter(function() { return true; });
因为.filter自动跳过原始数组中缺less的元素。
上面链接的MDN页面还包含一个很好的错误检查版本的filter ，可以用在不支持官方版本的JavaScript解释器中。
请注意，这不会删除null条目或具有明确undefined值的条目，但是OP特别要求“丢失”条目。
干净的方式来做到这一点。
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"]
用下划线/ 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文档 。
简单的ES6
['a','b','',,,'w','b'].filter(v => v);
如果使用库是一个选项我知道underscore.js有一个函数称为compact（） http://documentcloud.github.com/underscore/它也有其他几个有用的function与数组和集合。;
以下是他们的文档摘录：
_.compact（数组）
返回删除所有falsy值的数组副本。 在JavaScript中，false，null，0，“”，undefined和NaN都是虚的。
_.compact（[0，1，false，2，''，3]）;
=> [1，2，3]
@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添加的代码，但是filter和函数式编程是值得的。
//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; }; }
由于没有人提到它，并且大多数人在他们的项目中都有下划线，所以你也可以使用_.without(array, *values); 。
_.without(["text", "string", null, null, null, "text"], null) // => ["text", "string", "text"]
你可能会发现，更容易循环你的数组，并build立一个新的数组，而不是想要从数组中保留的项目，而不是像试图build议的那样循环和拼接，因为在循环中修改数组的长度可以引入问题。
你可以做这样的事情：
function removeFalsyElementsFromArray(someArray) { var newArray = []; for(var index = 0; index < someArray.length; index++) { if(someArray[index]) { newArray.push(someArray[index]); } } return newArray; }
其实这里是一个更通用的解决scheme：
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]
你明白了 – 你可以有其他types的过滤function。 可能比你需要的多，但我感到慷慨…;）
那怎么样（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"]
var data = [null, 1,2,3]; var r = data.filter(function(i){ return i != null; })
console.log(r)
[1,2,3]
那个怎么样：
js> [1,2,,3,,3,,,0,,,4,,4,,5,,6,,,,].filter(String).join(',') 1,2,3,3,0,4,4,5,6
我只是把我的声音添加到上面的“调用ES5的Array..filter()与全局构造函数”高尔夫黑客，但我build议使用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构造函数的返回值在任何情况下都是某种对象。 与上面提到的原始装箱构造函数不同，没有可能的对象值是falsey，因此在布尔设置中， 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]
当使用上面最高票数的答案时，第一个例子，我得到的string长度大于1的单个字符。下面是我对这个问题的解决scheme。
var stringObject = ["", "some string yay", "", "", "Other string yay"]; stringObject = stringObject.filter(function(n){ return n.length > 0});
如果未定义，我们将返回，而不是不返回，如果长度大于0.希望帮助有人在那里。
返回
["some string yay", "Other string yay"]
这个工程，我testing它在AppJet （你可以复制粘贴代码在其IDE和按“重新加载”看到它的工作，不需要创build一个帐户）
/* 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] */
另一种方法是利用数组的length属性：打包数组左边的非null项，然后减less长度。 这是一个就地algorithm – 不分配内存，对垃圾收集器来说太糟糕了，它具有非常好的最佳/平均/最坏的情况行为。
与其他浏览器相比，这个解决scheme在Chrome浏览器上快了2到50倍，在Firefox上快了5到50倍，正如您在这里看到的： http : //jsperf.com/remove-null-items-from-array
下面的代码将不可枚举的'removeNull'方法添加到Array，该方法返回菊花链的“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 } ) ;
用正则expression式过滤掉无效的条目
array = array.filter(/\w/); filter + regexp
foo = [0, 1, 2, "", , false, 3, "four", null] foo.filter(function(e) { return e === 0 ? '0' : e })
回报
[0, 1, 2, 3, "four"]
（在对象成员）循环中“滥用”for …。 =>只有循环体中出现真值。
// --- 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);
这样做怎么样
// Removes all falsy values arr = arr.filter(function(val) { var x = Boolean(val); return x == true; });
这可能会帮助你： 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)); }); };
这是一个使用可变行为和ES2015胖箭头expression式的例子：
Array.prototype.clean = function() { var args = [].slice.call(arguments); return this.filter(item => args.indexOf(item) === -1); }; // Usage var arr = ["", undefined, 3, "yes", undefined, undefined, ""]; arr.clean(undefined); // ["", 3, "yes", ""]; arr.clean(undefined, ""); // [3, "yes"];
删除空元素的最好方法是使用Array.prototype.filter() ，正如其他答案中已经提到的那样。
不幸的是，IE <9不支持Array.prototype.filter() 。 如果您仍然需要支持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; }; }
如果有人正在寻找清理整个arrays或对象，这可能会有所帮助 。
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 在这里
这个只会删除空值而不是假的，我认为这是更可取的。
有一个选项也可以删除空值。
这种方法应该比使用拼接快得多。
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;
我需要做这个相同的任务，并发生在这个线程。 我结束了使用数组“连接”使用“_”分隔符创build一个string，然后做一些正则expression式：
1. replace "__" or more with just one "_", 2. replace preceding "_" with nothing "" and similarly 3. replace and ending "_" with nothing ""
…然后使用数组“拆分”来做一个清理数组：
var myArr = new Array("","","a","b","","c","","","","","","","","","e",""); var myStr = ""; myStr = myArr.join("_"); myStr = myStr.replace(new RegExp(/__*/g),"_"); myStr = myStr.replace(new RegExp(/^_/i),""); myStr = myStr.replace(new RegExp(/_$/i),""); myArr = myStr.split("_"); alert("myArr=" + myArr.join(","));
…或在1行代码中： –
var myArr = new Array("","","a","b","","c","","","","","","","","","e",""); myArr = myArr.join("_").replace(new RegExp(/__*/g),"_").replace(new RegExp(/^_/i),"").replace(new RegExp(/_$/i),"").split("_"); alert("myArr=" + myArr.join(","));
…或者扩展Array对象： –
Array.prototype.clean = function() { return this.join("_").replace(new RegExp(/__*/g),"_").replace(new RegExp(/^_/i),"").replace(new RegExp(/_$/i),"").split("_"); }; var myArr = new Array("","","a","b","","c","","","","","","","","","e",""); alert("myArr=" + myArr.clean().join(","));
尼斯…非常好我们也可以像这样replace所有的数组值
Array.prototype.ReplaceAllValues = function(OldValue,newValue) { for( var i = 0; i < this.length; i++ ) { if( this[i] == OldValue ) { this[i] = newValue; } } };
