조건문 if,else, else if, switch

조건문

조건문은 어떤 조건에 따라 이후 행동이 달라지게 만들어주는 역할

 

if 조건문

조건에 따라 코드를 실행하거나 실행하지 않도록 하기 위해 사용하는 구문

괄호 안의 조건이 true 면 중괄호안의 문장을 실행하고 false 면 중괄호 안의 문장을 실행하지 않음
* if 의 괄호안의 값은 항상 Boolean형으로 형변환 뒤 판단됨

Boolean 형으로 변환됨

else 구문

만약 위 예시의 반대의 경우(19세 보다 작은 경우) 를 출력하려면 어떡해야할까? 

else 구문은 if의 조건문 뒤에 사용하며, if 조건문이 거짓일 때 사용합니다.

const age = 10;

if(age > 19){
  console.log("성인이시네요"); //age 는 19 보다 크고 true 이므로 '성인이시네요' 출력
} else{
  console.log("미성년자이시네요") //age 는 19 작고 false 이므로 '미성년자이시네요' 출력
}

 

 

중첩 조건문

조건문 안에 조건문을 중첩해 사용하는것 (여러번 중첩하는것도 가능)

// 0~12 어린이
// 13~19 청소년
// 20 이상부턴 성인

const age = 19;

if(age < 13){
  alert('당신은 어린이 입니다.');  // 13 보다 작다면 해당 알럿을 띄움
} else {
  if(age < 19){
    alert('당신은 청소년 입니다.'); // 13보다 같거나 크고 19보단 작다면 해당 알럿을 띄움
  } else {
    alert('당산은 성인입니다.');  // 19 이상이라면 해당 알럿을 띄움
  }
}

 

if else if 조건문

겹치지 않는 세가지 이상의 조건문에서 중괄호를 생략한 형태로, 겹치지 않는 3가지 이상의 조건으로 나눌 때 사용합니다.

const age = 19;

if(age > 19){
  console.log("성인이시네요"); 
} else if(age === 19){
  console.log("수능 잘보세요")//age 는 19 로 true 이므로 '수능 잘보세요' 출력
} 
 else{
  console.log("미성년자이시네요")
}

어떤 순서로 위 코드가 실행되냐면 먼저 19 보다 큰지 참,거짓을 확인 후 거짓이라면 19와 같은지를 확인하게 된다 여기서도 거짓이 뜨면 그때 19보다 작은지를 확인하게 된다.

 

 

 

<조건문 예제>

// 사용자 a와 b 에게 각각 숫자를 입력 받는다.
// 조건문을 통해 a가 큰지 b가 큰지 값을 출력한다.

const a = prompt('a의 값을 입력해주세요');
const b = prompt('b의 값을 입력해주세요');

if(a > b){
  alert('a는 b 보다 큽니다.');
} else if(a === b) {
  alert('a와 b의 값은 동일합니다.');
} else {
  alert('b는 a보다 큽니다.');
}

// 논리 연산자를 활용
// 10보다 크고 20보다 작음을 둘다 만족

const x = 15;

if(x > 10 && x < 20){
  alert('참입니다.')
}

// 사용자에게 숫자를 입력받아 양수, 음수, 0 임을 구분하는 프로그램을 만드세요

const a = prompt('숫자를 입력해주세요(양수,0,음수 모두 입력가능)');

if(a > 0){
  alert('양수입니다.');
} else if(a == 0){
  alert('0입니다.');
} else {
  alert('음수입니다.');
}

// 사용자에게 숫자를 입력받아 홀수인지 짝수인지 구별하는 프로그램

const a = prompt('숫자를 입력해주세요');

if(a%2 === 1){
  console.log('홀수입니다.');
} else {
  console.log('짝수입니다.')
}

 

switch

switch 문은 if, else 로도 대체할 수 있고 기능도 같지만 케이스가 다양할 경우 보다 간결하게 쓸 수 있기 때문에 자주 쓰임

<출처> youtube.com/watch?v=KF6t61yuPCY&t=873s 중 이미지

// 사과: 100원
// 바나나: 200원
// 멜론: 300원
// 수박: 300원

const fruit = prompt('어떤 과일을 사실건가요?');
switch(fruit){
  case '사과':
    console.log('100원 입니다.'); // '사과'룰 입력했을 경우 해당 문구 출력
    break; // case는 출력된 값을 기준으로 아래의 모든것을 다 출력하므로 break 를 걸어줘야함
  case '바나나': 
    console.log('200원 입니다.'); // '바나나'룰 입력했을 경우 해당 문구 출력
    break;
  case '수박': 
  case '멜론':
    console.log('300원 입니다.'); // '수박'또는 '멜론'을 입력했을 경우 해당 문구 출력, 동일한 값을 출력하므로 수박과 멜론을 하나로 묶을 수 있음
    break;
   default: // 이외에 다른것을 입력했을 경우   
    console.log('없는 과일입니다.');

}

<switch 예제>

// switch 조건문을 사용하여 사용자에게 입력받아 홀수와 짝수 숫자가 아님을 구분하는 프로그램

const num = prompt("숫자를 입력해주세요");

switch(num % 2){
  case 1:
   console.log('홀수입니다.');
   break;
  case 0:
    console.log('짝수입니다.');
    break;
  default:
    console.log('숫자가 아닙니다.');
    break;
}

 

조건부 연산자

자바스크립트에는 조건문과 비슷한 연산자가 있는데 이것을 조건부 연산자라고 합니다.  또한 자바스크립트는 항을 3개 갖는 연산자는 조건부 연산자가 유일해서 삼항 연산자라고 부리기도 합니다.

 

기본 형태는 boolean표현식 ? 참일때의 결과 : 거짓일때의 결과

// 삼항 연산자, 조건부 연산자
const a = 10;

const result =(a % 2 == 1) ? 'a는 홀수입니다.' : 'a는 짝수입니다.'
console.log(result);  // 'a는 짝수입니다.' 반환

//a 를 2로 나웠을때 나머지는 0 이므로 앞의 표현식은 false 가 돼서 뒤의 문장을 출력한다.

 

짧은 연산자

논리 연산자를 활용한 조건문

// 논리 연산자를 활용한 짧은 연산자

const a = 34;
const b = 10;

const result1 = a > 10 && '앞에 참이 므로 뒷 문장 출력';
console.log(result1); // '앞에 참이 므로 뒷 문장 출력' 반환

const result2 = a < 4 && '앞이 거짓이므로 뒷 문장은 출력되지 않음';
console.log(result2); // false 반환