조건문
조건문은 특정한 조건에 따라 코드 진행을 달리하는 분기처리를 하는 문법으로, Javascript에서는 if문과 switch문을 많이 사용하며, 논리 연산자와 삼항 연산자로도 사용이 가능하다.
조건문 if문
if문은 소괄호 안의 조건식이 참이 될 때, 중괄호 안의 코드를 실행 시킨다.
const age = 21
if(age >= 20){
console.log("성인 입니다.")
}
// 성인 입니다.
조건문 if else문
단순하게 나이가 20살 이상일 때뿐만 아니라 20살이 아닐 때라는 분기처리를 희망하면 else를 아래와 같이 사용한다.
if문의 모든 조건들의 해당되지 않는 나머지 경우의 수일 때 else 중괄호 안의 식이 실행이 된다.
const age = 18
if(age >= 20){
console.log("성인 입니다.")
} else {
console.log("미성년자 입니다.")
}
// 미성년자 입니다.
조건문 else if 문
성인과 미성년자가 아닌 어린이와 청소년, 성인일 경우로 나누고 싶을 경우는 else if를 사용하여 if문을 한 번 더 사용한다.
주의해야할 점은 위의 조건부터 검사를 하기에, 논리적으로 순서를 생각하면서 작성하는 것이 좋다.
const age = 5
if(age < 8){
console.log("어린이 입니다.")
} else if(age < 20) {
console.log("청소년 입니다.")
} else {
console.log("성인 입니다.")
}
// 어린이 입니다.
논리 연산자를 이용한 조건문
논리 연산자 &&(AND)를 활용하면 왼쪽이 true일 경우 오른 쪽도 true를 만드는 특징이 있기에, if문을 논리 연산자 &&(AND)를 사용하여 한 줄로 깔끔하게 작성도 가능하다.
const age = 21
if(age >= 20){
console.log("성인 입니다.")
}
// 성인 입니다.
age >= 20 && console.log("성인 입니다.")
// 성인 입니다.
논리 연산자 ||(OR)를 이용해 아래와 같이 아닐 경우의 조건식도 작성이 가능하다.
const age = 19
age >= 20 || console.log('미성년자 입니다.')
// 미성년자 입니다.
3항 연산자를 이용한 조건문
3항 연산자를 이용하면, 간단한 if else문을 삼항 연산자로 코드를 작성하게 할 수도 있다.
const age = 18
if(age >= 20){
console.log("성인 입니다.")
} else {
console.log("미성년자 입니다.")
}
// 미성년자 입니다.
age >= 20 ? console.log("성인 입니다.") : console.log("미성년자 입니다.")
// 미성년자 입니다.
조건문 switch
많은 경우의 수가 있을 때 else if를 많이 사용하는 것은 가독성이 떨어지기에, switch문을 작성하여 좀 더 가독성을 높인다.
const food = '사과'
switch (food) {
case '사과':
log('사과가 맛있어!')
break
case '바나나':
log('바나나 맛있어!')
break
default:
log('전부다 맛있어!')
break
}
// 사과가 맛있어!
함수에서의 반복문
f1과 f2는 모두 숫자 a, b를 받아서 차리를 반환하는 함수이며, if문을 사용하여 작성하지만, else를 사용하면 코드가 길어지고 가독성이 떨어진다.
따라서 return을 만나면 함수가 끝난다는 특징을 이용하여 else를 작성하지 않고 if문만 작성한다.
const f1 = (a, b) => {
if (a > b) {
return a - b
} else {
return b - a
}
}
log(f1(5,2))
// 3
const f2 = (a, b) => {
if (a > b) return a - b
return b - a
}
log(f2(5, 2))
// 3
'F.E > JavaScript' 카테고리의 다른 글
window의 location에 대해 알아보자 (0) | 2023.11.05 |
---|---|
[Javascript] 반복문 - for, for each, for in, for of (0) | 2022.10.03 |
[JavaScript] Hoisting (0) | 2022.09.01 |
[JavaScript] Event Loop (0) | 2022.09.01 |
[JavaScript] JSDoc으로 함수 쉽게 사용하기. (0) | 2022.08.26 |