학습 목표
- 비교연산자를 통한 엄격한 비교 (===, !==)에 대해 이해할 수 있다.
- 'if'와 'else if', 'else'를 이해하고 무리없이 활용할 수 있다.연산자
연산자란?
= 연산을 수행하는 기호로 '===', '!==','<-', '+', '-', '&', '|' 등이 있다.
대표적으로 관계(비교) 연산자와 할당(대입) 연산자, 산술 연산자, 논리 연사자 등이 있다.비교 연산자
비교(관계) 연산자란?
= 조건문에서 크기를 비교할 때 사용하며, '===', '!==', '<', '>' 등이 속해 있는 연사자를
기준으로 좌항과 우항의 상대적인 크기를 비교하여 값을 반환하는데,
결과값은 참(1)과 거짓(0)의 논리값만을 가진다.// 함수에서 '='은 '같음'을 의미하는 게 아니라 '오른쪽에 있는 것을 왼쪽에 대입하라'는 의미다. (변수에 대한 게시글 참고)
- === : 연산자 양측의 값이 같은지를 비교한다.
같으면 true, 다르면 false가 된다.
ex) 1 + 1 == 2 --> true
1 + 1 == 1 --> false
- !== : 연산자 양측의 값이 다른지 비교한다.
다르면 true, 같으면 false가 된다.
ex) 1 + 1 !== 2 --> false
1 + 1 !== 1 --> true
- <,> : 연산자 양측의 값의 대소를 비교한다.
ex) 1 > 2 --> false
1 < 2 --> true조건문 (if문)
조건문 (if문)이란?
= 조건에 따라 실행이 달라지는 명령문을 의미한다.
프로그램 내에 주어진 조건(표현식)의 결과에 따라 다른 방식으로 명령을 수행하도록 조작하는 도구다.// 조건문을 활용할 때는 'if'라는 문구를 사용하여 작성한다. 그래서 조건문을 'if문'이라고 부른다.
[조건문의 구조]
(1) (2) (3)
if (조건) {
수행할 행동 (=조건의 결과가 참일 때, 실행하고자 하는 실행문)
}
- (1) if : 조건문임을 표시하는 키워드
- (2) 조건 : 소괄호() 안에는 원하는 값을 실행하기 위한 조건(=표현식)을 넣어준다.
- (3) 실행문 : 중괄호{} 안에는 조건의 결과가 '참'일 경우 실행할 실행문을 넣어준다.
- 조건(표현식) : 값을 반환하는 식 또는 코드
- 참 : 표현식에서 설정한 조건의 결과가 일치한 경우
- 거짓 : 표현식에서 설정한 조건의 결과가 일치하지 않은 경우// 조건(표현식)의 결과가 참이면 행동을 수행하고, 거짓이면 아무런 행동을 취하지 않는다.
Ex) 농작물(crops)이 토마토일 경우, 토마토에 줘야 하는 물의 횟수를 10으로 반환하게 하라.
let crops = "토마토"; // (1) 우선 'crops'이라는 변수를 선언하고, 변수에 '토마토'를 할당한다.
if (crops === "토마토") { // (2) 조건문 () 안의 표현식이 crops === "토마토"라면 ('참'이라면),
return 10; // (3) 10을 반환한다.
}// 조건문 ( ) 안의 표현식이 crops === "토마토" 라면, 농작물이 토마토가 맞을 경우 { } 안에 작성된 코드가 실행된다.
// 조건문 ( ) 안의 표현식이 crops !== "토마토" 라면, 농작물이 토마토가 아닐 경우 { } 안에 작성된 코드가 실행된다.
else if
else if문 이란?
= 한 가지 상황을 두고 여러 가지 조건을 따져볼 수 있는 명령문을 의미한다.
if문의 표현식이 거짓이라면, 'else if'문의 표현식을 활용하여 다른 조건을 추가할 수 있다.Ex)
농작물이 토마토인 경우에는 줘야할 물의 횟수를 '10'으로 반환하고,
농작물이 토마토가 아닌 키위일 경우에는 줘야할 물의 횟수를 '5'로 반환하게 하라.
let crops = "키위"; // (1) 우선 'crops'이라는 변수를 선언하고, 변수에 '키위'를 할당한다.
if (crops === "토마토") { // (2) 조건문 () 안의 표현식이 crops === "토마토"라면 ('참'이라면),
return 10; // (3) 토마토에 줘야할 물의 횟수인 10을 반환하고,
} else if (crops === "키위") { // (4) crops가 토마토가 아닌 "키위"라면
return 5; // (5) 키위에 줘야할 물의 횟수인 5를 반환한다.
}// 현재 변수 crops에는 토마토가 아닌 "키위"가 할당되어 있으므로,
if문의 표현식은 거짓이 되고, else if문의 표현식으로 넘어간다.
이때, crops === "키위"의 결과값은 참이므로 '5'를 반환하게 된다.
else
else문 이란?
= 한 개의 표현식(조건)을 두고 조건이 참일 때와 거짓일 때
실행할 명령을 한꺼번에 전달하기 위해 사용하는 명령문이다. Ex)
농작물이 토마토도 키위도 아닐 경우에는 물의 횟수를 '3'으로 반환하게 하라.
let crops = "당근"; // (1) 우선 'crops'이라는 변수를 선언하고, 변수에 '당근'를 할당한다.
if (crops === "토마토") { // (2) 조건문 () 안의 표현식이 crops === "토마토"라면 ('참'이라면),
return 10; // (3) 토마토에 줘야할 물의 횟수인 10을 반환하고,
} else if (crops === "키위") { // (4) crops가 토마토가 아닌 "키위"라면
return 5; // (5) 키위에 줘야할 물의 횟수인 5를 반환하고,
} else { // (6) 농작물이 토마토나 키위가 아니라면
return 3; // (7) 다른 모든 농작물에 줘야 할 물의 횟수인 3을 반환한다.
} // 현재 변수 cropa에는 토마토도 키위도 아닌 "당근"이 할당되어 있다.
따라서 if문과 else if문의 표현식은 모두 거짓이 되고, else문으로 넘어간다.
else문은 if문과 else if문의 표현식에 '참이 되지 않는 모든 경우'에 실행되므로
crops가 "당근"에 할당된 경우는 토마토나 키위를 제외한 다른 모든 농작물에 줘야 할 물의 횟수인 '3'을 반환하게 된다.
<실습 1>
// 농장에 심은 씨앗에 물을 줘야합니다.
// 그런데 여기 어떤 작물을 심었더라...?
// 작물에 맞는 횟수의 물을 주기 위해서
// 조건문을 한번 짜 봅시다.
// 토마토는 10번, 키위는 5번, 그 외의 경우엔
// 3번의 물을 줘야 합니다.
// 1. 표현식 먼저 작성해봅시다. 토마토일 경우,
// 키위일 경우, 나머지일 경우를 if문,
// else if문, else문으로 분기하세요.
// 2. 실행문도 작성해봅시다. 조건에 해당할 경우
// 몇 번 물을 줄 것인지 숫자를 리턴해주세요.
// 👇 그럼, 여기서부터 코드를 작성해보세요 :)
//TODO..
function test(crops) {
if (crops === "토마토") {
return 10;
} else if (crops === "키위" ) {
return 5;
} else {
return 3;
}
}
export default test;
// 표현식 함수인 'let' 키워드로 선언하지 않고, 선언식 함수 'function'키워드로 변수를 선언했다.<결과물 1>
<실습 2>
// 작물의 싹을 성공적으로 틔웠군요!
// 그런데... 어떤 작물인지 적어 놓는걸
// 까먹어버린 행운이...!
// 작물에 맞는 종류의 비료를 주기 위해
// 조건문을 다시 한번 짜 봅시다.
// 토마토는 1번, 키위는 2번, 당근은 3번,
// 딸기는 4번 비료를 줘야합니다.
// 1. 조건문 먼저 작성해봅시다. 이번에도
// 작물별로 분기를 나눠주세요.
// 2. 실행문도 작성합시다. 조건에 해당할 경우
// 줄 비료 번호를 fertilizer 변수에 할당하세요.
// 👇 그럼, 여기서부터 코드를 작성해보세요 :)
function test(crop) {
let fertilizer;
if (crop === "토마토") {
fertilizer = 1;
} else if (crop === "키위") {
fertilizer = 2;
} else if (crop === "당근") {
fertilizer = 3;
} else {
fertilizer = 4;
}
return fertilizer;
}
export default test;
<결과물 2>
