# 'return await promise' vs 'return promise'

**Published by:** [Primrose](https://paragraph.com/@primrose/)
**Published on:** 2023-01-23
**URL:** https://paragraph.com/@primrose/return-await-promise-vs-return-promise

## Content

“return await promise” vs “return promise” 아래 두 함수를 보자. async function func1() { const promise = asyncOperation(); return await promise } async function func2() { const promise = asyncOperation(); return promise } 두 함수는 return옆의 await말고는 아무런 차이가 없다. 그러나 두 함수가 동작하는 방식의 차이를 아는 것은 중요하다. 아래 함수를 사용해서 두 함수를 테스트해보자. function promisedDivision(n1: number, n2: number) { if (n2 === 0) { return Promise.reject(new Error('Cannot divide by 0')); } else { return Promise.resolve(n1 / n2); } } async function divideWithAwait() { return await promisedDivision(6, 2) } async function main() { const result = await divideWithAwait(); console.log(result) } 위의 main()함수를 실행하면 어떻게 될까? divideWithAwait()에서도, main()에서도 await를 걸어주었기 때문에 당연히 3이 출력되는 것을 볼 수 있다. 이제 await를 빼고 테스트해보자. function promisedDivision(n1: number, n2: number) { if (n2 === 0) { return Promise.reject(new Error('Cannot divide by 0')); } else { return Promise.resolve(n1 / n2); } } async function divideWithAwait() { return promisedDivision(6, 2) } async function main() { const result = await divideWithAwait(); console.log(result) } return await에서 return으로 바뀌었지만, 여전히 return값은 3이 나온다. 이 단계에서는 return await과 return이 다르게 작동하지 않는다. 다르게 행동하는 케이스를 살펴보자. function promisedDivision(n1: number, n2: number) { if (n2 === 0) { return Promise.reject(new Error('Cannot divide by 0')); } else { return Promise.resolve(n1 / n2); } } async function divideWithAwait() { try { return await promisedDivision(5, 0) } catch (e) { console.log(e) // logs Error('Cannot divide by 0') } } async function main() { const result = await divideWithAwait(); console.log(result) } 이번에는 divideWithAwait()함수에 try-catch구문을 추가했다. 마찬가지로 return await promise의 케이스를 먼저 테스트해보면 catch에서 걸려서 에러가 찍히는 것을 확인할 수 있다. function promisedDivision(n1: number, n2: number) { if (n2 === 0) { return Promise.reject(new Error('Cannot divide by 0')); } else { return Promise.resolve(n1 / n2); } } async function divideWithAwait() { try { return promisedDivision(5, 0) } catch (e) { // Rejection NOT caught console.log(e) } } async function main() { const result = await divideWithAwait(); console.log(result) } main().catch((e) => console.log("Uncaught", e)) return의 케이스는 어떨까? 에러가 catch에서 잡히지 않는다. 맨 밑의 Uncaught를 임시로 만들어 두었는데, 중요한 것은 reject된 promise 객체를 그대로 뱉었다는 것이다. 이를 이용해서, return promise와 return await promise의 사용처를 명백히 정할 수 있을 것이다. 에러가 발생했을 때, 리턴하는 함수(divideWithAwait) 내에서 처리를 할 로직이 있다면 return await를 사용하고, 밖에서(main) 처리되기를 원한다면 return을 사용하면 될 것이다. Subscribe

## Publication Information

- [Primrose](https://paragraph.com/@primrose/): Publication homepage
- [All Posts](https://paragraph.com/@primrose/): More posts from this publication
- [RSS Feed](https://api.paragraph.com/blogs/rss/@primrose): Subscribe to updates