[javascript] JavaScript NodeList를 Array로 변환하는 가장 빠른 방법은 무엇입니까?
이전에 답변 된 질문에 따르면 이것이 가장 빠른 방법이라고합니다.
//nl is a NodeList
var arr = Array.prototype.slice.call(nl);
내 브라우저에서 벤치마킹 할 때 이보다 3 배 이상 느립니다.
var arr = [];
for(var i = 0, n; n = nl[i]; ++i) arr.push(n);
둘 다 동일한 출력을 생성하지만 특히 사람들이 다르게 말했기 때문에 두 번째 버전이 가장 빠른 방법이라고 믿기가 어렵습니다.
내 브라우저 (Chromium 6)의 기발한가요? 아니면 더 빠른 방법이 있습니까?
편집 : 관심있는 사람은 다음을 결정했습니다 (테스트 한 모든 브라우저에서 가장 빠른 것 같습니다).
//nl is a NodeList
var l = []; // Will hold the array of Node's
for(var i = 0, ll = nl.length; i != ll; l.push(nl[i++]));
EDIT2 : 더 빠른 방법을 찾았습니다
// nl is the nodelist
var arr = [];
for(var i = nl.length; i--; arr.unshift(nl[i]));
답변
두 번째 브라우저는 일부 브라우저에서 더 빠르지 만 주요 요점은 첫 번째 브라우저가 브라우저 간이 아니기 때문에 사용해야한다는 것입니다. 비록 그들이 타임즈 임에도 불구하고
@kangax ( IE 9 미리보기 )
Array.prototype.slice 는 이제 특정 호스트 객체 (예 : NodeList)를 배열로 변환 할 수 있습니다. 이는 대부분의 최신 브라우저에서 꽤 오랫동안 할 수 있었던 것입니다.
예:
Array.prototype.slice.call(document.childNodes);
답변
ES6을 사용하면 NodeList에서 Array.from()
함수 를 만드는 간단한 방법이 생겼습니다 .
// nl is a NodeList
let myArray = Array.from(nl)
답변
다음은 ES6 스프레드 연산자를 사용하여 새롭고 멋진 방법입니다 .
let arr = [...nl];
답변
일부 최적화 :
- NodeList의 길이를 변수에 저장
- 설정하기 전에 새 배열의 길이를 명시 적으로 설정하십시오.
- 밀거나 움직이지 않고 인덱스에 액세스하십시오.
코드 ( jsPerf ) :
var arr = [];
for (var i = 0, ref = arr.length = nl.length; i < ref; i++) {
arr[i] = nl[i];
}
답변
결과는 브라우저에 전적으로 의존하고 객관적인 평결을 내기 위해 성능 테스트를해야합니다. 여기에 몇 가지 결과가 있습니다. 여기에서 실행할 수 있습니다 .
크롬 6 :
Firefox 3.6 :
Firefox 4.0b2 :
사파리 5 :
IE9 플랫폼 미리보기 3 :
답변
가장 빠르고 교차 브라우저는
for(var i=-1,l=nl.length;++i!==l;arr[i]=nl[i]);
내가 비교할 때
http://jsbin.com/oqeda/98/edit
* 아이디어에 대한 @CMS 감사합니다!
답변
ES6에서는 다음 중 하나를 사용할 수 있습니다.
-
배열
let array = Array.from(nodelist)
-
스프레드 연산자
let array = [...nodelist]