JS | ES6 문법 - for of 문

기존의 for 문

 let arr = ["a", "b", "c"];
 
//기존의 for문
    
for(let i = 0; i < arr.length; i++) {
     console.log(arr[i]);
}
for(let i in arr) {
     console.log(arr[i]); //i는 인덱스를 담아준다
}

 

기존의 foreach 메서드

forEach 메서드란 ? 

forEach() 메서드는 배열에 활용이 가능한 메서드로, 파라미터로 주어진 함수를 배열 요소 각각에 대해 실행하는 메서드이다. map()메서드와 거의 비슷하지만 차이점은 따로 return하는 값이 없다는 점이다.

//기존의 foreach메서드
    
arr.forEach(function(value, index, arr) { 
    console.log(value);
    console.log(index);
    console.log(arr);
})

 

for of 문

1. 반복 가능한 객체(iterable)를 for문 안에서 반복시켜 연속된 결과값을 얻습니다.

2. forEach문에서 지원하지 않는 break, continue, return의 사용가능

let arr = ["a", "b", "c"];
        
        // for(let i in arr){
        //     console.log(i); //결과는 index
        // }
        
        for(let i of arr){
            console.log(i); //결과는 값 value
        }

        for(let i of "hello world"){
            console.log(i);
        }

        let person = [
            {id : "aaa", age : 10},
            {id : "bbb", age : 20}
        ];

        //구조분해할당
        for(let {id,age} of person) {
            console.log(id);
            console.log(age);
        }

        //객체를 반복할 수는 없음
        // let obj = {a:1,b:2};
        // for(let i of obj){

        // } 에러