[javascript] Array.fromAsync()

(2) Array.fromAsync()

비동기 순회 가능, 순회 가능, 또는 유사 배열 객체에서 얕게 복사된 새로운 Array 인스턴스를 만듭니다.

 

구문

Array.from(arrayLike, mapFn, thisArg);

• 매개변수
  • [필수] arrayLike : 배열로 변환할 객체
  • [선택] mapFn : (element, index) => { return A; }
  • [선택] thisArg : mapFn 실행 시의 this 값
• 반환값 : 이행 값이 새 Array 인스턴스인 새로운 Promise입니다.

사용 예시

const asyncIterable = (async function* () {
    for (let i = 0; i < 5; i++) {
        await new Promise((resolve) => setTimeout(resolve, 10 * i));
        yield i;
} })();

Array.fromAsync(asyncIterable).then((array) => console.log(array)); // [0, 1, 2, 3, 4]

 

 

Promise.all()과 비교하기 

Array.fromAsync()는 값을 순차적으로 await 합니다. Promise.all()은 모든 값을 동시에 await 합니다. 

function* makeAsyncIterable() {
  for (let i = 0; i < 5; i++) {
    yield new Promise((resolve) => setTimeout(resolve, 100));
  }
}

(async () => {
  console.time("Array.fromAsync() 시간");
  await Array.fromAsync(makeAsyncIterable());
  console.timeEnd("Array.fromAsync() 시간");
  // Array.fromAsync() 시간: 503.610ms

  console.time("Promise.all() 시간");
  await Promise.all(makeAsyncIterable());
  console.timeEnd("Promise.all() 시간");
  // Promise.all() 시간: 101.728ms
})();

 

 

참고 : 2024년 1월부터 다양한 브라우저(크롬, 엣지, 파이어폭스, 사파리)에서 사용  (이전 장치, 브라우저에서는 작동하지 않을 수 있음)

삼성 인터넷, nodejs 호환 불가

 

 

 

출처 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/fromAsync