Back to the Basics

[JS/Node] Method-arr.flat() 알아보기 본문

Programming Languages/JavaScript & Node.js

[JS/Node] Method-arr.flat() 알아보기

9Jaeng 2021. 8. 26. 10:36
728x90

**예제는 MDN을 참조하였다

코플릿을 다시 보면서 잘 사용하지 않던 method가 있어 정리해보았다.

flta method에 대해 기능을 알아보고, filter가 어떻게 작동되는지 기능을 직접 코드로 구현해 보았다.

arr.flat() :

배열 내부의 sub-srray 요소들을 특정 차원으로 새로운 배열로 return 한다.

- syntax : flat() ,flat(depth) 
- param : depth는 optional 이며 중첩돤 배열 구조를 얼마나 깊게 flattering을 하는지를 지정하는 깊이를 나타낸다. 기본값음 1

기본값은 1이며, 아래의 코드는 2차원 배열 내부의 배열인 [4,5]을 1차원 배열 수준으로 flattering 한 것이다.

const arr1=[1,2,3,[4,5],6,7]

console.log(arr1.flat())

// 1,2,3,4,5,6,7

2차가 아닌 3,4차 등 다차원 배열인 경우를 예를 들어보자.
차원이 3차원인 배열의 경우 flat() 이면 배열로 되어있는 요소의 ([3,4, [5,6]]) 1개의 차원이 제거되어 flattering이 된다.
flat(2)이면 2차원 배열의 [3,4, [5,6]] 2차원 요소까지 flattering 된다. 즉, 1차원 요소인 3,4 뿐만 아니라 2차 배열로 묶여있던 5,6까지 flattering 되는 것이다.

const arr2= [1, 2, [3, 4, [5, 6]]]
console.log(arr2.flat())
// [1, 2, 3, 4, [5, 6]]

console.log(arr2.flat(2))
// [1, 2, 3, 4, 5, 6]

const arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
console.log(arr4.flat(Infinity))
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

또한 arr4와 같이 Infinity를 넣어주면 차원 상관없이 모우 Flattering을 해준다. 모든 배열의 flattering이 필요할 때 사용하면 좋을 것 같다.

flat()의 기능을 직접 작성해보자

재귀 개념을 사용하여 작성하였다. mdn도 확인해보니 재귀를 사용하였

수도 코드 :

  1. 입력은 flattering 하고 싶은 배열, flattering 원하는 깊이(차원), flattering 결과를 넣어줄 배열
  2. 반복문을 사용하여 배열의 요소에 접근한다.
  3. 요소가 배열이고 depth가 0보다 크면
  4. flattering(요소,deoth-1,fttering 결과 배열)
  5. 아니면 (요소가 배열이 아니고 depth가 0이면)
  6. 결과 배열에 요소를 push 한다.
  7. 결과 배열을 return 한다.

function flattering(arr, depth, temp) {   

    for (let el of arr) {
        if (Array.isArray(el) && depth > 0)
            flattering(el, depth - 1,temp)
        else temp.push(el)
    }
    return temp    
}


let temp=[]
let input=[
    [1, 4],
    [true, false],
    ['x', 'y'],
]

let flatterArr=flattering(input,1,temp)

// (6) [1, 4, true, false, 'x', 'y']

yield 라는 개념을 알면 조금 더 간단하게 코드를 작성할 수 있을 것 같다.
예전에 파이썬을 공부하면서 배운 적이 있는데 홀라당 까먹어버렸다. HA가 끝나고 다시 복습해봐야겠다.

728x90
Comments