[ES6] 새로운 배열로 반환하기 - Array.from( )

이전에 공부하면서 모르던 부분, 궁금한 부분들에 대해서 조사하고 스크랩했던 내용들을 다시 훑던 중, "어? 이거 뭐였지? 최근에 다시 공부할때도 못봤던 것 같은데?" 싶었던 메소드를 발견했다.

그래서 나중에 참조하기 위해 기록으로 정리해 두려한다.

Array.from( )

arr.from()도 ES6에서 도입된 문법이라고 한다. 덕분에 이전에는 개별요소를 반복 push하는 등의 방법을 이용했던 것보다 간결하게 코드 수행이 가능해졌다.

이 메소드를 이용하면 유사 배열 객체(array-like object)나 반복 가능한 객체(iterable object)를 얕게 복사해 새로운Array 객체를 만든다(MDN참조).

📢 문법

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

• arrayLike
  배열로 변환하고자 하는유사 배열 객체나 반복 가능한 객체.

• mapFn(Optional)
  배열의 모든 요소에 대해 호출할 맵핑 함수.

• thisArg(Optional)
  mapFn 실행 시에 this로 사용할 값.

반환되는 return값은 새로운 Array이다.

📢 예제

console.log(Array.from('foo'));
// expected output: Array ["f", "o", "o"]

console.log(Array.from([1, 2, 3], x => x + x));
// expected output: Array [2, 4, 6]

---

여담

이 문법이 ES6에서 추가된 문법인 만큼 구 브라우저에서 사용하기 위해서는 폴리필이란 것을 해야만 했다.

그러나 지원하지 않는 '구 브라우저'가 바로 IE이고, 이 녀석은 22년 6월 부로 호흡기가 떼어졌기 때문에 앞으로를 생각하면 큰 문제가 될 부분은 아닌 것 같다.

---

• 출처 : MDN사이트 참조