4. 조건문과 반복

조건문

조건식이 true or false인 값을 반환하는지

 

1. if & if-else

- 형태 :   if (조건식) {

                     ture일때 실행될 코드

                 }

 

- 중괄호 내의 코드가 한줄이라면 중괄호 생략 가능

   : if (조건식) console.log('중괄호를 생략했습니다.');

 

-  조건이 false인 경우 형태

     if (조건식) {

           true일때 실행될 코드

        } else {

           foalse일때 실행될 코드

        } 

 

- 삼항연산자 = if-else를 간단하게 표현한 형태

      조건식 ? 조건식이 참일 때 실행될 코드 : 조건식이 거짓일 때 실행될 코드

      (하지만, 삼항연산자는 조건이 많아 질수록 가독성이 떨어져 주의)

 

2. switch

- 형태 :   switch (표현식) {

                     case 값1:
                          값1에 대한 실행 코드

                          break;

                     case 값2:
                          값2에 대한 실행 코드
                          break;
                     ~~~~
                     default:
                          모든 case에 해당하지 않을 때 실행될 코
                          break;

                 }

 

- 표현식 : case의 값과 비교할 변수

                표현식==case => case의 실행 코드 실행

                모든 표현식=!=case => default의 실행 코드 실행

 

-  특징

• switch 뒤에 오는 표현식들의 값에 따라 case를 찾아 떠난다.
• 코드 실행 뒤, break에 의해 조건문 종료
• 표현식 =!= case 라면 default문으로 이동
• default는 필수사항!
• 일치 시에만 코드가 실행 될것을 케이스로 명확히 구분하고 있어 if문에 비해 가독성이 좋다.

 

반복문

같은 조건을 여러가지 입력하는 단순작업 시에 복붙하지 않도록 해주는 것

 

1. for

- 가장 널리 사용

 

- 구성 : 초기화식 - 변수 선언

            조건식 - true of false에 따라 실행 여부를 판단

            증감식 - 실행문 이후 변수의 증감

 

- 형태 : for (초기화식; 조건식; 증감식) {

                   실행문;

               }

 

- 이미 변수가 선언 돼있다면 초기화식을 생략하고 작성 가능

   let i = 0;

   for (; i < 7; i++) {

         console.log('count: ' + i)     }    ➡️  0~6까지 작성 된다.

 

- 조건식 또한 생략 가능 하나,

  이 경우 무조건 true로 평가 되므로 무한 반복 된다.

  그러므로 실행문 안에 별도의 조건문을 넣어 주어야 한다.

  break; 를 통해 무한 반복에서 나올 수 있다.

  for (let i = 0; ; i++) {                                                      ➡️  0~6까지는 + '살은 초등학생입니다.'

        if (i > 7) { console.log(i + '살은 초등학생입다.')  }         그외는 flase 이므로 종료
        if (i >= 13) break;    }                                                     13이상은 반복 실행이 되니 break로 종료시켜 준다.

 

- 예시를 보기전 산술 연산자 구경

+	더하기	두 개의 숫자를 더합니다.	6 + 9
-	빼기	왼쪽에 있는 수를 오른쪽 수로 뺍니다.	20 - 15
*	곱하기	두 개의 숫자를 곱합니다.	3 * 7
/	나누기	왼쪽의 숫자를 오른쪽 숫자로 나눠서 몫을 구합니다.	10 / 5
%	나머지 (또는 모듈로)	왼쪽의 숫자를 오른쪽 숫자로 나눠서 나머지를 구합니다.	8 % 3 ( 2를 반환합니다, 8을 3으로 나눴을 때 몫이 2이기 때문입니다.)
**	지수	왼쪽의 숫자를 오른쪽 숫자만큼 제곱합니다.	5 ** 2 ( 5의 제곱이기 때문에 25를 반환합니다.)

 

+=	더하기 대입	오른쪽의 값을 왼쪽 변수 값에 더하고 새 변수 값을 반환합니다.	x += 4;	x = x + 4;
-=	빼기 대입	오른쪽의 값을 왼쪽 변수 값에서 빼고 새 변수 값을 반환합니다.	x -= 3;	x = x - 3;
*=	곱하기 대입	오른쪽의 값을 왼쪽 변수 값에 곱하고 새 변수 값을 반환합니다.	x *= 3;	x = x * 3;
/=	나누기 대입	오른쪽의 값을 왼쪽 변수 값에 나누고 새 변수 값을 반환합니다.	x /= 5;	x = x / 5;

 

