Paracetamol.js💊| #131: Explica este código JavaScript

¿Explica el siguiente código JavaScript?

Dificultad: Avanzado

const fetchData = (url) => {
  return fetch(url)
    .then(res => res.json())
    .then(res => console.log(res))
    .catch(err => console.log(err))
}

fetchData("https://jsonplaceholder.typicode.com/users")

¿Cuál de las siguientes opciones es equivalente a fetchData?
A.

const fetchDataA = (url) => {
  try{
    const res = fetch(url);
    const data = res.json();
    console.log(data);
  }catch(err){
    console.log(err)
  }
}
fetchDataA("https://jsonplaceholder.typicode.com/users")

B.

const fetchDataB = async(url) => {
  try{
    const res = await fetch(url);
    const data = await res.json();
    console.log(data);
  }catch(err){
    console.log(err)
  }
}
fetchDataB("https://jsonplaceholder.typicode.com/users")

C.

const fetchDataC = (url) => {
  try{
    const res = await fetch(url);
    const data = await res.json();
    console.log(data);
  }catch(err){
    console.log(err)
  }
}
fetchDataC("https://jsonplaceholder.typicode.com/users")

D. Ninguna de las anteriores.

Respuesta en el primer comentario.

---

Comments

[Cristian Fernando]

Respuesta:
B.

const fetchDataB = async(url) => {
  try{
    const res = await fetch(url);
    const data = await res.json();
    console.log(data);
  }catch(err){
    console.log(err)
  }
}
fetchDataB("https://jsonplaceholder.typicode.com/users")

Puntos a considerar al momento de usar funciones asíncronas con sintaxis async await:

• Una función async await siempre regresa una promesa.
• Solo es posible usar la palabra reservada await dentro de una función async.
• Podemos usar n veces await dentro de una función async.

No es posible resolver problemas asíncronos con código síncrono como en fetchDataA.

Recuerda que async await solo es una manera mas sencilla de escribir código asíncrono, el uso de esta sintaxis es preferencia de cada desarrollador pero usualmente es muy aconsejable usar funciones escritas de esta manera.

Finalmente, no siempre funciones async await son mejores en todos los casos, por ejemplo si queremos usar promesas en paralelo es mucho mejor usar directamente el objeto Promise con sus métodos como por ejemplo Promise.all, etc.