javascript에서 for와 for in의 차이점과 for in이 권장되지 않는 이유

js

var array=['a']
//标准的
for循环
for(var i=1;i<array.length;i++){
    alert(array[i])
}
//
foreach
循环
for(var i in array){
    alert(array[i])
}

에서 배열

을 순회하는 방법에는 두 가지가 있습니다. 일반적으로 위의 두 가지 배열 순회 방법의 결과는 동일합니다. 둘 사이의 첫 번째 차이점에 대해 이야기해 보겠습니다

표준 for 루프의 i는 배열의 첨자를 나타내는 숫자 유형이지만 foreach 루프의 i는 배열의 키가 문자열 유형임을 나타냅니다. 왜냐하면 js의 모든 것은 모두 객체이기 때문입니다. 직접 시도해 보세요. Alert(typeof i); 이 차이는 사소한 문제입니다. 이제 다음 코드를 추가하면 위의 실행 결과가 달라집니다.

//扩展了js原生的Array
Array.prototype.test=function()
 
}

시험해보고 위 코드의 기능을 확인하세요. 우리는 표준 for 루프가 여전히 배열 전체를 반복한다는 사실을 발견했습니다. 하지만 이때 foreach 루프는 제가 방금 작성한 테스트 메서드를 인쇄합니다. 이것이 배열을 순회하는 for와 foreach의 가장 큰 차이점입니다. foreach를 사용하여 프로젝트에서 배열을 순회하는 경우 어느 날 누군가 실수로 js의 기본 Array 클래스를 확장하거나 외부 js 프레임워크를 도입하고 확장한다고 가정해 보겠습니다. 네이티브 배열. 그런 다음 문제가 발생합니다.

for in 문을 사용하면 어떨까요?

키워드: 기본 Array 클래스, 확장 Array 클래스
for in 문을 사용하여 배열 객체를 탐색할 때 발생할 수 있는 버그는 다음과 같습니다. 기본 Array 클래스가 다른 js 스크립트 라이브러리에 의해 프로토타입 확장된 경우(예: JSON에 추가 추가) 메서드, 즉 Array .prototype.toJSON=xxxx), 확장된 Array 객체를 순회하기 위해 for in을 사용하는 논리는 기본 Array 객체를 순회하는 논리와 다릅니다.
간단한 예를 들면

var x=[1]; 
for(var s in x){ 
alert(s); 
};

상식에 따르면 Array가 기본 js 클래스인 경우 위 명령문은 경고 메서드를 한 번만 실행해야 하며 s는 배열의 index 0입니다. 그러나 Array 클래스가 추가 toJSON 메서드로 확장되면 위 문은 경고를 두 번 실행합니다. 첫 번째 s는 인덱스 0이고 두 번째 s는 메서드 이름 'toJSON'입니다.

당신이 디자인한 코드의 로직이 기본 Array 클래스를 기반으로 하고 어느 날 동료가 페이지에서 타사 JS 라이브러리를 참조하고 이 라이브러리가 우연히 Array 클래스를 확장한다면 결과는 상상할 수 없을 것이며 매우 위험합니다. 어쩌면 원래 코드 논리가 더 이상 유지되지 않을 수도 있습니다.

네이티브 JS 클래스를 확장하는 이러한 종류의 라이브러리와 관련하여 잘 알려진 라이브러리는 toJSON, Each 등과 같은 다양한 메서드를 Array 클래스로 확장하는 프로토타입.js입니다. 이제 나는 왜 jquery의 창시자가 프로토타입에 대해 그토록 화를 냈는지 이해합니다(많은 사람들이 특별한 이유로 같은 페이지에서 jquery와 프로토타입을 사용합니다. noCon충돌만으로는 해결할 수 없는 예상치 못한 충돌 문제가 많이 있을 것입니다.). 또한, jqModal의 작성자가 내 기사를 이해한다면 그는 아마도 프로토타입에 대해 불평하면서 다음과 같이 말할 것입니다. "배열 순회에 for in을 사용하는 것은 현명하지 못하지만 더 나쁜 것은 프로토타입입니다..."

As 위에서 언급했듯이, jqModal을 사용하고 있고 다른 이유로 프로토타입도 사용하고 있다면 축하합니다. 당신은 속은 것입니다. 충돌로 인해 jqModal의 팝업 상자는 ie6 및 ie7에서 closeClass에 의해 설정된 버튼을 사용하여 자동으로 닫힐 수 없습니다. 디버깅 코드를 추적하면 이 기사의 시작 부분에 언급된 hs 메서드의 for in 루프에 예외가 있음을 알 수 있습니다. . .
셋, 문제 해결
배열 순회 시 for in 대신 for var 문을 사용하세요.

위 내용은 javascript에서 for와 for in의 차이점과 for in이 권장되지 않는 이유의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!