===	일치 연산자	왼쪽과 오른쪽의 값이 완전히 동일한지 테스트합니다.	5 === 2 + 4
!==	불일치 연산자	왼쪽과 오른쪽 값이 서로 동일하지 않은지 테스트합니다.	5 !== 2 + 3
<	~보다 작음	왼쪽 값이 오른쪽 값보다 작은지 테스트합니다.	10 < 6
>	~보다 큼	왼쪽 값이 오른쪽 값보다 큰지 테스트합니다.	10 > 20
<=	~보다 작거나 같음	왼쪽 값이 오른쪽 값보다 작거나 같은지 여부를 테스트합니다.	3 <= 2
>=	~보다 크거나 같음	왼쪽 값이 오른쪽 값보다 크거나 같은지 여부를 테스트합니다.	5 >= 4

 

- 다양한 예시

• 반복문
  for (var i=0; i<10; i++) {
          document.write(i, '<br>'); }
  var i = 0으로 시작 변수를 선언해 준것이고
  i의 크기가 10보다 작을 때 까지만, 즉 9까지만
  i++ i를 1개씩 추가해 준다   ➡️ i가 9가 될때 까지 <br>태그에 숫자 삽입
• 1부터 100까지 짝수
  for (var i = 0; i < 101; i+=2) {
           document.write(i, '<br>');     }  ➡️ i = i+2이므로 짝수가 된다. 그럼 0~99중 짝수를 <br>태그에 삽입
• 평균 구하기
  var value = [100, 200, 50, 400, 900];
  function average(value) {                          ➡️ 먼저 for문은 value의 글자길이 5보다 작은 값만큼
             var sum = 0;                                         즉 4번간 속성값을 더한 값이 나오고
             for(var i=0; i<value.length; i++) {         리턴값의 sum 값이 되
                   sum += value[i];    }                        그 값이 글자길이 5와 나누어 짐으로써
             return sum/value.length;     }                평균값이 나온다
  document.write('평균' +average(value));

 

2. while & do-while

- 조건식이 참일 때 반복적 실행

 

- 형태 : while (조건식) {

                   참일 때 실행될 코드

               }

 

- 예시 : let num = 0;

            while (num < 11) {                      ➡️ num을 0으로 초기화, 11보다 작을 때까지 반복

              document.write(num, '<br>');         num 값이 코드에서 출력 num = num + 1이므로

              num += 1;    }                                 1씩 증가 / 증가하는 값을 <br>태그에 출력 10까지 작성 된다.

 

- do-while 반복문 : 코드 실행 이후에 평가 

                              -> 거짓이더라도 최소 한 번은 실행되어야 할 때 사용

 

- (예시) 형태 : let input;

                       do {

                                 input = prompt('숫자를 입력하세요.');

                            } while (isNaN(input));

                                 console.log('입력한 숫자는 ' + input + '입니다.');

                       var i = 1;

                       do {

                           console.log(i)

                           i++

                         } while(i <= 10);

                ➡️ do 안의 문을 계속 실행하다가 while 안의 문에 따라 완료 한다. ❗확인필요❗

 

3. 반복문의 break & continue

- 조건의 의한 종료 이전, 사용자의 개입으로 빠른 종료를 위해 break를 사용

- break로 반복문의 종료 이후 그 다음 코드가 차례로 시작

- 이처럼 break문은 switch(조건문 중 하나)문 만 쓸 수 있는 것이 아니다.

- + continue: 뒤에 오는 실행문을 1회 생략하고, 소속된 반복문의 조건식파트로 돌아간다.

   => 예로 들어 var = num;

                         for (num = 1; num <= 10; num++) {             ➡️ 일경우 continue가 있으므로

                            if (num ==4)  {                                                 num == 4 + break라 4일때 종료

                                break;    }                                                    그러므로 3까지만 작성

                            document.write (num, '<br>');    }                   (1, 2, 3 작성)

 

   => 예로 들어 var = num;

                         for (num = 1; num <= 10; num++) {             ➡️ 일경우 continue가 있으므로

                            if (num ==4)  {                                                 num == 4 라 4에서 종료하는 것이 아닌

                                continue;    }                                                num <= 10의 말대로

                            document.write (num, '<br>');    }                    10까지 반복 한다. (1~10 작성)

 

- 예시

   for (let i = 0; i < 20; i++) {                                ➡️ i < 13 이라도 계속 된다는 것이니

        if (i < 13) continue;                                           i < 20, 즉 19까지 반복

        console.log(i + '살은 청소년입니다.');    }        13~19살은 청소년입니다. 까지 반복