¿Cómo usar Typescript con ES6 Promises nativo?

¿Qué es TypeScript?
TypeScript es un lenguaje de programación gratuito y de código abierto que fue desarrollado y mantenido por Microsoft. En realidad, proporciona herramientas de desarrollo altamente productivas para IDE de JavaScript y también para prácticas como la verificación estática. Incluso hace que el código sea más fácil de leer y comprender. Podemos hacer grandes mejoras sobre JavaScript simple usando TypeScript. Para hacer que el código tenga una forma más documentada, se prefiere TypeScript, que en sí mismo tiene la función de agregar tipo de datos (o tipo de retorno) en el código, lo que proporciona a cualquier usuario una mejor legibilidad.

ES6 y TypeScript: ES6 es una versión de ECMAScript (ES), que es una especificación de lenguaje de secuencias de comandos estandarizada por ECMA internacional. TypeScript nos brinda todos los beneficios de ES6 con mucha productividad. TypeScript admite funciones asincrónicas para máquinas que tienen generadores ES6 nativos. De esta forma, TypeScript permite el uso de promesas que son de ES6 nativo.

Podemos usar TypeScript con promesas nativas de ES6 de las siguientes maneras:

  1. La primera forma es agregando las siguientes líneas de código en el archivo tsconfig.json como se muestra a continuación:
    "compilerOptions": {
        "lib": ["es5", "es2015.promise"]
    }
    

    Esto incluirá la compatibilidad de las promesas nativas de ES6 sin establecer el objetivo en ES6.

  2. Otra forma de hacer lo mismo es agregar las siguientes líneas de código en el archivo tsconfig.json como se muestra a continuación:
    "compilerOptions": {
        "target": "ES6"
    }
    

    Al usar el código anterior, la Promesa debería existir en el tiempo de ejecución con seguridad.

  3. También hay una forma más efectiva de usar Typescript con promesas nativas de ES6. Los siguientes pasos incluyen:
    • Paso 1: Cree el archivo package.json con { } .
    • Paso 2: Llame a npm install –save @types/es6-promise . Esto cambiará package.json para incluir ES6-promise como una dependencia.
    • Paso 3: Luego, llame a tsc –init . Este comando crea el archivo tfconfig.json para nosotros.
    • Paso 4: Ahora, podemos usar la promesa en un archivo TypeScript usando var x: Promise;
    • Paso 5: Ejecute tsc -p para compilar el proyecto o programa que creó.

Todos los métodos anteriores tienden a funcionar en todos los navegadores. Por estos, podemos usar TypeScript con promesas nativas de ES6.

Ejemplo para demostrar dónde se usan las promesas en TypeScript en async/await.

Veamos cómo se usan las promesas en la función TypeScript. Para eso, se crea una promesa simple a continuación. Aquí, se dice que la promesa tiene el tipo genérico de strings y básicamente realiza dos operaciones, resolver o rechazar.

const val = new Promise((resolve, reject) => {});

Nuestra promesa se puede resolver o rechazar, lo que se lleva a cabo mediante el siguiente fragmento de código que se sabe que es la devolución de llamada.

val.then(value => {
  console.log('resolved', value);
});
  
val.catch(error => {
  console.log('rejected', error);
});

Aquí, la parte .then lleva a cabo la ejecución de resolución mientras que .catch se encarga de la parte de rechazo. Si se resuelve la promesa, se ejecutan las devoluciones de llamada. De lo contrario, se ejecutan las devoluciones de llamada catch.

Para resolver una promesa, use el siguiente código:

resolve("Hello");

Producción:

 resolved 'Hello'

El rechazo de una promesa debe hacerse sólo en casos excepcionales. No se recomienda rechazar una promesa utilizando una string sin formato. En cambio, es bueno usar un constructor de errores al rechazar una promesa.

El rechazo de una promesa se realiza mediante el siguiente código:

reject(new Error('failed'));

Producción:

rejected 'failed'

Así, las promesas de ES6 se usan junto con TypeScript para hacer que la ejecución de las devoluciones de llamadas sea más fácil y rápida simplemente usando resolver/rechazar.

Publicación traducida automáticamente

Artículo escrito por vidhyasri15101999 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *