반복문

for문

for

• 변수를 선언하는 초기화식, 결과(true or false)에 따라 실행문의 실행 여부를 판단하는 조건식, 실행문 이후 변수의 증감을 나타내는 증감식으로 구성

for (초기화식; 조건식; 증감식) {
  실행문;
}

for문의 선택적 사용

• for문의 구성요소(초기화식, 조건식, 증감식)들은 모두 선택적으로 사용

//초기화식 없을 경우
let i = 0; // 전역 변수
for (; i < 2; i++) {
  console.log("count: " + i);
}
//count: 0
//count: 1

//조건식이 없을 경우
for (let i = 0; ; i++) {
  if (i < 2) console.log(`${i}살 입니다.`);
  else break;
}
// 0살 입니다.
// 1살 입니다.

// 초기화식, 조건식, 증감식이 없을 경우
let i = 0;
for (;;) {
  i++;
  console.log("count: " + i);
  if (i >= 3) break;
}
//count: 1
//count: 2
//count: 3

danger

for문 구성요소 사용시 주의사항

;생략은 불가능하며, 구성요소 안에서 2개가 필수적으로 포함되어야한다.
구문이 무한루프에 빠지지않도록 적절한 조건문, break, 증감식을 잘 이용하여야 한다.

while문

while

• 조건문이 true일 경우 코드가 실행.
• 조건문이 false가 되면 종료되는 반복문

while (조건문) {
  실행문;
}

do while

• while과 유사하지만 조건문 실행 전 do영역의 코드가 반드시 한 번은 실행.

do {
  실행문;
} while (조건문);

let value = 1;

do {
  console.log(value); // 1
  value++;
} while (value < 1);
// while문의 조건이 맞지 않아도 최초 한번은 무조건 실행

break, continue, 레이블

break

• 반복문이 동작하는 과정 중, 원하는 조건에 break문으로 반복문을 탈출.

// while
let a = 0;
while (true) {
  //true일 경우 무한히 반복
  if (a === 2) break;
  a++;
}
console.log(a); // 2

//for
for (let v = 0; i <= 3; i++) {
  if (v !== 0) {
    console.log(v); // 1
    // break를 만나기 전까지는 코드가 동작한다.
    break;
  }
}

continue

• 반복문의 순회를 중단하고, 다음 상태로 갱신 시킨다.

//while문
let i = 1;
while(i < 4){
    if(i % 2 === 0){
        i++;
        continue;
    }
    console.log(i++);//1 3
}

//for문
for(var v = 0; v < 5; ; v+=2){
    if(v === 0 || v === 4) continue;
    console.log(v)// 2
}

레이블

• 레이블은 식별자로 일종의 코드 블록의 네임태그
• 반복문 앞에 레이블을 붙여 break나 continue구문과 함께 사용하면 반복문을 컨트롤하기에 용이
• 레이블을 붙이면 중첩 반복문 사용 하면 레이블을 붙인 반복문을 한 번에 종료

for (let x = 2; x < 10; x++) {
  test: for (let y = 1; y < 10; y++) {
    if (x === 4) break test;
    console.log(`${x} X ${y} = ${x * y}`);
  }
  // 구구단 4단 제외하고 2-9단까지 출력
  // 실제로 잘 사용하지 않는다.
}

danger

• 레이블은 반드시 break, continue 위에 있어야 한다.
• break문은 모든 레이블에서 사용 가능
• continue문은 반복문에서만 가능

object(객체) 반복문

for in

• 객체의 key값이나 배열의 위치(index)를 순회하여 호출한다.
  • 배열은 값의 순서대로 인덱스를 호출
  • 객체의 key값은 순서대로 호출한다는 보장이 없다.

const pocket = {
    피츄: 0
    피카츄: 1,
    라이츄: 2
}

for(let i in pocket){// i는 pocket의 key를 출력한다.
    console.log(i)// 피츄, 피카츄, 라이츄
    console.log(pocket[i])// 0 1 2
}

tip

• 일반적인 객체 리터럴은 반복 가능한(iterable) 객체로 인식되지 않는다.
• 반복 가능한 객체가 아니라면 for of를 쓸 수 없다.
• 객체 리터럴에 쓸 수 있는 방법은 for in문이다.

array(배열) 반복문

for of

• 반복문을 통해 배열(map, set 등)의 값을 순차적으로 호출한다.
• 객체 자체로는 사용이 불가능

const languages = ["Java", "Python", "C++"];

for (var i of languages) {
  console.log(i);
}
// Java Python C++

tip

배열도 타입은 객체이다.
for in을 사용하여 구현을 해도 되지만
배열의 값을 순차적으로 확인하거나 값을 사용해야 하는 경우,
for in은 배열의 순서값(index)을 호출하고 따로 값을 호출 해야함으로 다소 구현에 불편함을 줄 수가 있다.

danger

{ key : value }를 가진 객체는 반복 가능한 객체 아니기 때문에 for of을 쓰면 에러 발생

Object 메소드(Object.keys(), Object.values(), Object.entries())들을 활용해 Array로 반환하여 for of를 사용 가능

const person = {
  name: "JJamVa",
  age: 27,
  gender: "male",
};

const props = Object.values(person);
for (let value of props) {
  console.log(value);
}
// JJamVa 27 male