JavaScript에서 배열을 어떻게 비우나요?

질문자 :akano1

이 질문의 답변은 커뮤니티의 노력 입니다. 이 게시물을 개선하려면 기존 답변을 수정하세요. 현재 새로운 답변이나 상호 작용을 허용하지 않습니다.

배열을 비울 수있는 방법이 있습니까? .remove()

예를 들어,

 A = [1,2,3,4];

어떻게 비울 수 있습니까?

A 를 지우는 방법:

방법 1

(이것은 질문에 대한 나의 원래 답변이었습니다)

 A = [];

이 코드는 변수 A 를 새로운 빈 배열로 설정합니다. 이것은 실제로 완전히 새로운(빈) 배열을 생성하기 때문에 다른 곳 에서 원래 배열 A 대한 참조가 없는 경우에 완벽합니다. 다른 변수나 속성에서 이 배열을 참조한 경우 원래 배열이 변경되지 않은 상태로 유지되므로 이 방법에 주의해야 합니다. A 배열을 참조하는 경우에만 이것을 사용하십시오.

이것은 또한 가장 빠른 솔루션입니다.

이 코드 샘플은 이 방법을 사용할 때 발생할 수 있는 문제를 보여줍니다.

 var arr1 = ['a','b','c','d','e','f']; var arr2 = arr1; // Reference arr1 by another variable arr1 = []; console.log(arr2); // Output ['a','b','c','d','e','f']

방법 2 ( Matthew Crumley 제안 )

 A.length = 0

이렇게 하면 길이를 0으로 설정하여 기존 배열이 지워집니다. 일부에서는 이것이 JavaScript의 모든 구현에서 작동하지 않을 수 있다고 주장했지만 그렇지 않은 것으로 나타났습니다. 배열의 길이 속성이 읽기/쓰기 속성이기 때문에 ECMAScript 5에서 "엄격한 모드"를 사용할 때도 작동합니다.

방법 3 ( Anthony 제안 )

 A.splice(0,A.length)

.splice() 사용하면 완벽하게 작동하지만 .splice() 함수는 제거된 모든 항목이 포함된 배열을 반환하므로 실제로는 원래 배열의 복사본을 반환합니다. 벤치마크는 이것이 성능에 어떠한 영향도 미치지 않는다고 제안합니다.

방법 4 ( tanguy_k 에서 제안한 대로)

 while(A.length > 0) { A.pop(); }

이 솔루션은 매우 간결하지 않으며 원래 답변에서 참조한 이전 벤치마크와 달리 가장 느린 솔루션이기도 합니다.

성능

기존 어레이 를 지우는 모든 방법 중에서 방법 2와 3은 성능면에서 매우 유사하며 방법 4보다 훨씬 빠릅니다. 이 벤치마크를 참조하십시오.

아래 답변 에서 Diadistis 가 지적했듯이 위에 설명된 네 가지 방법의 성능을 결정하는 데 사용된 원래 벤치마크에는 결함이 있습니다. 원래 벤치마크는 지워진 배열을 재사용하므로 두 번째 반복은 이미 비어 있는 배열을 지우는 것이었습니다.

다음 벤치마크는 이 결함을 수정합니다: http://jsben.ch/#/hyj65 . 방법 #2(길이 속성)와 #3(접합)이 가장 빠르다는 것을 분명히 보여줍니다(원래 배열을 변경하지 않는 방법 #1은 계산하지 않음).

---

이는 뜨거운 화제가 되었고 많은 논란의 원인이 되었습니다. 실제로 많은 정답이 있으며 이 답변은 매우 오랫동안 승인된 답변으로 표시되었기 때문에 여기에 모든 방법을 포함하겠습니다. 이 답변에 투표하는 경우 내가 참조한 다른 답변도 찬성하십시오.

Philippe Leybaert

업데이트해야 하는 다른 참조가 있기 때문에 원래 배열을 유지해야 하는 경우 길이를 0으로 설정하여 새 배열을 만들지 않고 지울 수 있습니다.

 A.length = 0;

Matthew Crumley

동일한 배열 ("변경 가능")을 유지하면서 가장 빠르게 작동하는 구현은 다음과 같습니다.

 function clearArray(array) { while (array.length) { array.pop(); } }

while (array.pop()) 으로 단순화할 수 없습니다. 테스트가 실패합니다.

참고로 Map 과 Set 은 clear() 정의하므로 Array clear() 가 있는 것이 논리적으로 보일 것입니다.

타입스크립트 버전:

 function clearArray<T>(array: T[]) { while (array.length) { array.pop(); } }

