Um momento
Aula 03
Cursos / JavaScript: Async / Await
O Valor Retornado Pela Função Async no JavaScript

Summary

Resumo da Aula sobre SYNC O8

Nesta aula, aprendemos sobre a palavra-chave async e seu impacto no retorno de funções em JavaScript.

Estrutura da Aula

  1. Introdução à Função obterDados:

    • Criamos uma função chamada obterDados que retorna uma lista de três objetos, cada um com uma propriedade ID.
  2. Adicionando async:

    • Modificamos a função para async obterDadosDois.
    • Ao chamar obterDados, em vez de retornar os objetos diretamente, foi retornada uma promessa.
  3. Manuseio de Promessas:

    • Para acessar os dados da promessa, podemos usar:
      • O método .then() para manipulação assíncrona.
      • O await, que deve estar dentro de uma função marcada como async.
    • Um exemplo foi fornecido de como retornar os dados de obterDados usando await em uma nova função.
  4. Exemplo de Retorno:

    • Ao modificar o retorno da função para incluir uma string, observou-se que ainda retornava uma promessa, demonstrando que o async sempre embrulha o retorno em uma promessa.
  5. Revisão da Aula:

    • O retorno de funções async é sempre encapsulado em promessas, que podem ser manipuladas usando then ou await.
    • Para o uso de await, é necessário estar dentro de uma função async.
    • O bloco try-catch pode ser usado para tratar erros em funções async, oferecendo um método alternativo ao then e catch.

Conclusão

A aula forneceu uma introdução ao uso de async e await em JavaScript, destacando como elas simplificam o tratamento de operações assíncronas em comparação com o uso de promessas tradicionais. Esperamos que os alunos tenham gostado e estejam prontos para aplicar esses conceitos.

Video Transcript

Estamos de volta, vamos continuar aqui, aprender sobre SYNC O8. Nesta aula a gente vai só, ah, uma olhada no que acontece quando a gente retona, valores da função normal da função A5. Deixa eu limpar aqui esse console aqui do Firefox. Ah, então vamos fazer uma função, por exemplo, obter dados. Essa função obter dados vai retornar uma lista de objetos dessa maneira aqui. Não importa muito o que são, só vou adicionar três objetos. Cada objeto é uma propriedade chamada ID. Não vai importar muito, o que importa é que a gente vai aprender sobre o valor retornado. Então dessa maneira se definir se obter dados, se chamar obter dados, que a gente espera que vai ser retornado. Corretamente a lista com os três objetos, faz sentido, não é? Mas agora o que acontece se a gente adicionar a palavra chave A5 antes da função obter dados? Vamos transformar essa função obter dados, vamos chamar obter dados dois, certo? Oter dados dois. Vamos transformar essa função na função sincrona, A5. Desculpa, dessa maneira aqui, vamos ver no que dá. Está aí, definir a função nesse caso, com a palavra A5. Agora vou chamar obter dados, esqueci de dois, desculpa, vamos obter dados mesmo, vai dessa maneira mesmo. Vou chamar, olha aí no que dá. Para retornar, o valor retornado foi uma promessa, não foi o objeto. Então esse é um detalhe da função A5, se você retornar alguma coisa aqui, algum valor da função A5, esse valor aqui automaticamente vai ser embrulhado numa promessa, que vai ser realizada na mesma hora nesse caso. Você note que você dá um olhado no objeto promise, o estado vai ser fulfilled, realizada e o valor vai ser aquela caladista dos três objetos. Certo então, para poder realmente pegar esses caras, você tem que fazer um das maneiras de fazer isso, usando aquele velho DEN, dados, aí faz o que quiser, consola o dados, por exemplo. Essa é uma maneira, ou você pode usar o await, obter dados, dessa maneira, mas neste caso vai ter problema porque quando a gente está aqui no console, a gente não está dentro de uma função de A5. Então para poder usar o await, sempre tem que ter o quê? Tem que estar dentro de uma função A5, então tem que dar o A5, vamos obter dados, por exemplo, fazer outra função só para fazer o A5 aqui, para poder chamar o await. Então você dá o await, só pode dar dentro da função A5. Aí você põe os dados aqui dentro de uma variável, aí vamos dar o console log, aí vamos chamar a função, porque aqui a gente só definiu, não executou. Aí vamos obter dados, chamou e retornou aqui no console log, deu o console log aqui, olha aqui, listo. Certo? Esse valor aqui que você está vendo aqui é o valor retornado, você está vendo essa seta aqui, é porque a gente não retornou nada explicitamente, por isso que apareceu um negócio aqui da promessa, mas se eu tivesse definido aqui, olha aqui, com return, sei lá, um string A, olha no que dá. Vamos chamar o await dados de novo, deixa eu... A. Cadê? Vamos obter dados. Cadê? Não pegou. Está novamente, é 5 points, vamos obter dados, deu o console log, deixa eu só comentar aqui, para ver no que dá, retorno A. Vamos obter dados. Retornou a promessa, a gente quer dar um dedo aqui, valor, console log, valor, está retornando lá, isso é. Então, está funcionando mesmo, porque a gente não tinha explicitamente retornado e sempre retornou a promessa da função A5, não é? Em qualquer caso, vamos revisar o que a gente fez aqui. Então, nessa aula, a gente aprendeu que o que acontece quando a gente adiciona a palavra chave A5 antes de definir a função, aquilo que for retornado se torna uma promessa sempre retornado a função A5, que você tem que lidar usando seja o then ou o await, mas o await sempre tem que estar dentro do queiro, uma função que é A5, não se esqueça disso, certo? Então, por essa aula é só a J5 await, uma introdução, e você pode tentar usar o A5 await ao invés de usar o then, o await também, se você quiser aprender mais, você vai ver que em vez de, quando você tiver aquele catch block, tem o then e tem o catch, o catch, você pode usar o try and catch dentro da função A5, que ele vai ser rejeitado automaticamente retornado pela função A5, a função A5 retorna a promessa com um valor rejeitado, se você usar o try catch, o block de try catch dentro da função A5, isso é um mais avançado, mas essa aula só foi para a introdução do A5 await, certo? Então, espero que tenham gostado e até a próxima. Muito obrigado.
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: