[자바스크립트 기초] if | else 조건문

오늘은 if , else 조건문을 사용하는 방법을 알아보겠습니다. 

 

if 기본 형태

const age = 19;
const isOldEnough = age >= 18; 

// if 조건문에서는 () 즉 소괄호 안에 boolean 값이 True 일때 {} 중괄호 안에 값을 실행 하라는 뜻이다. 
if (isOldEnough) {
    console.log('Sarah can start driving license ')
}

output :

if () 소괄호 안에 boolean 값 , 즉, True or False 인 값을 집어넣습니다.

이번 코드에서는 애초에 boolean 값을 isOldEnough 라는 변수에 넣어보았는데요!

age >= 18 보다 큰지 작은지를 True or False로 값을 내뱉겠죠.

여기서 우리가 지정한 age의 값은 19 즉 18보다 크니까 isOldEnough = True가 되겠네요.

 

()소괄호 안이 True 가되면  {} 중괄호 안, 즉 코드블럭이라 불리는 안쪽에 코드가 실행이 됩니다. 

위 예제 코드에서는 isOldEnough 가 True이니까 코드가 실행되는 것을 알 수가있네요.

 

일반적으로는 boolean value를 하나의 변수를 담아 () 안에 담기보다 아래 코드와 같이 다이렉트로 넣어서 쓰는 경우가 더 많으니 참고하세요!

if (age >= 18) {
    console.log('Sarah can start driving license ')
}

 

제가 위에서 잠깐 언급했듯이 , () 소괄호 안이 True일경우에만 코드를 실행 할 수있습니다. 

그렇다면 false일 경우 특정 코드를 실행하려면 어떻게 해야 할까요?

 

바로 else를 사용해주면 됩니다.!

else

else 에 위치는 앞선 if 절 {} 중괄호가 끝나는 점 바로 뒤에 적어주면 됩니다. 

const age = 15;
if (age >= 18) {
    console.log('Sarah can start driving license ') 
} else {
    const yearsLeft = 18 - age;
    console.log(`Sarah is too young. Wait another ${yearsLeft} years :)`)
}

output :

이번에는 age가 15로 if 절 소괄호 조건이 False가 됩니다. 그렇기 때문에 if 절 블록코드는 실행이 안됩니다. 

대신 else 블록코드가 실행이 되는데요!

 

yearLeft라는 변수를 이용해서 간단한 연산을 실행한 코드를 만들어보았습니다. 

console.log()에 `(백틱)을 이용하여 문자열에 변수를 추가했습니다.

(백틱 사용법이 낯서신 분들은 해당 포스트 참조바랍니다.)

 

조건절내 변수를 정의할경우 주의해야할점

아래코드는 태어난 년도를 기준으로 몇세기에 태어난 사람인지 구현한 간단한 코드인데요.

조건절 블록크드 내에서 새롭게 변수를 정의한 형태입니다. 

const birthYear = 1998;

if (birthYear <=2000) {
    let century = 20;    
} else {
    let century = 21;
}
console.log(century); 

output :

하지만 Uncaught ReferenceError 라는 에러가 발생합니다.

왜 이런 에러가 발생할까요?

왜냐하면 조건문 안에서 변수를 지정한것이 조건문 바깥쪽에는 영향을 안끼치기 때문입니다. 

즉 조건문 안에는 변수는 조건문 안에서만 사용가능하다는 뜻이지요.

 

그렇다면 어떻게 해야할까요?

const birthYear = 1998;

let century; 
console.log(typeof century)
if (birthYear <=2000) {
    century = 20;    
} else {
    century = 21;
}
console.log(century); 

output :

위와 같이 함수 바깥에서 값을 지정하지 않은채 변수만 정의(undefined 형태)해줍니다.

함수 코드블럭 바깥에서 정의한 변수는 함수 내에도 적용이 가능하다는 특징을 이용해주는 것이지요.

 

output도 우리가 예상한대로 잘 나오는 것을 알 수 있습니다.