데이터 효과 기초 공부하기

여러가지 데이터 이펙트

📝1부터 100까지 출력하기

for(let i=1; i<=100; i++){ 

    console.log(i)
    }

풀이

 

for문으로 i가 1부터 100보다 작거나 같을때까지 반복적으로 숫자를 출력합니다

 

📝0부터 50까지 출력하기

    for(let i=0; i<=50; i++){ 
    
    console.log(i)
    }

풀이

위와 같은 방법으로 숫자만 달라져서 출력합니다. for문의 출력순서는 i=0, i<=50, console.log(i), i++ 입니다.

 

📝1부터 100까지 짝수만 출력하기

for(let i=2; i <=100; i+=2){

    console.log(i)
    }

풀이

i=2가 100보다 작기때문에 true값으로 console.log에 나타난 후 i에 2를 더한값(i+=2)이 반복적으로 나오기때문에 2,4,6,8,10~~100까지 짝수값이 출력됩니다.

 

📝1부터 100까지 5의 배수만 출력하기

 for(let i=5; i <=100; i+=5){

     console.log(i)
  }
    
 for(let i=1; i <=100; i++){
        if( i % 5 == 0 ){
     console.log(i)
        }
  }

풀이

 첫번째 for문은 i+=5값을 주는 방법으로 두번째 for문에서는 if문을 사용하여 5의 배수값을 출력해 줍니다.

  if( i를 5로 나누어주었을 때 나머지가 0인 값을 출력)

 

📝1부터 100까지 짝수는 파란색, 홀수는 빨간색으로 출력하기

 for(let i=1; i <=100; i++){
        if(i % 2 == 0){
          document.write("<span style='color:blue'>"+i+"</span>");
        }
        if(i % 2 == 1){
          document.write("<span style='color:red'>"+i+"</span>");
        }
    }

풀이

for문과 if문을 이용한 방법으로 i를 2로 나눴을때 남은 값이 0은 짝수( i % 2 == 0) 1이 남을경우 홀수(i % 2 == 1)를 지정한 후 style 태그를 넣기 위해 무색무취인 span 태그를 i 에 준 후  document.write 로 웹에 결과값을 나타내어 줍니다.

 

📝for문을 이용한 100칸 테이블 만들기

 let table = "<table border=1>";

 for(let i=1; i<=10;i++){
     table +="<tr>"

     for(let j=1; j<=10; j++){
     table +="<td>"+j+"</td>";
     }
    table +="</tr>";
 }

 table +="</table>",

 document.write(table);

 

풀이

테이블에 border값을 주어 선을 만들어줍니다. <tr></tr>(열)에 10줄값을 for문으로 넣고 그 사이에, <td></td>(행)로 10칸 값을 넣어줍니다. 

 

결과값

📝중첩 for문을 이용한 구구단 만들기

for(let i=2; i<=9; i++){
        document.write(i +"단","<br>");

        for(let j=1; j<=9; j++){
            document.write(i +"*"+ j + "=" + i*j);
            document.write("<br>");
        }
        document.write("<br><br>");
    }

풀이

첫 번째 for문에서 2단부터 9단의 제목을 붙여주기 위해 i값에 문자열 "단"을 붙이고 가독성을 위해 <br>태그를 주어 한줄 뛰어 줍니다.

두 번째 for문으로 i + * +  j = i*j 값이 나오도록 입력합니다.