Por fin… Una publicación sobre Por fin en promesas | Programar Plus

“¿Cuándo finally disparar en una promesa de JavaScript? Esta es una pregunta que me hicieron en un taller reciente y pensé en escribir una pequeña publicación para aclarar cualquier confusión.

La respuesta es, para citar a Snape:

…siempre.

La estructura básica es así:

try {
  // I’ll try to execute some code for you
}
catch(error) {
  // I’ll handle any errors in that process
} 
finally {
  // I’ll fire either way
}

Tomemos, por ejemplo, este ejemplo de un generador de chistes de Chuck Norris, completo con contenido de la API de la base de datos de Chuck Norris. (Aparte: encontré esta API de la increíble lista de API abiertas de Todd Motto, que es excelente para demostraciones y proyectos paralelos).

ver la pluma
¡por fin! chistes de chuck norris! por Sarah Drasner (@sdras)
en CodePen.

async function getData() {
  try {
    let chuckJokes = await fetch(`https://api.chucknorris.io/jokes/random`)
      .then(res => res.json())
    
    console.log('I got some data for you!')
    document.getElementById("quote").innerHTML = chuckJokes.value;
  } 
  catch(error) {
    console.warn(`We have an error here: ${error}`)
  }
  finally {
    console.log('Finally will fire no matter what!')
  }
}

En la consola:

Ahora, introduzcamos un error tipográfico en la API y accidentalmente coloquemos un montón de erres en la URL de la API. Esto resultará en nuestra try sentencia fallida, lo que significa que el catch ahora arroja un error.

async function getData() {
  try {
    // let's mess this up a bit
    let chuckJokes = await fetch(`https://api.chucknorrrrris.io/jokes/random`)
      .then(res => res.json())
    
    console.log('I got some data for you!')
    document.getElementById("quote").innerHTML = chuckJokes.value;
  } 
  catch(error) {
    console.warn(`We have an error here: ${error}`)
  }
  finally {
    console.log('Finally will fire no matter what!')
  }
}

Consola:

Una pieza gigante e importante que el ejemplo no ilustra es que el finally cuadra se ejecutará incluso si en el try o catch bloque, un return o break declaración detiene el código.

¿Cuándo usarías esto?

Lo he encontrado particularmente útil en dos situaciones diferentes, aunque estoy seguro de que hay otras:

• Cuando, de lo contrario, duplicaría el código que se necesita en los bloques de prueba y captura. Aquí hay un ejemplo en una receta del libro de cocina Vue que escribí. Apagué el estado de carga en un finally cuadra. Esto incluye, como en el ejemplo anterior, donde necesito cambiar la interfaz de usuario de alguna manera en cualquier caso.
• Cuando hay algo de limpieza que hacer. Oracle menciona esto en su documentación. Es Java, pero se aplican las mismas premisas.

Finalmente no es útil tan a menudo como try y catch, pero vale la pena señalarlo para algunos casos de uso. ¡Espero que eso lo aclare!