[JS] Ex14_반복문_별 찍기.html

반복문의 꽃, 별 찍기를 하다.

---

1. 기본 별 찍기

        document.write("1. 기본 별찍기")
        document.write("<br>")
        let floor = 7
        for(i = 1;i <= floor; i++){
            for(j = 1; j <= i; j++){
                document.write("*")
            } document.write("<br>")
            }

결과

별 찍기 문제 중에 가장 기본적인 문제이다.

처음 보면 어떻게 풀어야 할지 모르겠지만 코드 리팩토링 방법을 이용하면 규칙을 쉽게 찾을 수 있다.

코드 리팩토링: 결과를 보고 그대로 분해해서 코드를 짜는 방법. 결과는 바뀌면 안 된다.

첫 번째 문제이니 코드 리팩토링을 이용하여 문제를 풀어보겠다. (5층이라 가정)

        document.write("*")
        document.write("<br>")

        document.write("*")
        document.write("*")
        document.write("<br>")

        document.write("*")
        document.write("*")
        document.write("*")
        document.write("<br>")

        document.write("*")
        document.write("*")
        document.write("*")
        document.write("*")
        document.write("<br>")

        document.write("*")
        document.write("*")
        document.write("*")
        document.write("*")
        document.write("*")
        document.write("<br>")

5층이라 가정했을 때의 결과를 직관적으로 분해해서 코드를 짜면 이런 식으로 될 것이다.

여기서 우리는 규칙성을 찾아야 하는데, *은 1씩 증가하고 <br>은 각 문단당 1개씩 존재한다.

이 말은 외부 for문은 5번 반복하고 반복할 때마다 별의 반복수를 증가한다. 그리고 <br>를 반복한다.

내부 for문은 반복당 *을 출력하는 로직이 존재하면 된다.

외부 반복문이 1번 반복될 때마다 내부 반복문의 반복 횟수가 1씩 증가한다.

 

외부 for문

let floor = 7
for(i = 1;i <= floor; i++){
	document.write("<br>")
}

 외부 for문은 각 층을 나타낸다고 보면 편하다. 우리는 1층부터 7층까지 있으므로 i = 1부터 7이 될 때까지 i++ 1씩 증가

각 층이 끝나면 다음 줄로 가야 되니 <br> 태그도 외부 반복해 준다.

=> 한 층 만들어지고 다음 줄로 넘어가고를 7번 반복한다.

 

내부 for문

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

각 층에 별을 만드는 과정이라고 생각하면 된다.

(내 방식)

1층(맨 위)에 별 1개 있고 갈수록 별의 개수가 증가하기 때문에 j = 1과 j++을 먼저 써준다. 조건식은 나중에 생각하고 실행로직부터 써준다. 별을 생성해야 하니 document.write("*")을 써준다. 이제 중요한 조건식을 만들어야 한다. 1층에 1개, 2층에 2개, 3층에 3개... 규칙성을 찾아주면 i가 1일 때 내부 반복문은 1번 반복, i가 2일 때 내부 반복문은 2번 반복. 이런 식으로 j가 1부터 시작하니까 i보다 작거나 같다고 해주면 자연스럽게 완성된다.

---

2. 거꾸로 별 찍기

document.write("2. 거꾸로 별찍기");
document.write("<br>");

      for (i = 0; i <= 4; i++) {
        // 줄 개념
        for (j = 1; j <= 5 - i; j++) {
          // 각 줄당 별 개수 개념
          document.write("*");
        }
        document.write("<br>");
      }

내 결과

1번 문제를 반대로 생각하면 보기보다 쉽다.

 

3. 공백이 포함된 별 찍기

document.write("3. 공백이 포함된 별찍기");
document.write("<br>");

      for (i = 1; i <= 5; i++) {
        for (j = 4; j >= i; j--) {
          document.write("&nbsp;");
        }
        for (k = 1; k <= i; k++) {
          document.write("*");
          document.write("*");
        }
        document.write("<br>");
      }

결과

외부 for문은 똑같이 층을 만든다.

별을 찍기 전에 공백을 넣어줘야 한다는게 새로운 점이다. 공백도 새롭게 반복해야 하므로 내부 for문이 2개(공백, 별)

(내 생각)가운데로 절반을 자르고 왼쪽 부분을 만들고 별을 하나 더 출력하면 완성된다고 생각하고 접근했다. 1층은 공백 4개 + 별 1개 2층은 공백 3개 + 별 2개 3층은 공백 2개 + 별 3개 공백은 줄어들고 별은 늘어난다. 공백--, 별++이런 식으로 규칙성을 찾아서 각각의 내부 for문을 완성했다.

 

4. 마름모 별 찍기

      document.write("4. 마름모 별찍기");
      document.write("<br>");
      for (i = 1; i <= 7; i++) {
        if (i < 5) {
          // 5번째 줄을 기준으로 증가 하다가 감소한다.
          for (j = 4; j >= i; j--) {
            // 1 2 3 4
            document.write("&nbsp;");
          }
          for (k = 1; k <= 2 * i - 1; k++) {
            document.write("*");
          }
          document.write("<br>");
        } else if (i >= 5) {
          // 5(별 5개, b =1 5) 6(별 3개 b = 2 4) 7(별 1개 b = 3 3)
          for (a = 1; a <= i - 3; a++) {
            document.write("&nbsp;");
          }
          for (b = 1; b <= 2 * (7 - i) + 1; b++) {
            document.write("*");
          }
          document.write("<br>");
        }
      }

내 결과

4층을 전에는 별이 늘어나다가 4층 이후부터 별이 줄어든다.

→ if (4층 포함 이전일 때), 공백은 줄어들고 별은 늘어난다.

→ else (4층 이후 = 5층부터), 공백은 늘어나고 별은 줄어든다.

이중 for문에 if 조건문까지 사용하는 걸로 접근했다.

 

4층 포함 이전일 때부터 코드를 짰다.

(내 생각)

여기서 주의깊게 볼 부분은 별의 개수가 지금 홀수인데

고등수학에서 수열 배울 때 홀수 수열 일반항을 이용해서 조건식을 작성하면 된다.

별 생성 반복문에서 변수 값이 1부터 시작하니까 조건식에 있는 수가 곧 반복 횟수이다.

그럼 조건식에 있는 수가 홀수만 나와야 한다는 소리인데,

별이 증가할 때는 1 3 5 7로 증가하기때문에

공차가 2 초항( a )이 1인 일반항은 2a -1이다. a는 i 랑 같으니까 a 대신 i 넣으면 끝

별이 감소할 때는 5 3 1로 감소하기 때문에

공차가 2 이니까 2를 곱한 값은 짝수, 짝수 + 홀수 = 홀수이니까 1을 더하거나 빼면 된다.

그러면 무엇에다가 2를 곱하냐가 관건인데 일단 여기서 쓰일 i는 5 6 7이다.

중간을 기준으로 위아래로 대칭인 것을 이용해서 7은 밑에서 1번째, 6은 2번째 5는 3번째라고 생각하고

1을 더한다는 가정하에 2 * ( 7 - i ) + 1을 조건식에 넣어주었다. 7 - i가 밑에서 몇 번째라는 의미이다.

만약 1을 빼주고 싶다면 7을 8로 바꿔주면 된다.

 

내 생각에 마름모 별 찍기의 별 반복문만 잘 생각한다면 별 찍기를 마스터할 수 있을 것이다.