HTMLCollection을 배열로 변환하는 가장 효율적인 방법

질문 : HTMLCollection을 배열로 변환하는 가장 효율적인 방법

---

HTMLCollection을 배열로 변환하는 더 효율적인 방법이 있습니까? 상기 컬렉션의 내용을 반복하고 각 항목을 배열로 수동으로 푸시하는 것보다 더 효율적인 방법이 있습니까?

답변

---

var arr = Array.prototype.slice.call( htmlCollection )

"네이티브"코드를 사용하여 동일한 효과를 갖습니다.

편집하다

이것은 많은 뷰를 얻으므로 (@oriol의 의견에 따라) 다음과 같은 더 간결한 표현이 사실상 동일하다는 점에 유의하십시오.

var arr = [].slice.call(htmlCollection);

그러나 @JussiR의 주석에 따르면 "verbose"형식과 달리 프로세스에서 비어 있고 사용되지 않으며 실제로 사용할 수없는 배열 인스턴스가 생성됩니다. 이것에 대해 컴파일러가하는 일은 프로그래머의 능력 밖입니다.

편집하다

ECMAScript 2015 (ES 6)부터 Array.from 도 있습니다.

var arr = Array.from(htmlCollection);

편집하다

ECMAScript 2015는 또한 기능적으로 Array.from 과 동일한 spread 연산자를 제공합니다 ( Array.from 은 두 번째 인수로 매핑 함수를 지원함).

var arr = [...htmlCollection];

위의 두 가지 모두 NodeList 작동 함을 확인했습니다.

언급 된 방법에 대한 성능 비교 : http://jsben.ch/h2IFA

출처 : https://stackoverflow.com/questions/222841/most-efficient-way-to-convert-an-htmlcollection-to-an-array