for loop_javascript 팁에 길이 값을 캐시해야 합니까?

for 루프에서 길이 값을 캐시해야 하는지 여부에 대해 많은 프로그래머가 이 문제로 어려움을 겪고 있다고 생각합니다. 이 문제에 대한 분석은 아래를 참조하세요.

JS 성능 최적화에는 공통적인 작은 최적화가 있는데, 바로

// 不缓存 
for (var i = 0; i < arr.length; i++) {
　　...
}

// 缓存
var len = arr.length;
for (var i = 0; i < len; i++) {
　　...
}

그렇다면 이런 글쓰기 방식을 버려야 할까요? 아니, 이런 글쓰기 방식을 사용해야 하는 상황이 또 있습니다.

예를 참조하세요:

코드 복사 코드는 다음과 같습니다.

var divs = document.getElementsByTagName("div"), i, div ;
for( i=0; i div = document.createElement("div");
​ document.body.appendChild("div");
}

위 코드는 무한 루프를 발생시킵니다. 코드의 첫 번째 줄은 모든 div 요소의 노드 목록을 가져옵니다. 노드 목록은 동적이므로 페이지에 새 div가 추가되는 한 다음 for 루프가 업데이트됩니다. .length가 다시 평가되므로 i와 divs.length는 매번 동시에 증가하므로 해당 값은 결코 동일하지 않아 무한 루프가 생성됩니다.

따라서 nodelist를 반복하려면 length 속성을 사용하여 두 번째 변수를 초기화한 다음 iterator를 변수와 비교하는 것이 가장 좋습니다.

코드 복사 코드는 다음과 같습니다.

var divs = document.getElementsByTagName("div"), i, div ,len ;
for(i=0;len=divs.length;i div = document.createElement("div");
​document.body.appendChild("div");
}

이 예제에서는 len이 초기화됩니다. len은 루프 시작 부분에 divs.length의 스냅샷을 저장하므로 이전 예제에서 발생한 무한 루프 문제를 피할 수 있습니다. 따라서 루프 반복이 필요한 경우. nodelist, 이 방법을 사용하는 것이 더 안전합니다.

요약:
1. 길이 값을 캐싱하는 것이 성능 최적화에 도움이 되는지 여부는 특정 상황에 따라 판단해야 할 문제입니다. 일반적으로 DOM에 대한 액세스를 줄이는 것이 여전히 유리합니다. 2. nodelist를 조작해야 할 경우 무한 루프를 피하기 위해 길이 값을 캐시하는 것이 좋습니다.

위 내용은 for 루프에서 길이 값을 캐시해야 하는지에 대한 전체 소개입니다.