이번 게시물에서는 if문과 switch문의 이해를 돕기 위해
벨로그의 유용한 기능인 코드 따로 묶어놓기? 의 기능을 사용해서 적어놓앗따
그럼 스따트~!
var input = prompt("이름을 입력하세요. ");
if(input) {
alert ("이름을 입력했습니다 : "+ input)
} else {
alert ("이름을 입력하지 않았습니다. ");
}- 지금 보이는 코드처럼 함수를 지정후
if (원하는 변수의 이름) {
원하는 출력값을 설정
} else {
원하는 출력값을 설정
}
이라는 식으로 만들수 있다.
그 외에도
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>3의 배수인지 확인</title>
<link rel="stylesheet" href="css/multi3.css">
</head>
<body>
<div id="result"></div>
<script>
var userNumber = prompt("숫자를 입력하세요.");
var displayArea = document.querySelector('#result');
if 📌1-1 (userNumber != null){
if 📌2-1 (userNumber % 3 === 0) {
displayArea.innerHTML = userNumber + "은 3의 배수입니닷. ";
} else 📌2-2 {
displayArea.innerHTML = userNumber + "은 3의 배수가 아닙니닷. ";
}
} else 📌1-2 {
alert ("입력이 취소되었습니다. ");
}
</script>
</body>
</html>📌에 표시해 놓은것처럼 if 안에 if문을 하나더 추가해서 복합적인 형태의 if문도 가능하다
* switch 문의 이해
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>세션 선택</title>
<link rel="stylesheet" href="css/switch.css">
</head>
<body>
<script>
var session = prompt("관심 세션을 선택해 주세요. 1-마케팅, 2-개발, 3-디자인", "1");
switch(session) {
case "1" : document.write ("<p>마케팅 세션은 <strong>201호</strong> 에서 진행됩니다.</p>");
break;
case "2" : document.write ("<p>개발 세션은 <strong>203호</strong> 에서 진행됩니다.</p>");
break;
case "3" : document.write ("<p>디자인 세션은 <strong>205호</strong> 에서 진행됩니다.</p>");
break;
default: alert ("잘못 입력했습니다.");
}
</script>
</body>
</html>위의 코드는 내가 수강하는 클래스의 강의실이 어딘지 찾는 코드이다
지금처럼 switch 명령어를 이용하여 여러개의 if문을 만들 수 있따
정확히 말하면 여러개의 if문 보다는 if else 를 연발하는 작성자도 힘들고 보는사람도 힘든
코드가 아니라 조금은 더 보기 편하게 사용한 코드식이 되겟다.
삽질도 100번 하면 요령이 생긴다. 부족한 건 경험으로 채우는 개발자