수정하기 - 자바스크립트에서 Array.prototype.flat()의 사용법은 무엇인가요?

닉네임

비밀번호

제목

내용 [이미지 업로드는 권한이 있는 사람만 가능. 하단 카톡으로 연락]

`Array.prototype.flat()` 메서드는 자바스크립트에서 배열을 평탄화(flatten)하는 데 사용됩니다. 즉, 다차원 배열을 단일 차원 배열로 변환할 수 있는 기능을 제공합니다. 이 메서드는 <a href='https://sangseek.com/sangseeks/ES2019/ko'>ES2019</a>(ES10)에서 도입되었으며, 다양한 상황에서 유용하게 사용될 수 있습니다.           기본 사용법    `flat()` 메서드는 배열을 인자로 받아서, 그 배열의 모든 하위 배열을 지정된 깊이까지 평탄화한 새로운 배열을 반환합니다. 기본적으로 `flat()` 메서드는 깊이 1로 평탄화합니다.    ```javascript  const arr = [1, 2, [3, 4, [5, 6]]];  const flattened = arr.flat();  console.log(flattened); // [1, 2, 3, 4, [5, 6]]  ```    위의 예제에서 `arr` 배열은 <a href='https://sangseek.com/sangseeks/중첩 배열/ko'>중첩 배열</a>을 포함하고 있습니다. `flat()` 메서드를 호출하면 1단계 깊이까지 평탄화되어 `[1, 2, 3, 4, [5, 6]]`가 됩니다.           깊이 인자    `flat()` 메서드는 깊이를 인자로 받을 수 있으며, 이 인자는 배열을 평탄화할 깊이를 지정합니다. 기본값은 1입니다.    ```javascript  const arr = [1, 2, [3, 4, [5, 6]]];  const flattened = arr.flat(2);  console.log(flattened); // [1, 2, 3, 4, 5, 6]  ```    위의 예제에서 `flat(2)`를 사용하여 2단계 깊이까지 평탄화하였으므로, 최종 결과는 `[1, 2, 3, 4, 5, 6]`가 됩니다.           Infinity를 사용한 평탄화    `flat()` 메서드에 `Infinity`를 인자로 전달하면, 배열의 모든 하위 배열을 무한히 평탄화할 수 있습니다.    ```javascript  const arr = [1, [2, [3, [4, [5]]]]];  const flattened = arr.flat(Infinity);  console.log(flattened); // [1, 2, 3, 4, 5]  ```    이 경우, 모든 중첩 배열이 평탄화되어 단일 배열로 반환됩니다.           빈 배열 및 중복 제거    `flat()` 메서드는 빈 배열을 무시하고 평탄화합니다. 중복된 값은 제거되지 않으며, 원래 배열의 모든 요소가 포함됩니다.    ```javascript  const arr = [1, 2, [], [3, 4]];  const flattened = arr.flat();  console.log(flattened); // [1, 2, 3, 4]  ```           사용 예시    1.   데이터 정리  : API로부터 받은 데이터가 중첩 배열 형태일 때, 이를 평탄화하여 쉽게 접근할 수 있도록 할 수 있습니다.    ```javascript  const data = [    { id: 1, tags: ['js', 'frontend'] },    { id: 2, tags: ['css', 'frontend'] },    { id: 3, tags: ['node', 'backend'] },  ];    const allTags = data.map(item => item.tags).flat();  console.log(allTags); // ['js', 'frontend', 'css', 'frontend', 'node', 'backend']  ```    2.   중첩 배열 처리  : 다차원 배열을 처리할 때 유용합니다.    ```javascript  const nestedArray = [1, [2, [3, [4]]]];  const flatArray = nestedArray.flat(3);  console.log(flatArray); // [1, 2, 3, 4]  ```           주의사항    - `flat()` 메서드는 원본 배열을 변경하지 않고, 새로운 배열을 반환합니다.  - 배열의 요소가 배열이 아닌 경우, 해당 요소는 그대로 유지됩니다.  - `flat()` 메서드는 배열이 아닌 객체에서 호출할 경우, <a href='https://sangseek.com/sangseeks/TypeError/ko'>TypeError</a>가 발생합니다.           결론    `Array.prototype.flat()` 메서드는 자바스크립트에서 배열을 평탄화하는 데 매우 유용한 도구입니다. 다양한 깊이로 배열을 평탄화할 수 있으며, 복잡한 데이터 구조를 간단하게 처리할 수 있도록 도와줍니다. 이를 통해 데이터의 접근성과 가독성을 높일 수 있습니다.