Promise 2

async

promisem의 then 메소드를 체인형식으로 호출하는 것보다 가독성이 좋아진다.

함수 앞에 async 키워드를 붙이면 항상 promise를 반환한다.

async function getName(){
    return "Mike";
}

console.log(getName()); // Promise {<fulfilled>: 'MIke'}

따라서 함수로 호출하고 then을 사용할 수 있다.

async function getName(){
    return "Mike";
}

getName().then((name) => {
    console.log(name);
});

함수 내부에 promise가 있다면 그 값을 반환한다.

async function getName(){
    return Promise.resolve('Tom');
}

getName().then((name) => {
    console.log(name); // Tom
});

함수 내부에서 예외가 발생하면 rejected 상태의 promise가 반환된다.

async function getName(){
    throw new Error("err...")
}

getName().catch((err) => {
    console.log(err); // Error: err...
});

---

await

await는 async함수 내부에서만 사용할 수 있다.

function getName(name){
    return new Promise((res, rej) => {
        setTimeout(() => {
            res(name);
        }, 1000);
    });
}

async function showName(){
    const result = await getName('Mike');
    console.log(result);
}

showName();

await함수 오른쪽으로 promise가 오고 promise가 처리될 때까지 기다린다.
따라서 위 코드는 1초 후에 Mike가 찍힌다.

---

async, await로 바꾸기

const p1 = () => {
    return new Promise((res, rej) => {
        setTimeout(() => {
            res("1번 주문 완료");
        }, 1000);
    });
}

const p2 = (message) => {
    console.log(message)
    return new Promise((res, rej) => {
        setTimeout(() => {
            res("2번 주문 완료");
        }, 2000);
    });
}

const p3 = (message) => {
    console.log(message)
    return new Promise((res, rej) => {
        setTimeout(() => {
            res("3번 주문 완료");
        }, 3000);
    });
}

console.log('시작');
async function order(){
    const result1 = await p1();
    const result2 = await p2(result1);
    const result3 = await p3(result2);
    consoel.log(result3);
    consoel.log('종료');
}
order();

// 원래 사용했던 then 메소드
// p1()
// .then((res) => p2(res))
// .then((res) => p3(res))
// .then((res) => console.log(res));
// .catch(console.log)
// .finally(() => {
//     console.log('끝');
// });

---

try catch문

async, await에서 catch문을 사용할 때

const p1 = () => {
    return new Promise((res, rej) => {
        setTimeout(() => {
            res("1번 주문 완료");
        }, 1000);
    });
}

const p2 = (message) => {
    console.log(message)
    return new Promise((res, rej) => {
        setTimeout(() => {
            rej(new Error("err..."));
        }, 2000);
    });
}

const p3 = (message) => {
    console.log(message)
    return new Promise((res, rej) => {
        setTimeout(() => {
            res("3번 주문 완료");
        }, 3000);
    });
}

console.log('시작');
async function order(){
    try{
        const result1 = await p1();
        const result2 = await p2(result1);
        const result3 = await p3(result2);
        consoel.log(result3);
    }   catch(e)    {
        console.log(e);
    }
    consoel.log('종료');
}
order();

---

promise.all 사용

const p1 = () => {
    return new Promise((res, rej) => {
        setTimeout(() => {
            res("1번 주문 완료");
        }, 1000);
    });
}

const p2 = (message) => {
    console.log(message)
    return new Promise((res, rej) => {
        setTimeout(() => {
            res("2번 주문 완료");
        }, 2000);
    });
}

const p3 = (message) => {
    console.log(message)
    return new Promise((res, rej) => {
        setTimeout(() => {
            res("3번 주문 완료");
        }, 3000);
    });
}

console.log('시작');
async function order(){
    try{
        const result = await Promise.all([p1(), p2(), p3()]);
        console.log(result);
    }   catch(e)    {
        console.log(e);
    }
    consoel.log('종료');
}
order();