[javascript] 배열 반복과 함께“for… in”을 사용하는 것이 나쁜 생각 인 이유는 무엇입니까?

이 for-in문장 자체는 “나쁜 습관”이 아니지만 배열이나 배열 같은 객체 를 반복 하는 등 잘못 사용할 수 있습니다 .

이 for-in문장 의 목적은 객체 속성 을 열거 하는 것입니다. 이 문장은 프로토 타입 체인에서 올라가고 때로는 원하지 않는 상속 된 속성을 열거 합니다.

또한 스펙에 의해 반복 순서가 보장되지는 않습니다. 즉,이 명령문을 사용하여 배열 오브젝트를 “반복”하려는 경우 특성 (배열 색인)이 숫자 순서대로 방문되는지 확신 할 수 없습니다.

예를 들어, JScript (IE <= 8)에서 Array 객체에서도 열거 순서는 속성이 생성 될 때 정의됩니다.

var array = [];
array[2] = 'c';
array[1] = 'b';
array[0] = 'a';

for (var p in array) {
  //... p will be "2", "1" and "0" on IE
}

또한 상속 된 속성에 대해 말하면 (예를 들어 Array.prototypeMooTools와 같은 일부 라이브러리와 같이) 개체를 확장하면 해당 속성도 열거됩니다.

Array.prototype.last = function () { return this[this.length-1]; };

for (var p in []) { // an empty array
  // last will be enumerated
}

이전에 배열이나 배열과 같은 객체 를 반복 하기 위해 말했듯 이 가장 좋은 방법은 일반 낡은 / 루프 와 같은 순차적 루프 를 사용하는 것입니다 .forwhile

상속되지 않은 객체 의 고유 한 속성 만 열거 하려면 다음 hasOwnProperty방법을 사용할 수 있습니다 .

for (var prop in obj) {
  if (obj.hasOwnProperty(prop)) {
    // prop is not inherited
  }
}

그리고 어떤 사람들은 객체에 Object.prototype이름이 지정된 속성을 추가하는 경우 문제가 발생하지 않도록 직접 메서드를 호출하는 것이 좋습니다 hasOwnProperty.

for (var prop in obj) {
  if (Object.prototype.hasOwnProperty.call(obj, prop)) {
    // prop is not inherited
  }
}

답변

Array.prototype.myOwnFunction = function() { alert(this); }
a = new Array();
a[0] = 'foo';
a[1] = 'bar';
for(x in a){
 document.write(x + ' = ' + a[x]);
}

0 = 푸
1 = 바
myOwnFunction = function () {경고 (this); }

for(i=0,x=a.length;i<x;i++){
 document.write(i + ' = ' + a[i]);
}

0 = 푸
1 = 바

for (var ix=0;ix<arr.length;ix++) alert(ix);

var arr = ["hello"];
arr[100] = "goodbye";

Array.prototype.foo = 1;
var arr = [];
arr[5] = "xyz";

console.log("for...of:");
var count = 0;
for (var item of arr) {
    console.log(count + ":", item);
    count++;
    }

console.log("for...in:");
count = 0;
for (var item in arr) {
    console.log(count + ":", item);
    count++;
    }

for...of:

0: undefined
1: undefined
2: undefined
3: undefined
4: undefined
5: xyz

for...in:

0: 5
1: foo