Javascript의 배열에서 빈 요소 제거

질문자 :Tamas Czinege

JavaScript의 배열에서 빈 요소를 어떻게 제거합니까?

간단한 방법이 있습니까, 아니면 반복하여 수동으로 제거해야합니까?

간단한 방법:

 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, ()=>{}]

Community Wiki

편집: Array.prototype 에 유용한 내장 메서드가 많지 않았을 때 거의 9년 전에 답변되었습니다.

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

예를 들어 문자열을 처리하는 경우 위의 함수는 빈 문자열인 요소를 제거하지 않습니다.

내가 자주 사용하는 한 가지 일반적인 패턴은 빈 문자열 "" , 0 , NaN , null , undefined 및 false 를 포함하는 falsy 인 요소를 제거하는 것입니다.

filter 메서드, Boolean 생성자 함수에 전달하거나 필터 기준 함수에서 동일한 요소를 반환할 수 있습니다. 예를 들면 다음과 같습니다.

 var filtered = array.filter(Boolean);

또는

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

두 가지 방법 모두 첫 번째 경우 filter Boolean 생성자를 함수로 호출하여 값을 변환하고 두 번째 경우의 filter 메서드가 내부적으로 콜백의 반환 값을 암시적으로 Boolean 합니다.

희소 배열로 작업하고 "구멍"을 제거하려는 경우 true를 반환하는 콜백을 전달하는 filter

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

오래된 답변: 이러지 마세요!

이 방법을 사용하여 기본 Array 프로토타입을 확장합니다.

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

Christian C. Salvadó

모든 빈 값("", 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, " "]

lepe

단순히 하나의 라이너:

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

andlrc

Javascript 1.6 이상이 있는 경우 return true 콜백 함수를 사용하여 Array.filter

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

.filter 는 원래 배열에서 누락된 요소를 자동으로 건너뛰기 때문입니다.

위에 링크된 MDN 페이지에는 공식 버전을 지원하지 않는 JavaScript 인터프리터에서 사용할 수 있는 filter 의 멋진 오류 검사 버전도 포함되어 있습니다.

null 항목이나 명시적으로 undefined 값이 있는 항목을 제거하지 않지만 OP는 특별히 "누락된" 항목을 요청했습니다.

Alnitak

구멍을 제거하려면 다음을 사용해야 합니다.

 arr.filter(() => true) arr.flat(0) // New in ES2019

구멍, null 및 undefined 제거:

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

구멍 제거 및 거짓(null, undefined, 0, -0, 0n, NaN, "", false, document.all) 값:

 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] is a hole arr[42] = 42; console.log(arr[10], 10 in arr, arr.length); // undefined, false, 43; arr[10] is a hole arr1 = [1, 2, 3]; arr1[0] = (void 0); console.log(arr1[0], 0 in arr1); // undefined, true; a[0] is undefined, not a hole arr2 = [1, 2, 3]; delete arr2[0]; // NEVER do this please console.log(arr2[0], 0 in arr2, arr2.length); // undefined, false; a[0] is a hole

• 위의 모든 메서드는 제자리에서 수정하지 않고 주어진 배열의 복사본을 반환합니다.

 arr = [1, 3, null, 4]; filtered = arr.filter(x => x != null); console.log(filtered); // [1, 3, 4] console.log(arr); // [1, 3, null, 4]; not modified

tsh

그것을하는 깨끗한 방법.

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

Tomás Senart

ES6:

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

Kanan Farzali

간단한 ES6

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

ML13

ES6+ 방법을 사용할 수 있습니다. 배열이 다음과 같다고 가정합니다.

 const arr = [1,2,3,undefined,4,5,6,undefined,7,8,undefined,undefined,0,9];

그리고 대답은 다음 두 가지 방법 중 하나일 수 있습니다.

• 첫 번째 방법:

   const clearArray = arr.filter(i => i);

• 두 번째 방법:

   const clearArray = arr.filter(Boolean);

AmerllicA

밑줄/로다쉬 사용:

일반적인 사용 사례:

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

비어 있는 경우:

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

없이 lodash 문서를 참조하십시오.

c4urself

라이브러리를 사용하는 것이 옵션인 경우 underscore.js에는 compact() http://documentcloud.github.com/underscore/ 라는 함수가 있다는 것을 알고 있습니다. 또한 배열 및 컬렉션과 관련된 몇 가지 다른 유용한 함수도 있습니다.

다음은 해당 문서에서 발췌한 내용입니다.

_.컴팩트(배열)

모든 거짓 값이 제거된 배열의 복사본을 반환합니다. JavaScript에서 false, null, 0, "", undefined 및 NaN은 모두 거짓입니다.

_.compact([0, 1, 거짓, 2, '', 3]);

=> [1, 2, 3]

Luis Perez

@알니탁

실제로 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에 추가해야 하는 코드이지만 필터 및 함수형 프로그래밍은 가치가 있습니다.

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

Community Wiki

