자바스크립트에서 for 루프를 사용할 때 주의할 점

동일한 코드를 매번 다른 값으로 반복해서 실행하려는 경우 루프를 사용하는 것이 편리합니다.

우리는 for 루프를 자주 사용하고 for 루프 부서는 종종 배열을 반복합니다.

// 次佳的循环
for (var i = 0; i < myarray.length; i++) {
 // 使用myarray[i]做点什么}

이러한 코드에는 큰 문제가 없지만 루프할 때마다 다음과 같은 길이를 얻게 됩니다. 특히 myarray가 배열이 아니라 HTMLCollection 개체인 경우에는 코드를 줄이세요.

다음 코드를 다시 살펴보세요.

for (var i = 0, max = myarray.length; i < max; i++) {
 // 使用myarray[i]做点什么}

이 코드는 배열 길이를 한 번만 가져오므로 코드 품질이 향상됩니다.

단일 var 형식을 사용하면 루프에서 변수를 꺼낼 수 있습니다. 다음은 다음과 같습니다.

function looper() {
 var i = 0,
  max,
  myarray = [];
 // ...
 for (i = 0, max = myarray.length; i < max; i++) {
  // 使用myarray[i]做点什么
 }}

JavaScript에서 for 루프를 사용할 때 발생하는 문제 요약

이 문제에 대한 논의는 원래 회사 내부 이메일에서 나온 것입니다. 이 문제에 대한 논의를 방금 녹음했습니다.

일부 프로젝트 팀은 "for(x in array)"를 사용할 때 IE 브라우저에 x에 대한 예상치 못한 값이 나타나는 문제를 발견했습니다.

구체적으로 Array.prototype.indexOf 메서드가 사용자 정의된 경우(예: 특정 프로토타입 오염으로 인해) 이전 버전의 IE 브라우저가 array.indexOf 메서드를 지원하지 않기 때문일 수 있으며 개발자가 그런 브라우저는 다음과 같은 문제를 가질 수 있습니다:

Array.prototype.indexOf = function(){...};
var arr = [1, 2];for (x in arr) console.log(x);

//will 출력

1
2function(){…}

즉, indexOf 메소드가 출력됩니다.

해결책은 매우 간단합니다. 이 메서드를 추가하지 않거나 "for (i=0; i < array.length; i++)" 등과 같은 루프를 사용하는 것입니다.

그런데 문제의 본질은 무엇입니까? 어떤 사람들은 for(x in obj)의 사용법이 실제로 객체를 순회하기 때문일 것이라고 추측하며, 배열의 구현은 key가 단지 확립된 것이라는 점을 제외하면 실제로 일반 객체의 구현과 동일합니다. value:

{0:"something", 1:"something else"}

배열을 순회할 때 for...in과 for(;;)를 사용하는 것에는 차이가 있다는 것이 stackoverflow 질문과 답변에서도 언급되었습니다. 전자는 객체의 속성을 열거하는 것을 의미합니다.

열거 순서는 보장할 수 없습니다.

상속 속성도 열거됩니다.

Array.prototype.forEach에 대한 지원 측면에서도 IE8과 아래는 정확하게 지원되지 않습니다.

여기에는 forEach 메서드의 호환성에 대한 자세한 설명도 나와 있습니다. 실제로 주요 JavaScript 프레임워크(예: jQuery, Underscore, Prototype 등)에는 모두 for-each 기능에 대한 안전하고 일반적인 구현이 있습니다.

JSLint의 for in 장에서도 for in 문이 객체의 속성 이름을 통한 루프를 허용하지만 프로토타입 체인을 통해 상속된 속성을 순회하므로 많은 경우 예상치 못한 오류가 발생한다고 언급되어 있습니다. 조잡한 해결책이 있습니다:

for (name in object)
 { if (object.hasOwnProperty(name))
 { .... } }

일부 사람들은 JavaScript에 코드 블록 수준 변수가 없기 때문에 이 루프와 유사한 for(var i=0;i를 사용하는 문제를 언급했습니다. i의 액세스 권한은 실제로 그것이 위치한 방법입니다. 일부 책에서는 프로그래머에게 이러한 변수 선언을 한 곳에 두라고 조언하지만 직관적으로 말하면 대부분의 경우 충분히 합리적이지 않습니다.

JavaScript 1.7에 도입된 "let"을 사용하면 이 문제를 해결할 수 있으며, 이를 실제 코드 블록 수준 변수로 만들 수 있습니다.

for(let i =0; i < a.length; i++)

마지막으로 이 제약 조건은 Google의 JavaScript 스타일 가이드에도 포함됩니다.

for-in loop：
Only for iterating over keys in an object/map/hash

위 내용은 전체 내용입니다. JavaScript에서 for 루프를 사용할 때 주의해야 할 문제에 대한 이 기사는 문제 요약과 함께 향후 작업과 연구에 도움이 되기를 바랍니다. 업계 내부자의 비판과 제안을 환영합니다.

위 내용은 자바스크립트에서 for 루프를 사용할 때 주의할 점의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!