Chapter 03. 조건문
if 조건문
switch 조건문
조건부 연산자와 짧은 조건문
03-1 if 조건문
if 조건문
불 표현식 값이 true면 중괄호 안의 문장을 실행하고 false면 문장을 무시합니다.
if else 조건문
else 구문은 if 조건문 바로 뒤에 붙여서 사용합니다. 이를 조합한 조건문을 if else 조건문이라고 부르고 기본 형태는 다음과 같습니다.
if(불 값이 나오는 표현식) { 불 값이 참일 때 실행할 문장 } else { 불 값이 거짓일 때 실행할 문장 }
중첩 조건문
조건문 안에 조건문을 중첩해 사용하는 것을 중첩 조건문이라고 합니다. 중첩 조건문의 형태는 다음과 같으며 여러 번 중첩하는 것도 가능합니다.
if (불 값이 나오는 표현식 1) { if (불 값이 나오는 표현식 2) { 표현식 2가 참일 때 실행할 문장 } else { 표현식 2가 거짓일 때 실행할 문장 } } else { if (불 값이 나오는 표현식 3) { 표현식 3이 참일 때 실행할 문장 } else { 표현식 3이 거짓일 때 실행할 문장 } }
if else if 조건문
if 조건문은 조건문이 한 문장이라면 중괄호를 생략해도 된다고 설명했습니다. 이 개념을 이용해 중첩 조건문에서 중괄호를 생략한 형태가 if else if 조건문입니다. 겹치지 않는 3가지 이상의 조건으로 나눌 때 사용합니다.
if (불 표현식) { 문장 } else if (불 표현식) { 문장 } else if (불 표현식) { 문장 } else { 문장 }
정리
if 조건문은 조건에 따라 코드를 실행하거나 실행하지 않도록 하기 위해 사용하는 구문입니다.
else 조건문은 if 조건문 뒤에 사용하며, if 조건문이 거짓일 때 사용합니다.
중첩 조건문은 조건문을 중첩해서 사용하는 경우를 의미합니다.
if else if 조건문은 중첩 조건문에서 중괄호를 생략한 형태로 겹치지 않는 3가지 이상의 조건으로 나눌 때 사용합니다.
03-2 switch 조건문과 짧은 조건문
switch 조건문의 기본 형태입니다. default 키웓드는 생략할 수 있습니다.
switch (자료) { case 조건A: break case 조건B: break dedfault: break }
break 키워드는 switch 조건문이나 반복문을 빠져나가기 위해 사용하는 키워드입니다.
switch 조건문의 괄호 안에는 비교할 값을 입력합니다. 이때 입력한 값을 기준으로 특정 코드를 실행합니다. 만약 입력한 표현식과 case 키워드 옆의 표현식이 같다면 case 키워드 바로 다음에 오는 문장을 실행합니다. 중괄호는 사용하지 않아도 됩니다.
조건부 연산자
자바스크립트에는 조건문과 비슷한 역할을 하는 연산자가 있습니다. 바로 조건부 연산자입니다.
불 표현식 ? 참일 때의 결과 : 거짓일 때의 결과
자바스크립트에서 항을 3개 갖는 연산자는 조건부 연산자가 유일해서 삼항 연산자라고 부르기도 합니다.
짧은 조건문
짧은 조건문은 논리 연산자의 특성을 조건문으로 사용하는 것입니다.
논리합 연산자를 사용한 짧은 조건문
불 표현식 || 불 표현식이 거짓일 때 실행할 문장
논리합 연산자의 좌변이 참이면 우변을 실행하지 않습니다. 좌변이 거짓이면 우변을 실행합니다.
논리곱 연산자를 사용한 짧은 조건문
논리곱 연산자는 양변이 모두 참일때만 참입니다. 좌변이 거짓이면 우변을 실행하지 않습니다.
결과가 거짓인 불 표현식 && 불 표현식이 참일 때 실행할 문장
기본 미션
p.139 확인 문제 3번 문제 풀고 완전한 코드 만들어 비주얼 스튜디오 코드에서 실행 결과 인증샷
3.중첩 조건문은 2장에서 배운 논리 연산자를 적용해 하나의 if 조건문으로 만들수 있습니다. 빈칸에 어떤 논리 연산자가 들어가야 할까요?
if (x > 10) { if (x < 20) { console.log('조건에 맞습니다.') } }
if (x > 10 && x < 20) { console.log('조건에 맞습니다.') }

선택 미션
p.152의 <태어난 연도를 입력받아 띠 출력하기> 예제 실행하여 본인의 띠 출력한 화면 캡쳐하기

'스터디 > 웹개발' 카테고리의 다른 글
| HTML (2) - Meta 태그의 charset 이란? (0) | 2022.06.17 |
|---|---|
| HTML (1) - head 태그란? (0) | 2022.06.16 |
| 자바스크립트 시작하기: 오류와 표준 스타일 (0) | 2022.01.11 |
| 자바스크립트 시작하기 : 설치와 코드 실행 (0) | 2022.01.10 |
| 자바스크립트 시작하기 (1) 개요 (0) | 2022.01.09 |