[javascript] 자바 스크립트에서 배열이 잘못된 ‘for (var item in list)’인 이유는 무엇입니까?

Program / 글쓴이

0 기반의 숫자 인덱스 배열이 주어지면 :

var list = ['Foo', 'Bar', 'Baz'];

여러 번, 누군가가 다음과 같은 배열의 변수를 통해 루프를 제안 할 때 발견했습니다.

for(var item in list) { ... }

… 거의 확실히 누군가가 그것이 나쁜 관행이라고 제안하고 다른 접근 방식을 제안합니다.

var count = list.length;

for(var i = 0; i < count; i++) {
    var item = list[i];
    ...
}

위의 더 간단한 버전을 사용하지 않고 대신 두 번째 예제를 사용하는 이유는 무엇입니까?

답변

첫째, 루프의 순서가 루프에 대해 정의되어 있지 for...in않으므로 속성이 원하는 순서로 반복된다는 보장이 없습니다.

둘째, for...in프로토 타입에서 상속 된 속성을 포함하여 개체의 모든 열거 가능한 속성을 반복합니다. 배열의 경우, 페이지에 포함 된 코드 나 라이브러리가의 프로토 타입을 보강 한 경우 영향을 미칠 Array수 있습니다. 이는 진정으로 유용한 작업이 될 수 있습니다.

Array.prototype.remove = function(val) {
    // Irrelevant implementation details
};

var a = ["a", "b", "c"];

for (var i in a) {
    console.log(i);
}

// Logs 0, 1, 2, "remove" (though not necessarily in that order)

답변

속도?

for(..;..;..)루프는 여기에서 테스트했을 때보 다 36 배 더 빠릅니다 for .. in .

링크 예의이 SO 답변

답변

이와 같이 for / in을 사용하면 item문자열 값 “0”, “1”, …을 통해 열거되므로 목록의 실제 개체가 아닙니다. 따라서 첫 번째 스 니펫의 ‘항목’ i은 item. 또한 문자열 값은 숫자가 예상되는 곳에 열거됩니다. 그리고 목록에 속성을 지정할 때 문제가 발생합니다 array.ID = "a123".

그러나 이러한 단점으로 인해 팀이 수행하는 작업을 알고 있다면 구문이 여전히 매우 유용하다고 생각합니다.

답변

for ... in ... 목록 항목을 반환하지 않고 대신 배열 속성을 열거합니다.

그 이유만으로는 루프를 대체 할 수 없습니다for (i=0; i<arr.length; i++) .

적절한 대안은 for ... of ...구성입니다. 배열과 같은 반복 가능한 개체의 값을 열거합니다. MDN 웹 문서 ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for…of) 에서 자세한 내용을 읽을 수 있습니다.

관련 최신 브라우저에서 지원됩니다 (Internet Explorer는 포함되지 않으며 Microsoft Edge로 대체 됨). 구형 브라우저를 지원하지 않을 여유가 있다면 아마도 갈 길일 것입니다. 미리 링크 된 MDN 페이지 끝에있는 편리한 브라우저 지원 표를 확인하여 실제로 for ... of ...사용 이 허용되는 브라우저 버전을 확인할 수 있습니다.

답변

추가 list.foo = bar;하고 간단한 for. 일부 라이브러리 (예 : prototypeJs)를 사용하지 않고 배열 객체에 새 속성을 추가하지 않으면 간단한 for 문을 사용할 수 있습니다.

답변