<Javascript> 조건문 (switch ... case & 삼항조건문 )
조건문 switch .. case
: 가독성이 높은 조건문
switch (값) {
case A:
값이 A일 경우 실행
break;
case B:
값이 B일 경우 실행
break;
case C:
값이 C일 경우 실행
break;
case D:
값이 D일 경우 실행
break;
default :
값이 A, B, ,C, D 다 아닌 경우 실행
}
* break : 더이상 아래로 내려가지 않고 switch문 자체를 빠져나가게 한다.
if 문과 switch-case문
( switch-case문의 사용 )
입력한 색 대로 박스의 배경색이 바뀌는 프로그램.
* 기능 *
- 색깔을 입력받는다
- 선택 버튼을 누르면 입력한 내용이 console에 찍힌다
- 빨간색, 파란색, 초록색일 경우 해당하는 색으로 배경색이 바뀐다
- 다른색일경우 하얀색으로 바뀐다.
<화면>
<HTML>
<CSS>
<if문으로 작성한 js>
- 자주 쓰는 것 변수로 만들기
- 버튼을 선택했을 경우 실행할 코드 작성 (실제 동작)
-변수 color에 입력한 색 대입하기
- console에 입력한 값 쓰기
-
if문 :
색이 빨간색, 파란색, 초록색이라면 해당 색으로 배경 바꾸고 나머지는 하얀색으로 바꾼다.
- 세가지 색 외의 다른 색을 입력했을 경우.
<위의 if를 이용한 식을 switch-case로 나타냈을 때>
삼항조건식
(react때문에 많이 쓴다. react에서 if...등을 쓰지 못하는 경우가 있기 때문에)
(조건) ? 참(참일때 실행) : 거짓(거짓일 때 실행할 내용) ;
단점 : 조건의 결과가 두개만 있을 때만 사용 가능하다.
* 예제 *
위의 색깔 바꾸는 박스 예제를 삼항조건식으로 나타냈을 때