📕 javascript - async await

📍 async 와 await

javascript의 비동기 처리 패턴중 제일 최근의 문법으로 기존의 비동기 처리 방식인 콜백 함수와 프로미스의 단점을 보완하고 가독성 높은 코드를 지원

 

📍 async & await 기본 문법

async function 함수명() {
    await 비동기처리 메서드명();
}

함수의 내부 로직중 HTTP 통신을 하는 비동기 처리 코드 앞에 await를 붙인다. 여기서 주의해야 할 점은 비동기 처리 메서드가 꼭 프로미스 객체를 반환해야 await가 정상 동작한다.

 

📍 example

function mainExcel()
{
    return new Promise(function(resolve, reject){
            $.ajax({
                url: '/',
            type: "GET",
            data: postdata,
            success : function(data) {
                    resolve(data.result);
            },
            error : function(error){
            }
        });
    })
}

// 비동기 순차 실행
async function excelDown(formId)
{
    var chk_arr = ['A','B','C','D'];
    if(chk_arr.includes('A'))
        await mainExcel(formId,start_date,end_date,'A');

    if(chk_arr.includes('B'))
        await mainExcel(formId,start_date,end_date,'B');

    if(chk_arr.includes('C'))
        await mainExcel(formId,start_date,end_date,'C');

    if(chk_arr.includes('D'))
        await mainExcel(formId,start_date,end_date,'D');
}

excel 다운로드시 4가지 종류의 엑셀을 차례로 다운로드 받는 로직.

 

📍 참고

• https://joshua1988.github.io/web-development/javascript/js-async-await/