04. React.JS 기초 - IF구문과 Swithc구문

자바스크립트에서 조건문에 사용되는 IF 구문과 Switch 구문에 대해서 알아보는 시간이다. 

조건문은 연산 결과의 참 거짓에 따라 서로 다른 명령을 수행 할 수 있는 문법을 실행할 수 있다.


if 구문의 경우 조건이 2개인경우 if / else 를 사용해서 조건문을 작성할 수 있으며,

3개 이상인 경우 if / esle if / else를 사용해서 다중 조건문을 작성할 수 있다. 

(else if는 파이썬 elif 와 동일한것으로 기억한다.)


우선 IF 구문에 대해서 알아보면

a라는 변수가 5이상이면 [5이상입니다. ] 를 출력하고 5미만인경우 [5 미만입니다.] 라는 출력을 하라는 조건이라고 가정했을 때 

코드는 다음과 같이 작성하면 된다. 


만일 a가 4라고 가정하면 


이렇게 나온다.


여기서 조건이 5이상, 3이상, 3미만 이렇게 주어져야하는 경우에는 위에서 언급한것처럼 else if를 사용한다. 

 a가 5인경우 출력 결과

 a가 3인경우 출력결과

a가 2인 경우 출력 결과

switch 구문은 else if 가 너무 많아서 불필요하게 코드가 길어지는 경우 대체할 수 있는 구문으로 알고 있는데 얼핏들은바로는 switch는 잘 쓰지 않는다고 듣기는 했다. 

switch 구문은 if 구문과 다르게 case, break를 사용하여 코드를 작성한다. 

country라는 변수의 값이 각 지정된 국가코드와 같으면 해당 코드를 노출하는 것을 if 구문을 이용해서 작성하면  아래와 같다


하지만 switch 구문을 사용하면 아래와 같이 작성할 수 있다.


아주 약간 깔끔해보기인 하는 느낌적 느낌

여기서 주의할 점은 break를 꼭 써줘야 한다고 한다.

만일 break를 걸지 않은 경우 해당 코드 아래로도 다같이 출력된다.

그리고 default는 if 구문의 else에 해당하는 것으로 case에서 선언되지 않은 값의 경우 모드 default로 설정되어 해당 값이 노출된다고한다. 


이것으로 if 및 switch 구문을 알아보았다.



댓글