[JavaScript] Array.from()

Array.from()

Array.from()은 쉽게 말해 배열을 만들어주는 역할을 한다.

어렵게 표현하면 문자열이나 이터러블 객체, 유사 객체를 얕게 복사해 새로운 배열은 만든다고 한다..

const arr = [1,2,3,4,5];
// 보통은 선언을 통해 배열을 생성

const greeting = 'hello';
// 하지만 greeting의 각 스펠값을 가진 배열을 원한다면?

const newArr = Array.from(greeting);
// 출력값 ['h','e','l','l','o']

MDN 공식자료

---

Parameters

아무튼 Array.from()은 세 개의 인자를 가질 수 있는데,

순서대로 arrayLike(배열로 만들 대상), mapFn(배열을 어떤 식으로 표현할지), thisArg(mapFn의 인자)가 있다.

앞의 arrayLike만 필수값이고 나머지 두 개는 선택적으로 넣거나 넣지 않아도 된다.

Array.from(arrayLike)
Array.from(arrayLike, mapFn)
Array.from(arrayLike, mapFn, thisArg)

// mapFn(반복 : Array.map() 유사)
// 길이가 5인 배열을 만들고 -> 각 항목에 index값을 넣어줌
Array.from({length: 5}, (value, index) => index); // [0, 1, 2, 3, 4]

---

저번에 만들어 둔 미니게임 프로젝트를 JS에서 React로 리마스터하는 도중에 여러 개의 아이템들을 동적으로 만드는 곳에서 길을 잃다가 Array.from에 대해 알게 되었다.

유용한 기능이기도 하고, 알고리즘에 자주 나올 것만 같은 느낌이기에 메모해 둔다.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from