5줄로 배열 병합

안녕하세요 👋,

배열 평면화는 다차원 배열을 단일 차원 배열로 또는 지정된 차원으로 줄이는 프로세스입니다.

예시:

입력: [1, 2, 3, 4, [5, 6]]

출력: [1, 2, 3, 4, 5, 6]

사고 과정:

1단계: 주어진 배열을 반복해야 합니다.
2단계: 배열이 아닌 경우 각 요소에 대해 새 배열로 푸시합니다.
3단계: 어레이인 경우 1~3단계를 반복합니다.

관찰:

다음 반복에서 한 반복의 출력을 사용하므로 여기서 아이디어는 Array.reduce() 을 사용하는 것입니다.

배열을 입력으로 받는 과정에서 1~3단계가 반복되므로 재귀를 수행해야 합니다.

코딩을 시작해 보겠습니다.

function flattenArr(arrToFlatten) {
    return arrToFlatten.reduce((acc, value) => {
      if (value instanceof Array) {
        return acc.concat(flattenArr(value));
      }
      return acc.concat(value);
    }, []);
}

다음과 같이 호출합니다.

const arr = [1, 2, 3, 4, [5, 6]];
flattenArr(arr) // [1, 2, 3, 4, 5, 6]

flattenArr는 배열 유형의 arrToFlatten를 인수로 받아들이는 함수입니다.

arrToFlatten.reduce 의 출력을 반환합니다.

결과의 초기 값을 빈 배열로 둡니다[].

현재 입력value이 어레이의 인스턴스가 아닌 경우 acc 유틸리티 기능을 사용하여 concat에 추가합니다.

그것이 instanceof 배열인 것으로 판명되면 Array( flattenArr )를 매개변수로 사용하여 value를 다시 호출한 다음 acc 와 연결합니다.

이제 이 접근 방식을 사용하여 다차원 배열을 단일 차원 배열로 줄일 수 있습니다.

지정된 레벨까지만 평탄화해야 하고 내부에 중첩된 모든 항목은 그대로 유지해야 하는 경우는 어떻습니까?

인수( depth )에서 사용자로부터 다른 값을 얻는 것은 간단합니다.

function flattenArr(arrToFlatten, depth) {
    return arrToFlatten.reduce((acc, value) => {
      if (value instanceof Array && depth > 0) {
        return acc.concat(flattenArr(value, depth - 1));
      }
      return acc.concat(value);
    }, []);
}

다음과 같이 호출합니다.

const arr = [1, 2, 3, 4, [5, 6, [7, 8]]];
flattenArr(arr, 1) // [1, 2, 3, 4, 5, 6, [7, 8]]

추가 매개변수depth를 추가하고 감소 함수 내에서 배열을 처리하기 전에 해당 값이 0보다 큰지 확인하십시오.

depth 값이 0보다 크면 배열을 평면화해야 함을 의미합니다. 따라서 배열을 사용하여 flattenArr를 재귀적으로 호출하고 한 수준에서 depth - 1를 호출합니다.

각각의 재귀 호출은 1레벨 깊이로 이동하여 depth의 값을 1

만큼 줄인다는 것을 의미합니다.



아 맞다 5줄이라고 했는데 여기요!!!

const flattenArr = (arrToFlatten, depth) => (
    arrToFlatten.reduce((acc, value) => (
      ((value instanceof Array && depth) ? [...acc, ...flattenArr(value, depth - 1)] : [...acc, value])
    ), [])
);

엣지 케이스 처리:

첫 번째 매개변수가 배열이 아니면 어떻게 됩니까?

깊이가 숫자가 아니면 어떻게 됩니까?

수표를 추가해 보겠습니다.

 const typeOfDepth = typeof(depth);
 if (!(arrToFlatten instanceof Array) || !(typeOfDepth === 'number')) {
    throw new Error('Invalid Argument Supplied');
 }

George가 아래 댓글에서 제안한 것처럼 기본Array.flat() 방법이 있지만 browser support을 달성하려면 babel과 같은 js 트랜스파일러의 도움을 받아야 합니다.



내 Website 및

그게 다야!