자바스크립트 비동기 프로그래밍 이해하기

자바스크립트에서는 비동기 프로그래밍이 매우 중요합니다. 이 글에서는 비동기 프로그래밍의 개념을 이해하고, 콜백 함수, 프로미스, async/await과 같은 패턴을 사용하여 비동기 코드를 작성하는 방법에 대해 알아보겠습니다.

 

비동기 프로그래밍이란?

• 비동기 프로그래밍은 작업을 순차적으로 처리하는 대신, 작업이 완료될 때까지 기다리지 않고 다른 작업을 계속할 수 있는 프로그래밍 방식입니다. 이는 네트워크 요청이나 파일 입출력과 같이 시간이 오래 걸리는 작업을 효율적으로 다룰 수 있게 해줍니다.

콜백 함수:

• 콜백 함수는 비동기 작업이 완료된 후 호출되는 함수입니다. 주로 콜백 함수를 사용하여 비동기 작업의 결과를 처리합니다.

function fetchData(callback) {
    setTimeout(() => {
        const data = '비동기 작업 결과';
        callback(data);
    }, 1000);
}

fetchData((result) => {
    console.log(result); // 비동기 작업 결과
});

728x90

프로미스:

• 프로미스는 비동기 작업의 성공 또는 실패를 다루는 객체입니다. 프로미스를 사용하여 비동기 작업의 결과를 보다 명확하게 처리할 수 있습니다.

function fetchData() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            const data = '비동기 작업 결과';
            resolve(data);
        }, 1000);
    });
}

fetchData()
    .then((result) => {
        console.log(result); // 비동기 작업 결과
    })
    .catch((error) => {
        console.error(error);
    });

 

async/await:

• async/await은 비동기 작업을 더욱 간편하게 다룰 수 있는 패턴입니다. async 함수 내에서 await 키워드를 사용하여 비동기 작업의 완료를 기다릴 수 있습니다.

async function fetchData() {
    return new Promise((resolve) => {
        setTimeout(() => {
            const data = '비동기 작업 결과';
            resolve(data);
        }, 1000);
    });
}

async function main() {
    const result = await fetchData();
    console.log(result); // 비동기 작업 결과
}

main();

 

비동기 프로그래밍은 자바스크립트에서 매우 중요한 개념이며, 콜백 함수, 프로미스, async/await과 같은 패턴을 사용하여 효율적으로 비동기 코드를 작성할 수 있습니다.

반응형