FOR OF LOOP

KimsPractice·2023년 1월 3일
0

ES6의 정석

목록 보기
27/30
post-thumbnail

출처 : Nomadcoders ES6의정석

이번 섹션에서는 자바스크립트의 새로운 루프에 관해 알아보려고 한다.

for of loop라고 하며, 루프란 말그대로 반복되는것을 말하고, 이름에서와 같이 반복가능한것에 사용할 수 있다.

예를들면 배열, 객체, 문자열과 같은것 말이다.

for of를 설명하기 전에 우리는 항상 기존사용법과 비교해볼 필요가 있다.

const alphabet = ['a','b','c','d','e','f']

for(let i = 0; i<alphabet.length; i++){
  console.log(alphabet[i])
}


기존엔 우리는 위와같은 형태로 루프를 처리해왔다. 반복수를 지정할 수 있는 이점이 있다.
우리는 보통 반복객체에 대한 데이터에 대해서만 반복을 처리하는 경우가 많을텐데,

우리는 forEach 통해 좀더 간편하게 반복객체에 대한 루프를 처리해줄 수 있다.

const alphabets = ['a','b','c','d','e','f']

alphabets.forEach((alphabet,index,arr) => console.log(`${index}:${alphabet} in ${arr}`))


forEach는 배열아이템에 대해 콜백함수를 실행해주는데, 매개변수로 아이템, 배열, 대상배열을 차례로 전달받을 수 있다.

그럼 forEach나 for문으로 루프를 처리하면 되는거 아니냐 라고 생각할 수 있는데,
이제 for of loop를 알아보면 가장 큰 차이점은 for of loop는 break가 가능하다.

for문과 forEach는 중간에 루프를 종료할 수가 없다. 조건에 맞게 모두 실행된 후에 루프가 종료되는데
for of loop는 원하는조건에 break를 걸어 루프를 중단시킬 수 있는것이 가장 큰 차이점이다.

const alphabets = ['a','b','c','d','e','f']


for(const alphabet of alphabets){
  if(alphabet === 'd'){
    break;
  }else{
    console.log(alphabet)
  }
}


예를 들어 DB에 데이터를 저장할 때 디스크점유율을 체크해서 디스크풀일때는 루프를 멈추는 등과 같이 제약이 필요할 때에 매우 유용하게 사용될거라 생각한다.

profile
난 그냥 살아 아주잘살아

0개의 댓글