> 웹 프론트엔드 > JS 튜토리얼 > JavaScript에서 for in 루프를 사용하는 방법은 무엇입니까? 무엇에 주의해야 합니까?

JavaScript에서 for in 루프를 사용하는 방법은 무엇입니까? 무엇에 주의해야 합니까?

伊谢尔伦
풀어 주다: 2017-07-26 13:21:17
원래의
1826명이 탐색했습니다.

JavaScript가 객체를 반복하는 두 가지 방법을 제공한다는 것은 누구나 알고 있습니다.

(1)for loop;
(2)for..in loop;
for 루프를 사용하여 배열 객체를 반복하는 것은 이미 모두가 익숙할 것입니다. . 하지만 for..in 루프를 사용할 때는 모두가 주의해야 합니다. 왜 이렇게 말하는 걸까요? 여러분, 제 말을 들어보세요...
Javascript는 for...in 루프에서 객체의 속성이나 배열의 각 요소를 반복하는 데 사용되는 특수 루프(즉, for...in 루프)를 제공합니다. in loop 루프 카운터는 숫자가 아닌 문자열입니다. 여기에는 현재 속성의 이름이나 현재 배열 요소의 인덱스가 포함됩니다.
사례 1:

//使用for..in循环遍历对象属性 
varperson={ 
name: "Admin", 
age: 21, 
address:"shandong" 
}; 
for(vari in person){ 
console.log(i); 
}
로그인 후 복사

실행 결과는
name
age
address
객체를 순회할 때 루프 카운터인 변수 i가 해당 객체의 속성 이름입니다.

//使用for..in循环遍历数组 
vararray = ["admin","manager","db"] 
for(vari in array){ 
console.log(i); 
}
로그인 후 복사

실행 결과:
0
1
2
배열을 순회할 때 루프 카운터인 변수 i는 현재 배열 요소의 인덱스입니다.
사례 2:
하지만 이제는 for..in 루프가 매우 쉬운 것 같습니다. 사용하되 너무 일찍 너무 기뻐하지 마세요. 다음 예를 살펴보세요.

var array =["admin","manager","db"]; 
//给Array的原型添加一个name属性 
Array.prototype.name= "zhangsan"; 
for(var i in array){ 
alert(array[i]); 
}
로그인 후 복사

실행 결과:
admin
manager
db
zhangsan
야, 신기하다 장산이 왜 아무 이유 없이 나타나는지
이제 for 루프를 사용할 때 어떤 일이 발생하는지 살펴보겠습니다.

vararray = ["admin","manager","db"]; 
//给Array的原型添加一个name属性 
Array.prototype.name = "zhangsan"; 
for(var i =0 ; i<array.length; i++){ 
alert(array[i]); 
};
로그인 후 복사

실행 결과:
admin
manager
db
아, 이제 for..in 루프가 특정 유형의 프로토타입에 있는 메서드와 속성을 순회하므로 이로 인해 코드에 문제가 발생할 수 있다는 것을 이해했습니다. 예상치 못한 오류입니다. 이 문제를 방지하려면 객체의 hasOwnProperty() 메서드를 사용하여 객체의 속성이나 메서드가 상속되지 않으면 hasOwnProperty() 메서드가 true를 반환합니다. 즉, 여기서 검사에는 다른 개체에서 상속된 속성 및 메서드가 포함되지 않고 특정 개체 자체에서 직접 생성된 속성만 포함됩니다.
사례 3:

vararray = ["admin","manager","db"]; 
Array.prototype.name= "zhangshan"; 
for(vari in array){ 
//如果不是该对象自身直接创建的属性(也就是该属//性是原型中的属性),则跳过显示 
if(!array.hasOwnProperty(i)){ 
continue; 
} 
alert(array[i]); 
}
로그인 후 복사

작업 결과:
admin
manager
db
모든 것이 다시 손상되지 않았습니다.

위 내용은 JavaScript에서 for in 루프를 사용하는 방법은 무엇입니까? 무엇에 주의해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