자바스크립트 기초 - 조건문과 반복문

📌  조건문과 반복문

✅  조건문 (If statement)

랜덤 함수를 형제 컴포넌트로 만든 후에 import 시킨 후, 랜덤 함수의 반환 값이 0과 2 혹은 그 나머지 값일 때 출력되는 값을 다르게 설정해보았다.

 

import random from './getRandom';


// 조건문 (If statement)
console.log(random());

const a = random();

if (a === 0) {
  console.log('a is 0');
} else if (a === 2) {
  console.log('a is 2');
} else {
  console.log('Rest...');
}

 

✅  조건문 (Switch statement)

조건문 switch statement에서는 말 그대로 스위치를 껐다 켰다 하는 것처럼 이해해도 된다. switch 조건문에선 case 별 조건을 할당하여 반환시켜주는 경우를 컨트롤할 수 있다. 그리고 반드시 조건이 끝나면 break로 프로그래밍을 멈춰준다. 그리고 default 경우는 제어해준다.

 

import random from './getRandom';

const b = random();

switch (b) {
  // 다음 Case가 오기 전에 반드시 break를 넣어준다.
  case 0:
    console.log('b is 0');
    break;
  case 2:
    console.log('b is 2');
    break;
  case 4:
    console.log('b is 4');
    break;
  default:
    console.log('Rest...');
}

 

✅  반복문 (For statement)

반복문 for의 형식은 이와 같다.

for (시작 조건; 종료 조건; 변화 조건) { 기타 세부 내용 }

반복문은 소괄호 안에 반복에 필요한 조건을 기입해주고, 중괄호 안에 제어할 코드를 넣어준다.

 

const ulEl = document.querySelector('ul');

for (let i = 0; i < 10; i++) {
  const li = document.createElement('li');
  li.textContent = `list-${i + 1}`;

  if ((i + 1) % 2 === 0) {
    li.addEventListener('click', function () {
      console.log(li.textContent);
    });
  }
  ulEl.appendChild(li);
}

 

https://www.youtube.com/watch?v=IQ7EuH3mRck