아무도 언급하지 않았고 대부분의 사람들이 프로젝트에 밑줄을 포함했기 때문에 _.without(array, *values); .

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

Josh Bedo

반복되는 동안 배열의 길이를 수정하기 때문에 제안된 대로 반복하고 연결하는 것보다 배열을 반복하고 배열에서 유지하려는 항목으로 새 배열을 만드는 것이 더 쉽다는 것을 알 수 있습니다. 문제를 일으킬 수 있습니다.

다음과 같이 할 수 있습니다.

 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]

당신은 아이디어를 얻었습니다. 그러면 다른 유형의 필터 기능을 가질 수 있습니다. 아마도 당신이 필요로하는 것보다 더 많을 것입니다. 그러나 나는 관대 한 느낌이었습니다. ;)

Jason Bunting

What about this(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"]

VIJAY P

빈 요소가 없는 배열을 얻으려면 필터를 사용해야 합니다. ES6의 예

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

Gapur Kassym

위의 가장 많이 투표된 답변을 사용할 때 첫 번째 예에서는 1보다 큰 문자열 길이에 대해 개별 문자를 얻었습니다. 아래는 해당 문제에 대한 제 솔루션입니다.

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

정의되지 않은 경우 반환하지 않고 길이가 0보다 큰 경우 반환합니다. 누군가에게 도움이 되기를 바랍니다.

보고

 ["some string yay", "Other string yay"]

John Miller

위의 "전역 생성자를 사용하여 Array..filter() 호출" 골프 해킹에 내 목소리를 추가하는 것뿐이지만 위에서 제안한 대로 String , Boolean 또는 Number 대신 Object

특히, ES5의 filter() 이미 배열 내의 undefined 요소에 대해 트리거하지 않습니다. 따라서 모든 요소 filter() 적중을 반환하는 true 를 보편적으로 반환하는 함수는 반드시 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 생성자의 반환 값은 어떤 상황에서도 일종의 객체가 될 것입니다. 위에서 제안한 primitive-boxing-constructors와 달리 가능한 object-value는 false가 아니므로 부울 설정에서 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]

ELLIOTTCABLE

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

---

 console.log(r)

[1,2,3]

KARTHIKEYAN.A

모든 빈 요소 제거

배열에 다른 빈 요소와 함께 빈 개체, 배열 및 문자열이 포함되어 있으면 다음을 사용하여 제거할 수 있습니다.

 const arr = [ [], ['not', 'empty'], {}, { key: 'value' }, 0, 1, null, 2, "", "here", " ", 3, undefined, 3, , , , , , 4, , 4, , 5, , 6, , , ] let filtered = JSON.stringify( arr.filter((obj) => { return ![null, undefined, ''].includes(obj) }).filter((el) => { return typeof el != "object" || Object.keys(el).length > 0 }) ) console.log(JSON.parse(filtered))

단순 압축(배열에서 빈 요소 제거)

ES6 사용 시:

 const arr = [0, 1, null, 2, "", 3, undefined, 3, , , , , , 4, , 4, , 5, , 6, , , ,] let filtered = arr.filter((obj) => { return ![null, undefined].includes(obj) }) console.log(filtered)

일반 자바스크립트 사용 ->

 var arr = [0, 1, null, 2, "", 3, undefined, 3, , , , , , 4, , 4, , 5, , 6, , , ,] var filtered = arr.filter(function (obj) { return ![null, undefined].includes(obj) }) console.log(filtered)

Zalom

in 연산자와 함께 필터를 사용할 수 있습니다.

 let a = [1,,2,,,3]; let b = a.filter((x,i)=> i in a); console.log({a,b});

Kamil Kiełczewski

그건 어떻습니까?

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

JessyNinja

이를 수행하는 또 다른 방법은 배열의 length 속성을 활용하는 것입니다. null이 아닌 항목을 배열의 '왼쪽'에 묶은 다음 길이를 줄입니다. 메모리를 할당하지 않고 가비지 수집기에는 너무 나쁜 내부 알고리즘이며 최상의/평균/최악의 경우 동작이 매우 좋습니다.

이 솔루션은 다른 솔루션과 비교하여 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 } ) ;

GameAlchemist

이것은 작동합니다. 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] */

Joe Pineda

foo = [0, 1, 2, "", , false, 3, "four", null] foo.filter(function(e) { return e === 0 ? '0' : e })

보고

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

sqram

for ... in (객체-멤버) 루프를 '오용'합니다. => 루프의 본문에는 진실한 값만 나타납니다.

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

michael.zech

이것은 당신을 도울 수 있습니다 : 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)); }); };

Sandeep M

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에서 일하고있다

배열에서 빈 요소를 제거하고 다른 요소를 표시합니다.

Jitendra virani

array.filter(String); 사용하여 모든 빈 요소를 배열에서 제거할 수 있습니다. 자바 스크립트에서 배열의 비어 있지 않은 모든 요소를 반환합니다.

Bhupesh Kumar

출처 : http:www.stackoverflow.com/questions/281264/remove-empty-elements-from-an-array-in-javascript