TypeScript / Coalescencia nula

Bienvenidos sean a este post, hoy veremos un operador muy particular.

Hasta ahora hemos visto que es una buena idea chequear si algun valor de nuestros codigo es de tipo null o undefined, esto para evitar principalmente errores. Esta caracteristica se agrego en el 2020 a javascript y typescript nos permite utilizarlo, la cual de una manera muy sencilla nos permitira proveer un valor predeterminado para cuando sea null o undefined, para entender el concepto vamos a analizar el siguiente ejemplo:

nulo.ts

function checkNull(a: number | undefined | null) {
        console.log("a: " + (a ?? "nulo o indefinido"));
}

checkNull(1);
checkNull(null);
checkNull(undefined);

Aqui tenemos una funcion que usaremos para chequear si el valor recibido es nulo o indefinido, para el argumento podemos permitir la recepcion de tres tipos de datos (number, null y undefined) y en el bloque mostraremos el valor recibido pero le aplicaremos el operador donde en caso de no ser un number, es decir se considera null o undefined, nos mostrara ese mensaje. Luego haremos tres llamados a la funcion donde pasaremos tres tipos de valores, veamos como es su salida:

$ node nulo.js
a: 1
a: nulo o indefinido
a: nulo o indefinido
$

Como pueden observar hizo lo solicitado, nos devolvio el valor cuando posee uno de tipo number y los otros al ser de tipo undefined o null nos devolvio el mensaje correspondiente. El operador de coalescencia puede ser muy practico para poder manejar estos tipos primitivos sin tener que recurrir a condicionales u otras herramientas para evitar errores con este tipo de datos.

Pero este chequeo no solo aplica a los tipos de datos null o undefined sino que tambien podemos aplicarlo para los operadores arimeticos, para ver este concepto analicemos el siguiente ejemplo:

function sumar(a: number, b: number | null | undefined) {
        let resultado = a + b;
        return resultado;
}

Por ejemplo, esta funcion recibe dos argumentos y en uno pueden ser de tipo null o undefined, en esta funcion las sumaremos y devolveremos el resultado pero como dijimos en el segundo argumento podemos recibir un valor de tipo null por lo tanto al compilarlo nos puede salir este mensaje:

error TS2533: Object is possibly 'null' or 'undefined'

Porque la posibilidad puede existir, para evitar esto podemos solucionarlo de la siguiente manera:

function sumar(a: number, b: number | null | undefined) {
        let resultado = a + (b ?? 0);
        return resultado;
}

En este caso aplicamos el operador coalescencial para el caso de cuando no sea un number lo transforma en 0 y evitar el error mencionado anteriormente. Como mencionamos anteriormente esta herramienta puede ser muy util para solucionar problemas de este estilo.

Nota:
Si utilizan commonjs no sucedera el error pero si usan ECMASCript si ocurrira, tengan esto en cuenta.

En resumen, hoy hemos visto al operador coalescencial, que es, para que sirve, como se utiliza y los beneficios que nos brinda para manipular los tipos null y undefined, espero les haya sido 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.