본문 바로가기

JavaScript

14장 예제 - if문/if-else문/ 중첩된 if-else문 /Switch문

1. 3의 배수 확인하기(1)

 

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>3의 배수 확인하기 1</title>
</head>
<body>
  <script>
    var userNumber=prompt("숫자를 입력하세요.");

    if(userNumber%3===0) {
      alert("3의 배수입니다.");
    }
    else
    {
      alert("3의 배수가 아닙니다.");
    }

  </script>
</body>
</html>

 

2. 3의 배수 확인하기 (2)

 

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>3의 배수 확인하기 2</title>
</head>
<body>
  <script>
    var userNumber=prompt("숫자를 입력하하세요.");

    if(userNumber !== null)
    {
      if(userNumber % 3 ===0)
        alert("3의 배수입니다.");
      else
        alert("3의 배수가 아닙니다.");
    }
    else
      alert("입력이 취소됐습니다.");

  </script>
</body>
</html>

 

3. 조건연산자를 사용해 3의 배수 확인하기 

 - (조건)? true일때 실행할 명령 : false일때 실행할 명령

 

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>3의 배수 확인하기 2</title>
</head>
<body>
  <script>
   var userNumber=prompt("숫자를 입력하시오");

   if(userNumber !== null)
    (userNumber % 3 === 0) ? alert("3의 배수입니다.") : alert("3의 배수가 아닙니다.");
  else  
    alert("입력이 취소됐습니다.");
  </script>
</body>
</html>

 

4.  OR 연산자를 사용해 조건 체크하기 

 - OR연산자 기호: ||

 - 피연산자 2개 중에서 true가 하나라도 있으면 결괏값은 true

 - true가 될 확률이 높은 조건식을 첫 번째 조건식으로 사용하는 것이 좋음

 

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>3의 배수 확인하기 2</title>
</head>
<body>
  <script>
   var numberOne=prompt("50 미만인 숫자를 입력하시오");
   var numberTwo=prompt("50 미만인 숫자를 입력하시오");

   if(numberOne < 10 || numberTwo <10)
    alert("숫자 2개 중에서 최소한 하나는 10미만입니다.");
   else
    alert("숫자 2개 중에서 10 미만인 수가 없습니다.");
  </script>
</body>
</html>

 

 

5. AND 연산자를 사용해 조건 체크하기 

 - AND 연산자 기호: &&

 - 피연산자 2개 중에서 false가 하나라도 있으면 결괏값은 false가 됨

 - false가 될 확률이 높은 조건을 첫 번째 조건식으로 사용하는 것이 좋음

 

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>3의 배수 확인하기 2</title>
</head>
<body>
  <script>
   var numberOne=prompt("50 미만인 숫자를 입력하시오");
   var numberTwo=prompt("50 미만인 숫자를 입력하시오");

   if(numberOne < 50 && numberTwo <50)
    alert("숫자 2개 모두 50 미만이군요.");
   else
    alert("조건에 맞지 않는 숫자가 있습니다");
   
  </script>
</body>
</html>

 

6. switch 문으로 조건 체크하기 

 - switch (조건)

 {

    case 값 1: 명령 1

      break

 

    default : 명령 n

}

 

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>switch 문으로 조건 체크하기 </title>
  <style>
    body {
      background-color:#0c3268;
      color:rgb(243, 243, 243);
    }

    p {
      margin-top:80px;
      font-size:2em;
      font-weight:700;
      text-align:center;
      text-shadow:1px 2px 1px #000;
    }

    p strong {
      font-size:2.2em;
      color:yellow;
    }
  </style>
</head>
<body>
  <script>
   var session=prompt("관심 세션을 선택해 주세요. 1- 마케팅 2- 개발, 3- 디자인");

   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;

   }
  </script>
</body>
</html>

'JavaScript' 카테고리의 다른 글

14장 for 문/ while 문  (0) 2023.04.06
14장 실습 2  (0) 2023.04.05
14장 실습  (0) 2023.04.05
13장 예제- 간단한 입출력 방법  (0) 2023.04.04
13장 예제 - 내부 자바스크립트 사용하기 /외부 스크립트 사용하기  (0) 2023.04.04