TypeScript / strictFunctionTypes

Bienvenidos sean a este post, hoy seguiremos con mas opciones de configuracion.

Sabemos que en typescript podemos definir tipos y manejarlos pero el compilador es el encargado de verifficar que todos los tipos sean consistentes. Pero desgraciadamente esto no siempre es asi en las funciones. Por esta razon, esta opcion sera la encargada de supervisar la conducta de las mismas. Antes de comenzar con el ejemplo debemos crear el archivo tsconfig.json, para ello deben utilizar el comando tsc –init, y en este deben pasar la opcion strict de true a false. Lo siguiente sera descomentar la siguiente linea:

"strictFunctionTypes": true,

Con esto realizado podemos comenzar a analizar el siguiente codigo:

let numeroOstring: number | string;
let soloNumero: number = numeroOstring

Primero declaramos una variable que puede almacenar tipos number o string. Y este lo asignaremos a una que sola acepta number. Si lo compilamos veremos la siguiente salida:

$ tsc
ejemploTS.ts:2:5 - error TS2322: Type 'string | number' is not assignable to type 'number'.
  Type 'string' is not assignable to type 'number'.

2 let soloNumero: number = numeroOstring;
      ~~~~~~~~~~


Found 1 error in ejemploTS.ts:2

$

El compilador nos informa que si bien puede poseer uno de los valores y por ende asignarlo. Tambien se da cuenta que puede tomar el otro tipo y por ende no poder asignarlo. Por esta razon nos notifica esto. Este es un error basico pero ahora veamos como puede suceder con una funcion callback:

function funcion1(fn: (a: number | string) => void) {
        fn("prueba");
}
function funcion2(a: number) {
        console.log("a: " + a);
}

funcion1(funcion2);

La primera funcion es la que posee el callback, por ello como argumento recibe una funcion que a su vez puede recibir un valor de tipo string o number y no devuelve nada. En el bloque llamamos a la funcion recibida con un valor de los posibles. Lo siguiente es otra funcion donde solo recibe valores de tipo number y en el bloque muestra el valor recibido. Por ultimo, llamaremos a la primera funcion y le pasaremos la segunda funcion como argumento. Si lo compilamos veremos la siguiente salida:

$ tsc
ejemploTS.ts:8:10 - error TS2345: Argument of type '(a: number) => void' is not assignable to parameter of type '(a: string | number) => void'.
  Types of parameters 'a' and 'a' are incompatible.
    Type 'string | number' is not assignable to type 'number'.
      Type 'string' is not assignable to type 'number'.

8 funcion1(funcion2);
           ~~~~~~~~


Found 1 error in ejemploTS.ts:8

$

Vuelve a ocurrir lo mismo, si bien puede recibir el tipo que tiene asignado (la funcion que pasamos como argumento), a esta tambien le podemos pasar una de tipo string, como ocurre en el bloque, considera que puede derivar en un error por lo tanto nos informa eso y que el tipo pasado no es valido para la funcion. Por ultimo vamos a analizar lo mismo pero para el caso de la herencia mediante el siguiente codigo:

class Clase {
        mostrar() {}
}
class ClaseHija extends Clase {
        correr() {}
}

function usarMostrar(fn: (clase: Clase) => void) {
        let clase = new Clase();
        fn(clase);
}

usarMostrar((claseHija: ClaseHija) => { claseHija.correr(); });

Primero definimos una clase que solo posee un metodo y luego otra clase que sera heredera de la anterior y a su vez posee su propio metodo. Luego tenemos una funcion que recibe una funcion y esta a su vez posee un argumento de tipo Clase, la primera, y en el bloque de esta crearemos un objeto de la clase del argumento y se la pasamos a la funcion que recibimos. Por ultimo hacemos un llamado a la funcion pero le pasamos una funcion que recibe un argumento del tipo ClaseHija, y en este llamaremos al metodo de esta. Si lo compilamos y ejecutamos veremos esta salida:

$ tsc
ejemploTS.ts:12:13 - error TS2345: Argument of type '(claseHija: ClaseHija) => void' is not assignable to parameter of type '(clase: Clase) => void'.
  Types of parameters 'claseHija' and 'clase' are incompatible.
    Property 'correr' is missing in type 'Clase' but required in type 'ClaseHija'.

12 usarMostrar((claseHija: ClaseHija) => { claseHija.correr(); });
               ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  ejemploTS.ts:5:2
    5  correr() {}
       ~~~~~~
    'correr' is declared here.


Found 1 error in ejemploTS.ts:12

$

Si bien la clase heredera es parte y cumple con el tipo de dato pero como indica el error, el metodo que se llama no se encuentra en la clase madre. Recuerden que la herencia es siempre hacia abajo, es decir de la clase madre hacia la hija pero nunca de la hija a la madre. Por lo tanto esta situacion siempre va a generar una excepcion de ejecucion. Como pueden ver podemos generar errores en los argumentos de nuestras funciones como vimos en los distintos casos hasta inclusive en una herencia.

En resumen, hoy hemos visto a strictFunctionTypes, que es, para que sirve, como se utiliza, tambien hemos comentado las distintas posibilidades de errores que pueden surgir. Espero les haya resultado de utilidad sigueme en tumblr, Twitter o Facebook para recibir una notificacion cada vez que subo un nuevo post en este blog, nos vemos en el proximo post.