내용이 안 보인다면 쿠키/캐시를 지우고 새로고침 하세요!
이 블로그는 광고 클릭 수익으로 운영됩니다!
괜찮으시다면 광고 차단을 풀어주세요 ㅠㅠ

게시글

강좌5 - JavaScript - 3년 전 등록 / 3일 전 수정

조건문(condition)

조회수:
0
이 블로그는 광고 클릭 수익으로 운영됩니다!
괜찮으시다면 광고 차단을 풀어주세요 ㅠㅠ
이 블로그는 광고 클릭 수익으로 운영됩니다!
괜찮으시다면 광고 차단을 풀어주세요 ㅠㅠ

안녕하세요. 이번 시간에는 조건문에 대해서 알아보겠습니다. 이제 조금만 더 배우면 간단한 프로그램을 만들 수 있어요!

조건문

조건문이란 특정한 조건 아래서만 코드가 실행되게 하는 구문을 말하는데요. 로그인 되어있는 상태에서만 댓글을 남길 수 있게 한다든지 하는 상황에서 사용되겠죠?

조건문에는 if, switch가 대표적입니다.

If

if문은 if (조건) {내용}으로 구성되는데요. 조건이 true면 내용이 실행됩니다.

var a = 20;
if (a > 10) {
  alert('10보다 큼'); // alert함수는 메시지를 띄웁니다.
}

a가 10보다 큰 상황에서만 10보다 크다고 alert합니다. alert함수는 인자로 넣은 문장을 브라우저에 메시지로 띄웁니다. 지금 a가 20이니까 a > 10이 true가 되어alert 함수가 실행됩니다.

else else if를 사용해서 조건을 구체화할 수도 있습니다. elseif 조건이 false일 때 실행됩니다. else if는 조건을 여러개로 하고 싶을 때 실행됩니다.

if (a > 10) {
  alert('10보다 큼');
} else {
  alert('10보다 작거나 같음');
}
if (a > 10) {
  alert('10보다 큼');
} else if (a > 5) {
  alert('5보다 큼');
} else {
  alert('5보다 작거나 같음');
}

if 안의 조건은 true이면 실행된다고 했죠? 근데 true인 경우가 생각보다 많습니다. 이전 시간 비교연산자를 배울 때 ==의 오류에 대해 알아보았습니다. 문제는 if의 조건을 체크하는 방식이 == 비교연산자의 계산과 같다는 겁니다. 0, -0, null, false, NaN, undefined, ''의 값을 가지면 false이고 나머지 값을 가지면 전부 true입니다. 이상한 게 false == []이지만 if ([])는 실행됩니다.

if (0) {
  alert('실행 안 됨');
}
if ('') {
  alert('실행 안 됨');
}
if ([]) {
  alert('실행됨');
}

황당하죠? 그냥 false가 나오는 경우들을 외웁시다. 이게 자료형이 유동적인 자바스크립트 변수의 비극입니다.

간단한 if else문은 삼항연산자로 바꿀 수 있습니다. 한 줄로 줄일 수 있어 편합니다.

var i = 10, j;
if (i > 10) {
  j = 15;
} else {
  j = 5;
}
var j = i > 10 ? 15 : 5;

Switch

switch ~ case문은 if ~ else if ~ else와 비슷합니다.

switch (c) {
  case 10: // c가 10일 때
    alert('c는 10');
    break;
  case 9: // c가 9일 때
    alert('c는 9');
    break;
  case 8: // c가 8일 때
    alert('c는 8');
    break;
  default: // 위의 경우에 해당하지 않을 때
    alert('그 외');
}

case 뒤에 c에 해당하는 조건을 적고 그 아래에 실행할 내용을 적습니다. default는 어떤 조건에도 해당이 안 될 때 실행됩니다. else와 비슷합니다. 조심할 점은 case하나마다 내용 밑에 break;을 적어줘야합니다. break을 적지 않으면 해당 case 아래로 모든 내용이 실행됩니다. 한 번 break;을 빼고 다시 실행해보세요. 바로 깨달을 겁니다. switch ~ case가 왜 if ~ else if ~ else와 비슷하냐면 위의 switch문을 다음과 같이 바꿀 수 있습니다.

if (c === 10) {
  alert('c는 10');
} else if (c === 9) {
  alert('c는 9');
} else if (c === 8) {
  alert('c는 8');
} else {
  alert('나머지');
}

취향 따라 switch와 if ~ else if문을 선택하시면 되겠습니다! 다음 시간은 반복문에 대해 알아보겠습니다.

투표로 게시글에 관해 피드백을 해주시면 많은 도움이 됩니다. 오류가 있다면 어떤 부분에 오류가 있는지도 알려주세요! 잘못된 정보가 퍼져나가지 않도록 도와주세요.
Copyright © 2016- 무단 전재 및 재배포 금지

댓글

1개의 댓글이 있습니다.
일 년 전
글 잘 읽고 있습니다. 조건문에다 배열을 넣는다는건 처음보고 흥미롭네요. 궁금한 점 질문해 봅니다^^



1.if ([]){} 에서 빈 배열이 false 값을 가진다고 하는데 실행되는 구체적인 이유가 궁금하네요.

2.그럼 빈 배열이 아닌 한개이상의 요소를 갖는 배열은 모두 true 인가요?

3. 조건문에다가 배열도 넣는데 객체를 넣어도 실행되나요? 된다면 어떨때 true고 false 인지 궁금합니다!
일 년 전
1. []는 조건문에서 true입니다. 조건문에서 false 값을 가지는 것만 따로 외우시는 게 좋습니다.

2. 그렇습니다. 하지만 그렇게 비교할 일은 없을 겁니다.

3. 객체는 항상 true입니다! 항상 실행됩니다.