18일차

18일차는 매우 어려웠다. 하나의 문제에도 수없이 많은 고민을 했다. 17일차에 이상한 생각을 한 내 자신이 미웠다.

그래도 한 문제씩 집중했기에 벌써 93%나 올 수 있었다. 남은 8문제도 물론 어렵겠지만 꾸준히 해 온 나를 믿어야한다.

오늘의 문제

그림 확대

직사각형 형태의 그림 파일이 있고, 이 그림 파일은 1 × 1 크기의 정사각형 크기의 픽셀로 이루어져 있습니다. 이 그림 파일을 나타낸 문자열 배열 picture과 정수 k가 매개변수로 주어질 때, 이 그림 파일을 가로 세로로 k배 늘린 그림 파일을 나타내도록 문자열 배열을 return 하는 solution 함수를 작성해 주세요.

입출력 예

picture	k	result
[".xx...xx.", "x..x.x..x", "x...x...x", ".x.....x.", "..x...x..", "...x.x...", "....x...."]	2	["..xxxx......xxxx..", "..xxxx......xxxx..", "xx....xx..xx....xx", "xx....xx..xx....xx", "xx......xx......xx", "xx......xx......xx", "..xx..........xx..", "..xx..........xx..", "....xx......xx....", "....xx......xx....", "......xx..xx......", "......xx..xx......", "........xx........", "........xx........"]
["x.x", ".x.", "x.x"]	3	["xxx...xxx", "xxx...xxx", "xxx...xxx", "...xxx...", "...xxx...", "...xxx...", "xxx...xxx", "xxx...xxx", "xxx...xxx"]

입출력 예 #1

예제 1번의 picture는 다음과 같습니다.
.xx...xx.
x..x.x..x
x...x...x
.x.....x.
..x...x..
...x.x...
....x....
이를 가로 세로로 k배, 즉 2배 확대하면 그림 파일은 다음과 같습니다.
..xxxx......xxxx..
..xxxx......xxxx..
xx....xx..xx....xx
xx....xx..xx....xx
xx......xx......xx
xx......xx......xx
..xx..........xx..
..xx..........xx..
....xx......xx....
....xx......xx....
......xx..xx......
......xx..xx......
........xx........
........xx........

어려운 문제였다. 내가 어렵게 생각한 것도 있어서 더 어렵게 풀었던 거 같다. 그래도 착실히 고민해서 풀었다는 것에 가산점을 주고 싶다.

접근방법

이 문제의 접근방법은 새로운 이차원 배열 생성 및 k만큼 늘린 값을 넣어주기를 생각하면 된다. 이를 바탕으로 풀어보면 아래와 같다.

1. picture의 행 수와 열 수를 구함.
2. k를 사용하여 새로운 행 수와 열 수를 계산.
3. 새로운 2차원 배열 result를 생성. result는 크기가 new행 × new열이고 모든 요소가 공백으로 채워진 배열.
4. picture를 순회하면서 각 픽셀 값을 가져옴.
5. 픽셀 값을 k배 늘린 범위에서 result에 할당.
6. result를 반환합니다.

풀이

function solution(picture, k) {
  const newRowLength = picture.length * k;
  const newColLength = picture[0].length * k;

  const result = Array.from({ length: newRowLength }, () => "".repeat(newColLength));

  picture.forEach((row, rowIndex) => {
    row.split("").forEach((pixel, colIndex) => {
      const startRow = rowIndex * k;
      const startCol = colIndex * k;
      for (let i = startRow; i < startRow + k; i++) {
        result[i] = result[i].substring(0, startCol) + pixel.repeat(k) + result[i].substring(startCol + k);
      }
    });
  });

  return result;
}

코드 풀이를 설명하면 result, 2번의 forEach, 마지막 for문. 이렇게 3번의 코드를 중심으로 설명할 수 있다.

먼저 변수 result다. result는 새로운 이차원 배열을 만든다. 배열 만드는 부분을 설명하면, Array.from으로 배열을 생성한 후, newRowLength만큼의 길이를 갖는 배열을 생성하고 빈 문자열을 newColLength만큼 넣어준다.

그리고 두번의 forEach문을 순회한다. 한 번의 picture의 row로 한 번 순회하고, 그리고 그 row를 배열로 나눠 다시 순회한다. 그러면 하나의 픽셀 단위로 순회를 시작한다.

그리고 for문에서는 result배열에 픽셀을 k만큼 배수한 값을 넣어주는 작업을 한다.

이렇게 해서 그림 확대 문제를 풀 수 있다.

정리하기

코딩에서는 일단 문제를 해결하는 과정이 중요하다. 아무리 효율적인 코드를 추구한다고 해도 문제를 풀지 못한다면 그것은 좋은 코드라고 할 수 없다. 그렇기 때문에 우선 문제를 풀고 난 후 더 나은 접근방법을 고민하는 것이 개발자에게 중요한 요소라 생각한다.