JAVASCRIPT

[JAVASCRIPT ] for문

Arr_ 2021. 10. 29. 15:53
  • for문
  <body>
    <p id="demo"></p>
    <script>
      let text = "";
      for (var i = 0; i < 10; i++) {
        text += i + "<br>"; //0<br>1<br>2<br>...9<br>
      }
      //for문으로 나온 결과를 html 형식으로 화면에 출력하기
      document.getElementById("demo").innerHTML = text;
    </script>
  </body>

 

  • 배열 출력하기
  <body>
    <p id="demo"></p>
    <script>
      const cars = ["BMW", "Volvo", "Sabb", "Ford", "Audi"];

      let text = "";
      for (let i = 0; i < cars.length; i++) {
        text += cars[i] + "<br>";
      }
      document.getElementById("demo").innerHTML = text;
    </script>
  </body>

 

  • in을 이용한 for문 배열 출력
  <body>
    <p id="demo"></p>
    <script>
      const cars = ["BMW", "Volvo", "Sabb", "Ford", "Audi"];

      let text = "";

      //향상된 for문과 비슷한 개념
      for (let car in cars) {
        text += cars[car] + "<br>";
      }
      document.getElementById("demo").innerHTML = text;
    </script>
  </body>

- 변수 car가 인덱스를 가지고 있어서 car를 넣고 출력하면 됨

 

 

  • of를 이용한 for문 배열 출력
  <body>
    <p id="demo"></p>
    <script>
      const cars = ["BMW", "Volvo", "Sabb", "Ford", "Audi"];

      let text = "";
     
     //향상된 for문과 비슷한 개념
      for (let car of cars) {
        text += car + "<br>"; 
      }
      document.getElementById("demo").innerHTML = text;
    </script>
  </body>

- 변수 car만 찍어내면 됨

 

 

  <body>
    <p id="demo"></p>
    <script>
      const cars = "BMWVolvoSabbFordAudi";

      let text = "";

      for (let car of cars) {
        text += car + "<br>";
      }
      document.getElementById("demo").innerHTML = text;
    </script>
  </body>

- of를 사용하는 경우 문자열에서 하나씩 가져오게 하는 것도 가능함

 

 

 

  • for문을 이용하여 최대값, 최소값 구하기

 

1. 일반 for문 작성방법

  <body>
    <script>
 	  let numArr = [52, 273, 586, 32, 57, 103, 312, 2];
       let min = 999,
        max = 0;
        
      for (var i = 0; i < numArr.length; i++) {
        if (max < numArr[i]) max = numArr[i];
        if (min > numArr[i]) min = numArr[i];
      }
      
      document.write("최대값" + max + "<br>");
      document.write("최소값" + min + "<br>");
    </script>
  </body>

 

 

2. in을 이용한 for문 작성방법

  <body>
    <script>
      let numArr = [52, 273, 586, 32, 57, 103, 312, 2];
      let min = 999,
        max = 0;

        for (var i in numArr) {
          if (max < numArr[i]) max = numArr[i];
          if (min > numArr[i]) min = numArr[i];
        }
        
      document.write("최대값" + max + "<br>");
      document.write("최소값" + min + "<br>");
    </script>
  </body>

 

 

3. of를 이용한 for문 작성방법

<body>
    <script>
      let numArr = [52, 273, 586, 32, 57, 103, 312, 2];
      let min = 999,
        max = 0;

      for (var num of numArr) {
        if (max < num) max = num;
        if (min > num) min = num;
      }
      
      document.write("최대값" + max + "<br>");
      document.write("최소값" + min + "<br>");
    </script>
  </body>

 

- 변수 num 자체가 배열에 있는 숫자를 가지고 있기 때문에 따로 인덱스 필요없이 변수 자체를 이용하여 비교함