해당 테스트:

 describe('clearArray()', () => { test('clear regular array', () => { const array = [1, 2, 3, 4, 5]; clearArray(array); expect(array.length).toEqual(0); expect(array[0]).toEqual(undefined); expect(array[4]).toEqual(undefined); }); test('clear array that contains undefined and null', () => { const array = [1, undefined, 3, null, 5]; clearArray(array); expect(array.length).toEqual(0); expect(array[0]).toEqual(undefined); expect(array[4]).toEqual(undefined); }); });

업데이트된 jsPerf: http://jsperf.com/array-destroy/32 http://jsperf.com/array-destroy/152

jsPerf 오프라인. 유사한 벤치마크: https://jsben.ch/hyj65

tanguy_k

브라우저에 더 친숙하고 최적의 솔루션은 splice 방법을 사용하여 아래와 같이 배열 A의 내용을 비우는 것입니다.

A.splice(0, A.length);

Anthony

지금까지 2739개의 찬성표가 있는 답변은 오해의 소지가 있고 잘못된 것입니다.

질문은 "기존 어레이를 어떻게 비우나요?"입니다. 예를 들어 A = [1,2,3,4] 입니다.

1. A = [] 가 답이다"라고 말하는 것은 무지하고 절대적으로 옳지 않습니다. [] == [] 는 거짓 입니다.

   이는 이 두 배열이 고유한 두 개의 ID를 가진 두 개의 개별 개체이기 때문에 디지털 세계에서 각각 고유한 공간을 차지하기 때문입니다.

---

어머니가 쓰레기통을 비우라고 하신다고 가정해 봅시다.

• 당신은 당신이 요청한 것을 한 것처럼 새로운 것을 가져오지 않습니다.
• 대신 쓰레기통을 비우십시오.
• 채워진 캔을 새 빈 캔으로 바꾸지 않고 채워진 캔에서 레이블 "A"를 가져 와서 A = [1,2,3,4]; A = [];

배열 객체를 비우는 것은 가장 쉬운 일입니다:

 A.length = 0;

이렇게하면 "A"아래의 캔이 비어있을뿐만 아니라 새 것까지 깨끗합니다!

---

2. 또한 캔이 비워질 때까지 손으로 쓰레기를 버릴 필요가 없습니다! 다음과 같이 깡통이 비워질 때까지 쓰레기를 줍지 않도록 기존의 것을 한 번에 완전히 비우라는 요청을 받았습니다.

    while(A.length > 0) { A.pop(); }

3. 또한 왼손을 휴지통 아래에 놓고 오른손을 위로 잡고 다음과 같이 내용물을 꺼낼 수 있습니다.

    A.splice(0, A.length);

아니요, 비우도록 요청받았습니다.

 A.length = 0;

이것은 주어진 JavaScript 배열의 내용을 올바르게 비우는 유일한 코드입니다.

Bekim Bacaj

성능 테스트:

http://jsperf.com/array-clear-methods/3

 a = []; // 37% slower a.length = 0; // 89% slower a.splice(0, a.length) // 97% slower while (a.length > 0) { a.pop(); } // Fastest

kenshou.html

배열을 "지울" 수 있도록 JavaScript 파일에 다음을 추가할 수 있습니다.

 Array.prototype.clear = function() { this.splice(0, this.length); };

그런 다음 다음과 같이 사용할 수 있습니다.

 var list = [1, 2, 3]; list.clear();

또는 무언가를 파괴하지 않도록 하려면:

 if (!Array.prototype.clear) { Array.prototype.clear = function() { this.splice(0, this.length); }; }

많은 사람들이 Array와 같은 기본 개체를 수정하면 안 된다고 생각하고 저도 동의합니다. 이 문제를 처리하는 방법을 결정할 때 주의하십시오.

leech

이를 수행하는 함수를 쉽게 생성 하거나 길이를 변경하거나 재사용을 위해 remove() 함수로 기본 배열에 추가할 수도 있습니다.

다음과 같은 배열이 있다고 상상해 보십시오.

 var arr = [1, 2, 3, 4, 5]; //the array

좋아요, 그냥 다음을 실행하세요:

 arr.length = 0; //change the length

결과는 다음과 같습니다.

 [] //result

배열을 비우는 쉬운 방법...

또한 필요하지 않지만 그렇게 하는 또 다른 방법인 루프를 사용합니다.

 /* could be arr.pop() or arr.splice(0) don't need to return as main array get changed */ function remove(arr) { while(arr.length) { arr.shift(); } }

다음과 같이 생각할 수 있는 까다로운 방법도 있습니다.

 arr.splice(0, arr.length); //[]

따라서 arr에 5개의 항목이 있는 경우 0에서 5개의 항목을 연결하므로 배열에 아무것도 남아 있지 않습니다.

