ProgramaciónDesarrollador Frontend

¿Cómo funciona el parámetro de verificación estricta de null y undefined — strictNullChecks en TypeScript? ¿Cómo afecta su activación a la programación diaria?

Supere entrevistas con el asistente de IA Hintsage

Respuesta

El parámetro strictNullChecks determina si TypeScript considerará null y undefined como tipos separados o no. Si el parámetro está desactivado (por defecto hasta la versión 2.0), las variables de cualquier tipo pueden tomar los valores null y undefined sin errores de compilación. Si se activa (strictNullChecks: true), estos valores se consideran incompatibles con otros tipos, a menos que se especifique explícitamente.

Ejemplo:

// strictNullChecks: false let name: string = null; // OK // strictNullChecks: true let title: string = null; // ¡Error! let title2: string | null = null; // OK, unión de tipos explícita

Activar la verificación estricta ayuda a evitar errores en las primeras etapas del desarrollo, cuando las funciones/métodos no cuentan con la posibilidad de recibir null o undefined.

Pregunta capciosa

¿Se puede asignar el valor undefined a una variable de tipo number cuando strictNullChecks está activado?

Respuesta: No, si strictNullChecks está activado, no se puede asignar undefined a una variable de tipo number — solo si se declara explícitamente el tipo como number | undefined.

Ejemplo:

let count: number = undefined; // Error de TS al activar strictNullChecks: true let count2: number | undefined = undefined; // OK

Ejemplos de errores reales debido a la falta de conocimiento de los matices del tema.


Historia

En un gran proyecto de node.js, los desarrolladores desactivaron la verificación estricta de null/undefined para "facilitar la migración". Como resultado, un año después del lanzamiento, una de las funciones de la API devolvió undefined en lugar de un valor numérico. El código del cliente no estaba preparado para esto, lo que causó que la aplicación del lado del usuario fallara fatalmente en un simple cálculo response.count + 1.


Historia

En un proyecto de ecommerce, la colección de productos llegó del servidor como null, y no como []. El componente de UI intentó hacer un map sobre estos productos, lo que provocó un error de renderización. Activar strictNullChecks destacó casi 40 lugares similares de inmediato.


Historia

En una gran biblioteca, con el tiempo, el número de valores "permitidos" para algunas props del API del componente se convirtió en string | null | undefined. Esto llevó a una gran cantidad de situaciones no manejadas. Después de activar strictNullChecks, se pudieron capturar errores poco evidentes que provocaban caídas de la interfaz en configuraciones específicas.