[개발 공부]/[자바스크립트]

[자바스크립트] javascript for 문 정리

wild keyboardist 2021. 12. 2. 12:06

[자바스크립트] javascript for 문 정리

 

 

 

 

1) 기존 for문 :

 

for(var i=0; i<array.length; i++) {
}

 

[해석]

 

i 시작은 0,

i 가 array의 길이보다 작을 때까지,

i 는 (++)성장한다.

 

 

 

=> 가장 기본이지만 제일 정확한 방식인 것 같다. object / array 둘 다 순환이 가능!

 

 

 

 

 

 

 

 

 

2) for in 문 :

 

var player = {
    name : 'Son',
    age : 30,
    position : 'forward',
    nationality : 'South Korea'
}


for(let key in player) {
    if(key.indexOf('age')) {
    	console.log(player[key]);
    }
}


//console.log(player[key]) : 30


//객체(Object)를 순환할 때는
//보통 index 처럼 [0,1,2,3...] 이 아니라,
//key 는 [name, age, position, nationality] 가 되기에,
//key.indexOf('age') 가 가능하다.

 

[Note]

 

객체를 순환할 때에 index 는 key 값이 된다! 

위 예제와 같이 객체를 순회할 때 사용하면 유용하게 쓰일 수 있다.

 

 

그러나,

 

it should NOT be used to iterate over an Array where the index order is important

=> index 가 중요하게 취급되는 배열에는 for in 문은 적합하지 않다. (사용은 가능하지만)

 

 

 

[설명]

 

for in 문은 프로퍼티 속성 중 enumerable:true 인 모든 프로퍼티를 순회함

=> 모든 프로퍼티를 순회하는게 아니고, 열거할 수 있는 프로퍼티만 순회함!

 

 

 

크롬이나, 사파리 등의 브라우저는 배열에 for in 문을 사용해도 오류가 나지 않지만, 

old IE version 에서는 배열 index 외에도 enumerable:true 프로퍼티가 검출되는 경우가 있어

undefined 같은 오류가 발생한다고 한다. (어디서 주워들은 얘기지만)

 

 

 

 

 

 

 

 

3) for of 문 :

 

for(var i of obj) {
}

 

IE 에서 지원하지 않음 => 그래서 잘 사용 안 함

반복할 수 있는 객체(Array, Map, Set, etc...)의 모든 요소를 순회함

공부하기 귀찮아서 그런거 아님......