Colin's Blog
[typescript] async/await를 사용한 순회 가능한 객체의 처리 방법

순회 가능한 객체(배열, 맵, 세트 등)를 비동기적으로 처리해야 하는 상황은 흔히 발생합니다. TypeScript에서 async/await를 활용하여 순회 가능한 객체를 처리하는 방법을 알아보겠습니다.

1. for...of 루프와 async/await 사용하기

순회 가능한 객체를 for...of 루프로 순회하면서 async/await를 사용하여 비동기 작업을 처리할 수 있습니다.

예를 들어, Promise를 반환하는 비동기 작업을 수행하는 함수가 있다고 가정해봅시다.

async function processData(data: number) {
    // 비동기 작업 수행
    return new Promise<number>(resolve => {
        setTimeout(() => {
            resolve(data * 2);
        }, 1000);
    });
}

이제, 순회 가능한 객체를 순회하며 processData 함수를 async/await로 처리하는 예제를 살펴봅시다.

const dataList = [1, 2, 3, 4, 5];

async function processArray() {
    for (const data of dataList) {
        const result = await processData(data);
        console.log(result);
    }
}

processArray();

2. Promise.all을 활용하여 병렬 처리하기

Promise.all을 사용하여 순회 가능한 객체의 모든 요소에 대한 비동기 작업을 병렬로 처리할 수도 있습니다.

예를 들어, 배열의 각 요소를 처리하는 비동기 작업을 병렬로 처리하는 코드는 다음과 같습니다.

const dataList = [1, 2, 3, 4, 5];

async function processArrayParallel() {
    const promises = dataList.map(processData);
    const results = await Promise.all(promises);
    console.log(results);
}

processArrayParallel();

processData 함수가 Promise를 반환하는 경우에, Promise.all을 사용하여 병렬로 비동기 작업을 처리할 수 있습니다.

3. for...of 루프를 사용한 병렬 처리

for...of 루프와 Promise.all을 조합하여 순회 가능한 객체를 병렬로 처리할 수도 있습니다.

예를 들어, 순회 가능한 객체를 병렬로 처리하는 코드는 다음과 같습니다.

const dataList = [1, 2, 3, 4, 5];

async function processArrayParallel() {
    const promises = [];
    for (const data of dataList) {
        promises.push(processData(data));
    }
    const results = await Promise.all(promises);
    console.log(results);
}

processArrayParallel();

병렬로 비동기 작업을 처리하기 위해 Promise.all을 사용하면, for...of 루프를 통해 순회 가능한 객체를 효율적으로 처리할 수 있습니다.

이렇게 async/await를 사용하여 순회 가능한 객체를 비동기적으로 처리하는 방법을 통해, 효과적인 비동기 코드를 작성할 수 있습니다.

감사합니다!

References

© 2018 Colin. All rights reserved.