JS에서 행렬 확장

나의 첫 번째 기술 면접에서, 나는 자바스크립트에 대한 기본적인 이해를 검사하기 위해 몇 가지 질문을 받았다.몇 가지 고전적인 문제가 있지만, 가장 두드러진 것은 알고리즘이다.
테스트, 이것은 추상적으로 보기에 완전히 어려운 일 중의 하나이지만, 많은 일들처럼 약간의 자극이 있으면 완전히 일리가 있다.나는 운 좋게도 매우 관대한 면접관이 있었는데, 그가 정확한 방식으로 나를 격려했다.
내가 겪은 문제는 달팽이 매트릭스(수 그룹 수조)를 단일 매트릭스로 전개하는 것이다. 즉, 나선형 순서로 숫자를 표시하는 매트릭스를 정하고 매트릭스를 전개하며 정확한 숫자 순서를 유지하는 것이다.주의해야 할 것은 매트릭스 함수가 원시 매트릭스를 파괴할 수 있다는 것이다. (이것은 매우 도움이 된다.)우선, 우리는 그것을 실현할 때 그것을 따르는 테스트 용례를 보여 준다.

let myMatrix = [[1, 2, 3, 4],
                [12,13,14,5],
                [11,16,15,6],
                [10,9, 8, 7]];

ES2019의 경우 배열을 펴고 정렬하기만 하면 되는 매우 간단한 단일 행 코딩 솔루션이 있습니다.Array.prototype.flat() 깊이 파라미터를 받아들인다. 기본값은 1이다. 깊이 1의 수조이기 때문에 우리는 파라미터를 필요로 하지 않는다.우리의 함수는 이렇다.

myMatrix.flat().sort((a, b) => a - b)

보기 (Mozilla 문서) [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat] 는 이 함수의flat () 부분이 arr.reduce((acc, val) => acc.concat(val), []); 와 유사하다는 것을 보여 줍니다.
내가 훈련소의 마지막 몇 주 동안 기술 면접을 볼 때 플래트(flat)의 상황을 몰랐다. 비록 이것은 좋은 해결 방안이지만 나는 이 면접관이 기본 개념을 이해하고 싶어 한다고 믿는다.
이 문제를 토론하기 위해 나는 우리가 원시 행렬을 파괴할 수 있다는 사실을 기억했다. 이것은 큰 도움이 될 수 있기 때문에 나는 새로운 수조를 생성함으로써 함수를 시작하기로 결정했다.행렬을 펼치기 위해서, 우리는 나선 모드로 행렬에서 내비게이션을 하고, 행렬의 값을 팝업해서 이 새 그룹으로 이동할 것이다.
첫걸음은 간단하다.행렬의 첫 줄, 즉 첫 번째 자진이 바로 우리가 시작한 곳이다.이 하위 그룹은 질서가 있기 때문에 우리는 전체 그룹을 새 그룹에 넣을 수 있다.해구는 매우 간결한 문법을 사용할 수 있기 때문에 우리는 행렬을 재구성하고 shift () 를 사용하여 첫 번째 하위 그룹을 삭제한 다음 새 그룹으로 전송할 수 있다.우선, 우리의 함수는 다음과 같다.

const newArr = []
newArr.push(...map.shift())

매트릭스와 new Arr 를 살펴보겠습니다.

myMatrix = [[12,13,14,5],
            [11,16,15,6],
            [10,9,8,7]];
newArr = [1, 2, 3, 4]

두 번째 단계는 좀 까다롭다. 모든 하위 그룹의 마지막 값인 행렬의 맨 오른쪽 열을 포착해야 하기 때문이다. 원한다면.우리는 pop() 행렬의 마지막 값을 삭제할 수 있다는 것을 알고 있기 때문에 이것은 유용한 도구가 될 것이다.이 값을 가져오는 방법 중 하나는 for 순환일 수 있습니다. 이것은 다음과 같이 보일 수 있습니다.

for(let i = 0; i < matrix.length; i++){
    let lastVal = matrix[i].pop()
    newArr.push(lastVal)
}

그러나 다시 한 번, 우리는 모든 하위 진열에서 같은 값을 포획하기 때문에, 삭제와 비추는 방법을 사용할 수 있다.우리는 간단하게 쓸 수 있다. newArr.push(...matrix.map(arr => arr.pop())).다시 한 번 행렬을 봅시다.

myMatrix = [[12,13,14],
            [11,16,15],
            [10,9,8]];
newArr = [1, 2, 3, 4, 5, 6, 7]

앞의 두 가지 절차를 분명히 하는 것은 매우 중요하다. 왜냐하면 그것은 우리가 이 행렬에서 해야 할 대부분의 업무에 기초를 제공했기 때문이다.마지막 줄에서 포획값[10,9,8]이 필요합니다. 포획 첫 줄과 같은 방법을 사용할 수 있습니다. 전체 자진열에서reverse()를 호출하기만 하면 됩니다.
우리도 같은 반향 논리로 행렬의 첫 번째 열을 두루 돌아다닐 수 있다.오른쪽에서 하는 것처럼 맵과 시프트 () (pop () 가 아니라 모든 하위 그룹의 첫 번째 값을 원하기 때문에) 만 호출할 수 있습니다. 그러나 이 값들은 위에서 아래로 조직된 것이지 위에서 아래로 조직된 것이 아니기 때문에 다시 한 번 반향이 필요합니다.여기서 우리의 함수는 다음과 같다.

// bottom row
newArr.push(...matrix().pop().reverse())
//left edge
newArr.push(...matrix.map(arr => arr.shift()).reverse())

이러한 절차에 따라 우리의 행렬과 배열은 다음과 같다.

myMatrix = [[13,14],
            [16,15]];
newArr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]

이것은 매우 좋은 진전이지만, 그 잉여 가치는?우리는 새로운 논리를 시도하고 실현하여 끊임없이 값을 포착할 수 있거나, 우리가 이미 개발한 코드의 장점을 인식할 수 있다.나는 여기에 두 가지 선택이 있다고 생각한다. 첫 번째는 코드를 어떤while 순환에 넣는 것이다. 이 순환은 행렬이 실행될 때 계속 실행된다.길이 >0.아니면 우리는 함수를 귀속시킬 수 있다.함수 자체를 호출하고 브레이크 문장을 추가하는 다음 옵션을 선택했습니다. 이 예는 if (matrix.length === 0) 입니다.마지막으로, 우리는 new Arr를 돌려줘야 한다.
전반적으로 말하면 함수는 다음과 같다.

function unroll(matrix) {
  const newArr = []
  if (matrix.length === 0) return ;
  // first row
  newArr.push(...matrix.shift())
  // right edge
  newArr.push(...matrix.map(arr => arr.pop()))
  //bottom in reverse
  newArr.push(...matrix.pop().reverse())
  // left edge
  newArr.push(...matrix.map(arr => arr.shift()).reverse())
  unroll(matrix)
  return ...newArr
}

이것은 단지 8줄 코드일 뿐이지만, 사실은 이것이 매우 좋은 기술 테스트라는 것을 증명한다. 왜냐하면 이것은 기본적인 이해 능력을 확실히 검사했기 때문이다. 당신은 수조에 대해 어떻게 기본적인 조작을 집행하는지 아십니까?ES6 아세요?너는 귀속을 아느냐?모든 기본 기술.하지만 야외에서는 진열을 평평하게 펴고 정렬하기만 하면 된다고 생각한다.