[수업 6월 2주 4일차] Javascript-4

김유민·2022년 6월 10일
0

대구 A.I. 스쿨

목록 보기
40/90

1. 학습내용

while문과 for 중첩문을 배워보았다.
while문은 조건이 충족될때 까지 반복되고, for문은 조건문이 맞고, 반복회수까지 반복하는 것을 말한다.

   let i = 0;
      while(true){
         alert(`$[i]번째 반복문입니다.`);
         i = i+1;
      }

()안에 조건문에 해당하면 ture가 되어 반복문이 진행되고, false가 되면 반복문이 진행되지 않는다.
i = i+1; 식이 없다면 구문오류가 나거나, 값이 alert로 넘어가지 않는다.

let i = 0;
      const array = [1,2,3,4,5,6,7];
      while(i < array.length){
         alert(`$[i]번째 반복문입니다.`);
         console.log(array[i]);
         i = i+1;
      }

7번째까지 alert가 진행되고 1~7까지 console.log에 기록된다.
이 반복문은 break문으로 중단 시킬 수 있고, continue문은 continue문 다음에 오는 코드는 무시하고, 바로 조건식으로 이동해 조건 검사를 실행한다.
(continue문은 잘 쓰진 않는다고 한다)

코드를 입력하세요

몇가지를 더해야 될지 모를때 반복문을 쓰고, 조건문으로 맞을때 까지 진행해 준다.

    for (let j = 0; j<10 ; j++){
         alert(`${j}번째 반복문`);
         const tf= confirm("그만두시겠습니까?");
         if(tf){
            break;
         } 
      }

'그만두시겠습니까?'에 취소를 누르면 반복문은 if문에 트루값으로 들어가서 break가 된다.
(!tf)는 false값이 된다.

 for (let j = 0; j<10 ; j++){
         alert(`${j}번째 반복문`);
         continue;
         const tf= confirm("그만두시겠습니까?");
         if(tf){
            break;
         } 
      }

continue를 쓰면 아랫 코드를 무시하므로, alert창만 조건문에 맞을때까지 반복된다.

    let result= "";
      for(let i=1; i<10; i++){
         for(a=0;a<i;a++){
            result += "*";
         }
         result += "<br>"
      } document.write(result);

for 중첩문을 이용해 '*'을 찍어 만드는 것..

위와 같이 나온다.

      y=x+5;
      x=5; y=10;
      const f = function(x){
         y = x+5;
      }
      f(5);

함수에 대해 또 이어서 진도를 나갔다.
프로시저 함수라고 하는데, 단순 함수를 적어 호출을 하는 걸 말한다.

  let limit = 10;
const f = function (){
         let result = 0;
         for(let i =1; i< limit; i++){
            result = result+j;
         }
         console.log(j);
      }

      limit = 20
      f()  <- 1번
      
        const fk =function(x){
         let result
         for(let i=1;i<x;i++){
            result = result + 1
         }
         return result;
      }
      console.log(fk(5));  <- 2번

1번은 일반 함수고, 2번은 매개변수 함수다. 1번은 변수 조건이 바뀔때 마다 출력되는데, 그럼 변수 데이터를 계속 추가해야 한다. 반면 매개변수는 함수명()에서 괄호 안의 있는 값만 바꾸면 되기때문에 훨씬 간편하다. 여기서 fk에 있는 5라는 값이 function에 x로 들어 간다.

2. 어려웠던 점 및 해결방안

for중첩문이 어려워서 잘 이해가 가질 않았다.
그래서 따로 구글링 해서 찾아 보기로 했다.

    let result= "";
      for(let i=1; i<10; i++){
         for(a=0;a<i;a++){
            result += "*";
         }
         result += "<br>"
      } document.write(result);
  1. 이 식에서, 변수로 result란 값을 선언해 데이터가 들어갈 빈 공간을 만들어 준다.
  2. 그런다음, 첫번째 for문의 조건식에서 i가 1이고 10보다 작기 때문에 조건에 해당해서
    아래 for문으로 들어가게 된다.(이때 1이 증감되어 변수 i에 2가 저장됨. 저장만 되어 있는 상태임.)
  3. 아래 for문에서 a=0이고, 1보다 작기때문에 a가 실행되고 1이 증감된 채로 a변수에 일단 1이 저장이 된다.
  4. 그럼 for문 둘다 조건에 해당하므로 result를 실행하고 처음에 result값이 없으니 그냥 ''이 하나만 출력되고, 바깥 처음 result값을 실행해 ' +
    '이라고 해서 줄바꿈을 해준다.

그럼 별이 하나만 일단 출력되어 첫째줄을 완성하고, 다시 for문으로 돌아가서 증감된 2가 또 조건을 검색해 조건에 해당하면 아래 for문으로 들어가고 증감된 3이 i에 저장이된다.

아래 for문에 저장된 1을 비교해 1<2이므로, a에 증감되어 2가 저장이 된 상태로 아래 result에 넘어가 result에 별이 하나 저장되어 있으니 그거 + 별을 하면 별이 총 두개가 출력되어
for문 바깥으로 넘어가 줄을 바꾼채 둘째 줄을 완성한다.

이런식으로 반복되어 result값에 저장된 변수를 최종적으로 for문이 끝나면 document.write로 사용자에게 보여 주게 된다.

이걸 응용한 예제가 아래와 같다.

3. 학습 소감

반복문을 이어서 했는데, 아직 앞선 내용이 이해가 덜된 상태에서 들으니 좀 어렵긴 했다.
어려웠던 점에 대해 스스로 해보라 하셨는데 뭘 처야 되는건지 하나도 몰랐다.
결국 강사님의 예시를 보며 억지로 이해했는데, 좀더 차근히 복습을 해봐야 할거 같았다..

profile
친숙한 개발자가 되고픈 사람

0개의 댓글