자바스크립트 달팽이 배열 문제 풀이

 

자바스크립트 달팽이 배열 문제..

처음에는 풀이를 보면서도 이해가 잘 되지 않았다.

unshift, push를 사용해야하는건가? 라는 생각을 했지만

2차원배열을 추가한 후 x, y를 통해서 배열을 가르키는 인덱스 번호를 수정하면서 숫자를 넣어주면 되는 거였다.

 

나중에 다시 기억을 살릴수 있도록 기록해보려고 한다..

 

 

달팽이 배열 풀이 코드

let result = [];

  // 1. result => 2차원 배열
  for (let i = 0; i < length; i++) {
    result[i] = [];
  }
  /** 2.패턴 기반으로 반복문 구현
   *    1) length 길이만큼 시작해서 숫자를 채운다.
   *    2) length = i만큼 줄어들고, 방향도 바뀌면서, 2회씩 출력한다.
   *    3) length == 0; 프로그램을 멈춘다.
   */
  let direction = 1;
  let x, y, num;
  x = y = num = 0;
  x--;
  while (true) {
    for (let i = 0; i < length; i++) {
      x += direction;
      result[y][x] = ++num;
    }

    length--;

    if (length <= 0) break;

    for (let j = 0; j < length; j++) {
      y += direction;
      result[y][x] = ++num;
    }
    direction *= -1;
  }

  return result;

- 이해하기가 어려울 수도 있으니 코드를 잘라가면서 설명란을 붙혀보겠다!

 

 

---

 

  for (let i = 0; i < length; i++) {
    result[i] = [];
  }

- 배열을 우선 2차원 배열로 넣어준다.

- length 값에 맞게 배열을 추가!

 

 

---

 

 

  let direction = 1;
  let x, y, num;
  x = y = num = 0;
  x--;

- 변수는 이렇게 4가지를 추가한다.

 

- direction은 현재 1이지만

끝부분에서는 값을 -1을 곱해주면서

인덱스 값을 앞으로 추가하거나 뒤로 추가할 수 있도록 한다.

 

---

 

while (true) {
    for (let i = 0; i < length; i++) {
      x += direction;
      result[y][x] = ++num;
    }

    length--;

    if (length <= 0) break;

- while 문으로 반복을 돌려주면서 length 값을 하나씩 줄여나간다.

( 달팽이 모양을 만들면서 숫자를 입력하면 각 행과, 열에 넣을 수 있는 수는 짝수만큼 줄어든다.)

ex) 5를 입력하면 가로 1, 2, 3, 4, 5 // 세로 6, 7, 8, 9 // 가로 10, 11, 12, 13 // 세로 14, 15, 16 // 가로 17, 18, 19 ...

 

---

 

- x += directrion;

[y] [x] 중에서 x값을 length(5)만큼 늘려준다. 

result [y] [x]의 x값을 ++하면서 result [0][0], [0][1], [0][2], [0][3], [0][4] 까지 1, 2, 3, 4, 5 를 넣는다.

 

---

 

- length--;

이제 여기서 length 값을 5에서  4로 줄여준다. 이렇게 length 값이 0이 될때까지 돌아준다고 보면된다.

 

---

 

 

for (let j = 0; j < length; j++) {
      y += direction;
      result[y][x] = ++num;
    }
    direction *= -1;
  }

- 현재 값 [0][0], [0][1], [0][2], [0][3], [0][4]으로  [ 1, 2, 3, 4, 5 ]

- 이제 y값을 + 올려준다. 현재 result [y][x]의 값은 [0][4]이다.

- [1][4], [2][4], [3][4], [4][4] 인덱스에 6, 7, 8, 9를 넣어준다.

---

 

※현재 입력 된 값

[0][0], [0][1], [0][2], [0][3], [0][4]

[   ][   ], [   ][  ], [   ][  ], [   ][   ], [1][4],

[   ][   ], [   ][  ], [   ][  ], [   ][   ], [2][4],

[   ][   ], [   ][  ], [   ][  ], [   ][   ], [3][4],

[   ][   ], [   ][  ], [   ][  ], [   ][   ], [4][4],

 

- 여기서 directrion에서 -1을 곱한값을 넣어준다.

 

그럼 다시 처음부터 올라가게 된다.

---

while (true) {
    for (let i = 0; i < length; i++) {
      x += direction;
      result[y][x] = ++num;
    }

    length--;

    if (length <= 0) break;

- 여기서 result [y][x]의 값은 [4][4]이다.

- direction = -1을 계속 추가한다.

- [4][3], [4][2], [4][1], [4][0] 인덱스에 13, 12, 11, 10를 넣어준다.

---

---

※현재 입력 된 값

[0][0], [0][1], [0][2], [0][3], [0][4]

[   ][   ], [   ][  ], [   ][  ], [   ][   ], [1][4],

[   ][   ], [   ][  ], [   ][  ], [   ][   ], [2][4],

[   ][   ], [   ][  ], [   ][  ], [   ][   ], [3][4],

[4][0], [4][1], [4][2], [4][3], [4][4],

---

 

이렇게 계속 반복하면서 위로 올라가고 옆으로가고 방향을 바꾸는건 인덱스 값이 바뀌면서 입력값을 올리는거였다.

 

처음에 이게 이해가 안되었다. 어떻게 x, y로 가로열 세로열이 들어가지지?

이제 이해할 수 있었다!

혹시나 이해를 못하는 분들이 있다면 이해를 할 수 있는 글이 되었으면 한다..!!

 

달팽이 문제만 이해하고 푸는데 하루가 걸렸다..ㅠㅠ