예를 들어 단순히 배열을 다시 할당하는 것과 같은 다른 방법도 있습니다.

 arr = []; //[]

Array 함수를 보면 이 외에도 여러 가지 방법이 있지만 가장 추천하는 방법은 길이를 변경하는 것입니다.

처음에 말했듯이 remove()는 귀하의 질문에 대한 답변이므로 프로토타입을 만들 수도 있습니다. 위의 방법 중 하나를 선택하고 다음과 같이 JavaScript에서 Array 객체로 프로토타입을 만들 수 있습니다.

 Array.prototype.remove = Array.prototype.remove || function() { this.splice(0, this.length); };

자바스크립트 애플리케이션에서 배열을 비우려면 다음과 같이 간단히 호출할 수 있습니다.

 arr.remove(); //[]

Alireza

답변과 댓글 모두에서 while;pop/shift 성능과 관련하여 많은 혼란과 잘못된 정보가 있습니다. while/pop 솔루션은 (예상대로) 최악의 성능을 보입니다 . 실제로 발생하는 것은 설정이 루프에서 스니펫을 실행하는 각 샘플에 대해 한 번만 실행된다는 것입니다. 예:

 var arr = []; for (var i = 0; i < 100; i++) { arr.push(Math.random()); } for (var j = 0; j < 1000; j++) { while (arr.length > 0) { arr.pop(); // this executes 100 times, not 100000 } }

올바르게 작동하는 새 테스트를 만들었습니다.

http://jsperf.com/empty-javascript-array-redux

경고: 이 테스트 버전에서도 어레이 복제가 테스트 시간의 대부분을 차지하기 때문에 실제 차이를 실제로 볼 수 없습니다. splice 가 어레이를 지우는 가장 빠른 방법임을 보여줍니다(가장 빠른 동안 실제로 기존 어레이를 지우지 않기 때문에 []

Diadistis

Array.prototype.clear = function() { this.length = 0; };

그리고 그것을 호출하십시오: array.clear();

Bendegúz

메모리 할당에 관심이 있는 경우 chrome dev 도구의 타임라인 탭과 함께 이 jsfiddle 과 같은 것을 사용하여 각 접근 방식을 비교할 수 있습니다. 어레이를 '삭제'한 후 가비지 컬렉션을 강제 실행하려면 맨 아래에 있는 휴지통 아이콘을 사용하고 싶을 것입니다. 이렇게 하면 선택한 브라우저에 대해 보다 명확한 답변을 얻을 수 있습니다. 여기에 있는 많은 답변이 오래되었고 이에 의존하지 않고 위의 @tanguy_k의 답변에서와 같이 테스트합니다.

(앞서 언급한 탭에 대한 소개는 여기에서 확인할 수 있습니다)

Stackoverflow는 jsfiddle을 복사하도록 강제하므로 다음과 같습니다.

 <html> <script> var size = 1000*100 window.onload = function() { document.getElementById("quantifier").value = size } function scaffold() { console.log("processing Scaffold..."); a = new Array } function start() { size = document.getElementById("quantifier").value console.log("Starting... quantifier is " + size); console.log("starting test") for (i=0; i<size; i++){ a[i]="something" } console.log("done...") } function tearDown() { console.log("processing teardown"); a.length=0 } </script> <body> <span style="color:green;">Quantifier:</span> <input id="quantifier" style="color:green;" type="text"></input> <button onclick="scaffold()">Scaffold</button> <button onclick="start()">Start</button> <button onclick="tearDown()">Clean</button> <br/> </body> </html>

그리고 자바스크립트는 객체의 배열은 물론이고 다른 기본 유형과 다르게 문자열을 관리하기 때문에 배열 요소의 유형에 따라 달라질 수 있다는 점에 유의해야 합니다. 유형은 발생하는 일에 영향을 미칠 수 있습니다.

matanster

사용하는 경우

 a = [];

그런 다음 새 배열 참조를 할당합니다. a의 참조가 이미 다른 변수에 할당된 경우 해당 배열도 비워지지 않으므로 가비지 수집기가 해당 메모리를 수집하지 않습니다.

예를 들어

 var a=[1,2,3]; var b=a; a=[]; console.log(b);// It will print [1,2,3];

또는

 a.length = 0;

a.length 를 지정할 때 배열의 경계를 재설정하고 나머지 배열 요소에 대한 메모리는 가비지 수집기에 의해 연결됩니다.

이 두 가지 솔루션 대신에 더 좋습니다.

 a.splice(0,a.length)

그리고

 while(a.length > 0) { a.pop(); }

kenshou.html의 이전 답변에 따르면 두 번째 방법이 더 빠릅니다.

Laxmikant Dange

A.splice(0);

방금 작업 중인 일부 코드에서 이 작업을 수행했습니다. 어레이를 지웠습니다.

David Campbell

Jan 의 초기 제안의 수정된 버전을 사용하십시오.

 var originalLength = A.length; for (var i = originalLength; i > 0; i--) { A.pop(); }

터서:

 for (let i = A.length; i > 0;A.pop(),i--) {}

또는 여기 또 다른 방법이 있습니다.

 while(!A[Symbol.iterator]().next().done)A.shift()

cssimsek

상수를 사용하면 선택의 여지가 없습니다.

 const numbers = [1, 2, 3]

다음과 같이 재계약할 수 없습니다.

 numbers = []

다음만 자를 수 있습니다.

 numbers.length = 0

Damjan Pavlica

배열의 현재 메모리 위치를 비우려면 'myArray.length = 0' 또는 'myArray.pop() UN-till its length is 0'

• length : 언제든지 배열을 자르도록 length 속성을 설정할 수 있습니다. 배열의 length 속성을 변경하여 배열을 확장하면 실제 요소의 수가 증가합니다.
• pop() : pop 메서드는 배열에서 마지막 요소를 제거하고 제거된 값을 반환하는 반환합니다.
• shift() : shift 메서드는 0 번째 인덱스 의 요소를 제거하고 연속된 인덱스의 값을 아래로 이동한 다음 제거된 값을 반환합니다.

예시:

 var arr = ['77']; arr.length = 20; console.log("Increasing : ", arr); // (20) ["77", empty × 19] arr.length = 12; console.log("Truncating : ", arr); // (12) ["77", empty × 11] var mainArr = new Array(); mainArr = ['1', '2', '3', '4']; var refArr = mainArr; console.log('Current', mainArr, 'Refered', refArr); refArr.length = 3; console.log('Length: ~ Current', mainArr, 'Refered', refArr); mainArr.push('0'); console.log('Push to the End of Current Array Memory Location \n~ Current', mainArr, 'Refered', refArr); mainArr.poptill_length(0); console.log('Empty Array \n~ Current', mainArr, 'Refered', refArr); Array.prototype.poptill_length = function (e) { while (this.length) { if( this.length == e ) break; console.log('removed last element:', this.pop()); } };

---

• new Array() | [] Array constructor 또는 array literal 을 사용하여 새 메모리 위치로 Array를 만듭니다.

   mainArr = []; // a new empty array is addressed to mainArr. var arr = new Array('10'); // Array constructor arr.unshift('1'); // add to the front arr.push('15'); // add to the end console.log("After Adding : ", arr); // ["1", "10", "15"] arr.pop(); // remove from the end arr.shift(); // remove from the front console.log("After Removing : ", arr); // ["10"] var arrLit = ['14', '17']; console.log("array literal « ", indexedItem( arrLit ) ); // {0,14}{1,17} function indexedItem( arr ) { var indexedStr = ""; arr.forEach(function(item, index, array) { indexedStr += "{"+index+","+item+"}"; console.log(item, index); }); return indexedStr; }

• slice() : slice 함수를 사용하여 새로운 메모리 주소와 함께 원본 배열에서 요소의 얕은 복사본을 얻습니다. 따라서 cloneArr에 대한 수정 사항은 실제|원래 배열에 영향을 미치지 않습니다.

   var shallowCopy = mainArr.slice(); // this is how to make a copy var cloneArr = mainArr.slice(0, 3); console.log('Main', mainArr, '\tCloned', cloneArr); cloneArr.length = 0; // Clears current memory location of an array. console.log('Main', mainArr, '\tCloned', cloneArr);

Yash

아직 아무도 이것을 제안하지 않았다는 사실에 놀랐습니다.

 let xs = [1,2,3,4]; for (let i in xs) delete xs[i];

이것은 다른 솔루션과 상당히 다른 상태의 어레이를 생성합니다. 어떤 의미에서 배열은 '비워졌습니다':

 xs => Array [ <4 empty slots> ] [...xs] => Array [ undefined, undefined, undefined, undefined ] xs.length => 4 xs[0] => ReferenceError: reference to undefined property xs[0]

[,,,,] 또는 Array(4) 사용하여 동등한 배열을 생성할 수 있습니다.

Cauterite

Angular 2+ FormArray를 비워야 하는 경우 아래를 사용하십시오.

 public emptyFormArray(formArray:FormArray) { for (let i = formArray.controls.length - 1; i >= 0; i--) { formArray.removeAt(i); } }

Manish Jain

출처 : http:www.stackoverflow.com/questions/1232040/how-do-i-empty-an-array-in-javascript