자바스크립트 switch~case 예제


▣ Javascript switch~case 예제


■ 이번 글에서는 자바스크립트의 조건문 중에서 switch~case 문에 대해서 알아보겠습니다. switch 문은 입력한 변수값이 특정 상수값과 같으면 그에 해당하는 문장을 실행하고, 변수가 case(상수)와 일치하는 게 없으면 default 다음의 문장을 실행하는 형태인데요. switch~case 문의 형식은 다음과 같습니다. 



■ 변수로 입력한 값이 상수1과 같으면 문장1을 실행하고, 상수2와 같으면 문장 2를 상수1, 2에 해당하지 않을 때는 문장3을 실행하게 되는 형태인데요. 여기서 문장1이나 문장2를 실행하고 break를 만나게 되면 switch~case 문을 빠져나가게 됩니다. 상수1에 해당하는 변수를 입력했는데, 문장 1뒤에 break 문이 없으면 문장1을 실행하고 나서 문장 2까지 실행하게 되므로 꼭 break를 넣어줘야 합니다. 상수에 해당하는 값이 아닐 경우는 default 다음의 문장3을 실행하는데 이때는 break 문을 입력하지 않아도 됩니다. 




 위 형식을 생각하면서 예제를 만들어 보겠습니다. 



■ 메모장에 다음과 같은 html 문서를 작성해봤습니다. [aaa]라는 변수에 1~3까지 입력받고, 입력받은 변수에 따라서 각각의 'case문'을 실행하고 break를 만나서 switch문을 빠져나가게 되며......1~3 이외의 수를 입력하게 되면 default문 다음의 "잘못 선택하셨습니다"문이 실행 될 것입니다. 브라우저에서 열어서 숫자를 입력해보겠습니다. 






■ 인터넷 익스플로러에서 실행하면 그림처럼 prompt 입력 창이 뜨게 되고, 번호를 선택하라는 문장이 보이는데요. 2를 입력해보겠습니다. case "2" : "안드로이드를 선택하셨군요" 라는 문장이 출력되겠죠? 






■ 이렇게 cased"2"에 해당하는 문장이 실행되고, break문을 만나서 switch문을 빠져나오게 됩니다. 만약에 break문이 없다면 case"3"실행 되고, 그 뒤에도 break가 없다면 default 문장까지 실행되고 멈추게 될 것입니다. 꼭 break를 입력해 줘야 해요.^^




 마지막 default 다음에는 break 없어도 되는 거 아시죠? 1~3 외의 숫자를 입력해서 제대로 default 다음 문장이 실행되는지 살펴보고 마무리할게요. 



■ 5를 입력해봤습니다. 당연히 default "다음 문장인 잘못 선택했습니다."이 출력될것 입니다. 





■ 이렇게 해서 switch~case 문에 대해서 알아봤습니다. 수고하셨어요.