[JavaScript] 직사각형 별찍기

프로그래머스 : string.repeat() & for

[JavaScript] 직사각형 별찍기

Photo by Lachlan on Unsplash

문제 설명

이 문제에는 표준 입력으로 두 개의 정수 n과 m이 주어집니다.별(*) 문자를 이용해 가로의 길이가 n, 세로의 길이가 m인 직사각형 형태를 출력해보세요.

제한 조건

  • n과 m은 각각 1000 이하인 자연수입니다.

예시

입력

5 3

출력

*****
*****
*****

이게 프로그래머스에서 제일 쉬운 문제라고 하는데 어떻게 풀어야 할지 감이 도저히 잡히질 않는다 😣 값을 어떻게 로 전환하지? 와 정말 아무리 생각해도 떠오르지가 않는다. 일단 input이 5일 때, output이 **가 되게 하려면 어떻게 해야할지 생각해 보았다. 와 이것도 해결방법이 전혀 떠오르지 않는다.. 우선 제일 작게 쪼개서 input이 1 일때, 어떻게 하면 *을 출력할 수 있을까? 잠시 다른 블로그를 봤는데 반복문인 for을 썼다. 하지만 이해가 가지 않는다. 왜 반복문을 쓰는거지?


동기님들께 수소문 한 결과, input이 n일 때, “*”을 n개만큼 입력해주는 방법을 알게됬다! 바로 repeat을 사용하는것!

"*".repeat(5); // Expacted: "*****"

이제 별을 n번 반복해서 그려주는 법을 알게 되었다! 그렇다면 이걸 어떻게 3번 반복해줄까? 거기다 같은 줄에 그려지면 안되고 n개마다 끊어서 다음 줄에 그려주어야 한다. 일단 앞에 쓴 방법으로 반복해서 3번 그려주면

"*".repeat(5).repeat(3) // Expacted: "***************"

여기서 줄바꿈만 해주면 우리가 원하는 답이 나온다!!

`${"*".repeat(5)}\n`.repeat(3) 
// Expacted: *****
          // *****
          // *****

backtick, dollarsign, curlybracket 으로 감싸주어 줄바꿈을 해주고 그걸 3번 반복해주면 원하는 값이 나온다. repeat을 사용하지 않았기 때문에 for을 한번도 사용하지 않았다. for을 사용하게 되면 아래와 같이 풀 수 있다.

const a = 5;
const b = 3;

for(let i=0; i<b; i++){
  let star="";
  for(let i=0; i<a; i++){
    star += "*";
  }
  console.log(star);
}
// Expacted: *****
          // *****
          // *****

b가 한번 씩 돌 때 마다 a에 “*”을 다섯번 찍어주는 방식이다. for을 두번쓰면 그냥 두번 반복해주는건가? 하고 단순하게 생각했었는데 사실 처음에 쓴 for이 한번 실행될 때, 두번째로 써준 for이 한바퀴를 다 도는 형식이였다!