자바스크립트의 조건문

조건문이란 무엇일까요?

조건이 참이 올 때, 구문을 실행시키는 것이 조건문입니다. 어떤 조건을 쓰든지 간에 값은 두 개밖에 올 수 없습니다. 바로 참과 거짓입니다. 가령 1 > 2라고 한다면 조건이 거짓이 되는 것이죠. 그리고 2 > 1일때는 참이 됩니다. 

if(2>1){
 console.log("2는 1보다 큽니다.");
};

if(1>2){
  console.log("1은 2보다 큽니다.");
};

두개의 조건문입니다. 둘 중에서 어느 구문이 실행될까요? 콘솔을 확인하시면 "2는 1보다 큽니다."라는 적혀있을 겁니다. 조건이 참인 위의 조건문만 실행된 것이죠.

if는 조건이 참일 때, 구문을 실행시킵니다.

else는 무엇일까요?

if문과 함께 else를 쓸 수 있습니다. else는 if의 조건이 거짓이 되었을 때 참이 되서 실행됩니다. 위의 소스코드를 고쳐보도록 하겠습니다. 

if(1>2){
  console.log("1은 2보다 큽니다.");
} else{
  console.log("2는 1보다 큽니다.");
}

else에는 따로 조건을 설정하지 않는다는 것을 주의해주세요. 1>2는 조건이 거짓이기 때문에 실행되지 않습니다. 그래서 그 뒤의 else문이 실행된 것입니다. 만약 x>1이라고 설정되어 있다면 우리가 생각할 수 있는 것은 "x가 1보다 크다.", "x가 1보다 크지 않다." 두가지 밖에 없습니다. 이럴 때 if와 else를 사용하면 됩니다.

else는 if의 조건이 거짓일 때 실행합니다.

조건이 여러가지 일 때 조건문 

조건이 여러가지일 경우는 어떻게 할까요? 맛있는 사탕을 어린이들에게 나눠준다고 생각해보세요. 4살 미만인 어린이들에게는 나눠주지 않고, 4살에서 7살인 아이들에게는 1개, 그리고 8살 이상인 아이들에게는 2개씩 나눠준다고 했을 때 if-else만으로는 조건을 완성시킬 수 없습니다. 이렇게 조건이 여러가지 일 경우에 else if를 사용합니다.

var x; 
x=8;//x의 값을 변경해보세요. 
if(x >= 8){
  console.log("사탕을 2개 줄게요.");
} else if(x >= 4){
  console.log("사탕을 1개 줄게요.");
} else{
  console.log("사탕을 줄 수 없어요.")
}

else if는 필요하다면 갯수 제한 없이 붙여서 사용하시면 됩니다. 첫 번째 if문의 조건이 거짓일 때 2번 째 if문의 조건을 확인합니다. 마지막의 else문은 위에 있는 조건들이 모두 거짓이면 실행됩니다.

else if는 조건이 여러가지 일 경우에 사용합니다.

자바스크립트의 truthy와 falsy

조건에는 참과 거짓이 올 수 있죠. 자바스크립트에서 모든 값이 참과 거짓으로 판명될 수 있습니다. 참으로 인식되는 값을 truthy, 거짓으로 인식되는 값을 falsy라고 합니다. 

if(""){
  console.log("empty str");
} else if(false){
  console.log("false");
} else if(NaN){
  console.log("NaN");
} else if(undefined){
  console.log("undefined");
} else if(null){
  console.log("null");
} else if(0){
  console.log("0");
} else if({}){
  console.log("{}");
}

7개의 조건이 있습니다. 이 조건문을 실행시키면 콘솔창에는 {}가 표시됩니다. 왜냐구요? 자바스크립트에서 빈 문자열("", ''), false, NaN, undefined, null, 0은 falsy입니다.

falsy를 제외한 나머지 값들은 모두 truthy입니다.

공감은 제작자에게 큰 힘이 됩니다.