조건문 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...등을 쓰지 못하는 경우가 있기 때문에)
(조건) ? 참(참일때 실행) : 거짓(거짓일 때 실행할 내용) ;
단점 : 조건의 결과가 두개만 있을 때만 사용 가능하다.
* 예제 *
위의 색깔 바꾸는 박스 예제를 삼항조건식으로 나타냈을 때
'프론트엔드 > JavaScript' 카테고리의 다른 글
<JavaScript> 반복문 for (0) | 2017.08.01 |
---|---|
<JavaScript> document.write(); (0) | 2017.07.31 |
<Javascript> 다른 내용 작성하는데 HTML과 JS 둘다 주석처리하기 귀찮을 때 쓰기 좋은 방법 (0) | 2017.07.28 |
<Javascript> 조건문 if 예제2. 회원가입 화면 ( 예외처리 ) (0) | 2017.07.28 |
<Javascript> 조건문 if 예제1. 자판기 만들기 (0) | 2017.07.28 |