Resumidamente, o return
é diferente de return await
quando está dentro de um bloco try
.
No caso específico da pergunta, não há diferença. Ali, return
é o mesmo que return await
porque está fora de um bloco try
(que é onde a diferença acontece).
No entanto, há alguns casos em que pode haver diferença. Na maioria das vezes, é a mesma coisa. Contudo, é importante saber quando return
e return await
são diferentes, uma vez que o comportamento do código pode ser ligeiramente alterado.
O que é async
?
Quando você marca uma função como async
, ela sempre retornará uma Promise
. No caso de um erro for lançado dentro dessa função assíncrona, a promessa retornada será do tipo rejected
. Caso contrário, resolver-se-á com algum valor. No caso de não se utilizar um return
explicitamente, será retornada uma promessa resolvida com valor undefined
.
No geral, é ideal utilizar funções assíncronas apenas quando você utiliza um await
explícito dentro delas. Caso contrário, o código pode acabar sendo contraintuitivo para alguns que não conhecem propriamente o comportamento das funç~oes assíncronas.
Se você só quer retornar uma promessa (como no código da pergunta), não é necessário utilizar async
ou await
, já que não há real necessidade em se aguardar a conclusão da promessa.
O operador await
O operador await
só pode ser usado dentro de funções marcadas como assíncrona. Ele basicamente espera pela conclusão da promessa passada a ele:
- Caso a promessa for resolvida, ele "desempacotará" o valor de dentro da
Promise
, que será o valor retornado pela expressão.
- Caso a promessa for rejeitada, ele lançará o erro, que pode ser capturado em blocos
try
/catch
.
A partir desse segundo item da lista acima, é possível inferir a diferença entre o return
e o return await
.
Retornando uma promessa — return <promise>
Considere o exemplo abaixo, em que temos uma função assíncrona foo
que chama uma função waitAndMaybeReject
, que retorna uma promessa que pode se resolver com qualquer valor ou rejeitar com algum erro.
async function foo() {
try {
// ↓↓↓↓↓↓
return waitAndMaybeReject();
}
catch (e) {
return 'caught';
}
}
A função waitAndMaybeReject
retorna uma promessa. No entanto, foo
não aguarda de fato pela conclusão dessa promessa. A função foo
simplesmente retorna (imediatamente) a Promise
retornada pela aplicação de waitAndMaybeReject
. Nesse caso, ocorre uma "delegação" da promessa.
Como a promessa foi retornada antes de ser, de fato, resolvida ou rejeitada, pode-se afirmar que o try
/catch
é inútil ali, porque, mesmo que waitAndMaybeReject
rejeite-se com algum erro, o catch
não será capaz de capturá-lo, uma vez que a promessa já terá sido retornada para quem chamou foo
.
Retornando o valor de uma promessa concluída — return await <promise>
Agora, considere este código (ainda com a mesma função waitAndMaybeReject
do exemplo anterior):
async function foo() {
try {
// ↓↓↓↓↓↓ ↓↓↓↓↓
return await waitAndMaybeReject();
}
catch (e) {
return 'caught';
}
}
Note agora que, como foi utilizado o operador await
, estamos de fato aguardando a conclusão da promessa retornada por waitAndMaybeReject
. Desse modo, no caso da promessa retornada por waitAndMaybeReject
for rejeitada, o bloco catch
será capaz de capturar a exceção.
A promessa, com o return await
não foi delegada por foo
a seu chamador. Ao contrário: a promessa foi aguardada por foo
e seu valor resolvido (ou rejeição) foram propriamente tratados por foo
.
Note que agora foo
retorna o valor resolvido pela promessa que waitAndMaybeReject
retorna, OU "caught"
, no caso da rejeição da promessa em questão.
Conclusão
De modo geral, return await
só faz diferença quando o return
é envolvido por algum bloco try
/catch
.
Se você precisa tratar o valor que será concluído por uma promessa antes de ser de fato retornado, utilize return await
. Caso contrário, return
(delegar a promessa) não faz diferença, já que, como vimos, toda função assíncrona sempre retorna uma promessa.
Friso que não há diferença em tempo de execução. A diferença de fato está onde a promessa irá ser concluída.
Pessoalmente, não gosto de usar return await
porque as pessoas não costumam entender de fato essa diferença (muitas vezes por nem saber que ela existe). Convenhamos que o JavaScript é e sempre foi uma linguagem com um enorme número de diferenças sutis como esta.
O código a seguir tem o mesmo efeito que return await
. A diferença é que, ao meu ver, é mais claro:
function foo() {
try {
const val = await waitAndMaybeReject();
return val;
} catch (e) {
return 'caught';
}
}
É o mesmo que:
function foo() {
try {
return await waitAndMaybeReject();
} catch (e) {
return 'caught';
}
}
Cabe a você decidir qual prefere.
Como o return await
só tem efeito diferencial quando está dentro de blocos try
/catch
, o ESLint fornece uma regra chamada no-return-await
que cuida disso para você.
Não acredito em você, mostre-me isso tudo!
Veja o exemplo funcional abaixo:
fooWithReturn(true)
.then((resolvedValue) => console.log('1 fooWithReturn(throw).then =', resolvedValue)) // <não executará>
.catch((errorValue) => console.log('1 fooWithReturn(throw).catch =', errorValue)); // Erro não tratado!
fooWithReturn(false)
.then((resolvedValue) => console.log('2 fooWithReturn(dont throw).then =', resolvedValue)) // Yay!
.catch((errorValue) => console.log('2 fooWithReturn(dont throw).catch =', errorValue)); // <não executará>
fooWithReturnAwait(true)
.then((resolvedValue) => console.log('3 fooWithReturnAwait(throw).then =', resolvedValue)) // caught
.catch((errorValue) => console.log('3 fooWithReturnAwait(throw).catch =', errorValue)); // <não executará>
fooWithReturnAwait(false)
.then((resolvedValue) => console.log('4 fooWithReturnAwait(dont throw).then =', resolvedValue)) // Yay!
.catch((errorValue) => console.log('4 fooWithReturnAwait(dont throw).catch =', errorValue)); // <não executará>
async function fooWithReturn(shouldThrow) {
try {
return waitAndMaybeReject(shouldThrow);
} catch (e) {
return 'caught';
}
}
async function fooWithReturnAwait(shouldThrow) {
try {
return await waitAndMaybeReject(shouldThrow);
} catch (e) {
return 'caught';
}
}
function waitAndMaybeReject(shouldThrow) {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (shouldThrow) {
reject('Erro não tratado!');
} else {
resolve('Yay!');
}
}, 500);
});
}
Os exemplos desta resposta foram baseados no artigo "await vs return vs return await", de Jake Archibald.