본문 바로가기

IT/JavaScript

초보자를 위한 자바스크립트 제어문(if,else,elseif,switch)

728x90
반응형
728x170

자바스크립트는 웹 브라우저에서 동적인 웹 페이지를 만드는 데 많이 사용되는 프로그래밍 언어입니다. 조건문은 프로그래밍에서 가장 기본적인 제어 구조 중 하나이며, 조건에 따라 다른 코드 블록을 실행하도록 지시하는 데 사용됩니다.

자바스크립트에서는 if문, switch문, 삼항 연산자를 사용하여 조건문을 다룰 수 있습니다.

자바스크립트 if문
if문은 가장 기본적인 조건문입니다. if문은 주어진 조건이 참이면 특정 코드 블록을 실행합니다.

if (조건) {
  // 코드 블록 실행
}


예를 들어, 만약 변수 x가 10보다 크면 "x is greater than 10"이라는 메시지를 출력하는 코드는 다음과 같습니다.

let x = 15;

if (x > 10) {
  console.log("x is greater than 10");
}


위 코드를 실행하면 "x is greater than 10"이라는 메시지가 콘솔에 출력됩니다.

if문은 다음과 같은 방법으로 중첩해서 사용할 수도 있습니다.

let x = 15;

if (x > 10) {
  if (x < 20) {
    console.log("x is between 10 and 20");
  }
}


위 코드는 x가 10보다 크고 20보다 작을 때 "x is between 10 and 20"이라는 메시지를 출력합니다.

if문은 else문을 사용하여 조건이 거짓일 때 실행할 코드 블록을 정의할 수도 있습니다.

let x = 5;

if (x > 10) {
  console.log("x is greater than 10");
} else {
  console.log("x is less than or equal to 10");
}


위 코드를 실행하면 "x is less than or equal to 10"이라는 메시지가 콘솔에 출력됩니다.

JS switch문
switch문은 if문과 비슷하지만 다양한 조건을 처리할 수 있습니다. switch문은 하나의 변수나 표현식을 평가하고, 해당 변수 또는 표현식의 값에 따라 코드 블록을 실행합니다.

switch (변수 또는 표현식) {
  case 값1:
    // 코드 블록 실행
    break;
  case 값2:
    // 코드 블록 실행
    break;
  default:
    // 코드 블록 실행
    break;
}


예를 들어, 만약 변수 day가 "월요일"이면 "Monday"라는 메시지를 출력하는 코드는 다음과 같습니다.

switch문은 다음과 같은 방법으로 중첩해서 사용할 수도 있습니다.

let day = "월요일";
let time = "아침";

switch (day) {
  case "월요일":
    switch (time) {
      case "아침":
        console.log("Monday morning");
        break;
      case "점심":
        console.log("Monday afternoon");
        break;
      default:
        console.log("Monday");
        break;
    }
    break;
  case "화요일":
    // 다른 코드 블록 실행
    break;
  default:
    // 다른 코드 블록 실행
    break;
}

 


자바스크립트 삼항 연산자

예전 블로그 포스팅에서 말씀드린적 있는 삼항연산자가 나왔습니다!

혹시 다른 연산자들이 기억나지 않으시면 아래 글을 또 읽어보고 와주세요!!

 

2023.03.30 - [IT/JavaScript] - 자바스크립트 비교연산자 초보자를 위한 자세한 설명과 예제


삼항 연산자는 if문과 비슷한 방식으로 조건에 따라 다른 값을 반환합니다.

//(조건) ? 참일 때 반환값 : 거짓일 때 반환값
//예를 들어, 만약 변수 x가 10보다 크면 "big"이라는 문자열을, 그렇지 않으면 "small"이라는 문자열을 반환하는 코드는 다음과 같습니다.

let x = 15;
let message = (x > 10) ? "big" : "small";
console.log(message); // "big" 출력


위 코드를 실행하면 "big"이라는 메시지가 콘솔에 출력됩니다.

삼항 연산자는 중첩해서 사용할 수도 있습니다.

let x = 15;
let y = 20;
let message = (x > 10) ? ((y > 15) ? "big and good" : "big but not good") : "small";
console.log(message); // "big and good" 출력


위 코드는 x가 10보다 크고 y가 15보다 크면 "big and good"이라는 문자열을 반환합니다.

이상으로 자바스크립트에서 조건문을 다루는 방법에 대해 예제와 함께 간단하게 설명해드렸습니다. 조건문은 프로그래밍에서 필수적인 구조이므로, 자바스크립트를 공부하면서 꼭 숙지해두시길 바랍니다.

 

728x90
반응형
그리드형