Modo estricto y eliminación de any
Habilite todos los indicadores estrictos en tsconfig, use unknown en lugar de any, aplique aserciones de tipos de forma segura y migre un archivo débilmente tipado a estricto.
Modo estricto y eliminación de any es una lección gratuita de Frontend Academy en CoddyKit. Esta es la lección 4 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Frontend Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Frontend Academy incluye 4 lecciones en total.
¿Por qué strict?
strict: true en tsconfig.json activa todas las opciones de seguridad de TypeScript: el estándar exigible en proyectos serios. Detecta errores relacionados con null, parámetros sin tipo y asignaciones inseguras en tiempo de compilación.
Qué habilita strict
strict es una opción general que activa: noImplicitAny, strictNullChecks, strictFunctionTypes, strictBindCallApply, strictPropertyInitialization, alwaysStrict, noImplicitThis y useUnknownInCatchVariables.
strictNullChecks
Sin esta opción, null y undefined se pueden asignar a cualquier tipo, lo que es una fuente constante de errores. Con ella, debe gestionar explícitamente los casos de null.
// Without strictNullChecks — runtime error:
function greet(name: string) { return name.toUpperCase(); }
greet(null); // compiler allows, crashes at runtime
// With strictNullChecks:
function greet(name: string | null) {
if (name == null) return '';
return name.toUpperCase();
}noImplicitAny
Sin esta opción, los parámetros sin una anotación de tipo adoptan any de forma predeterminada y eluden silenciosamente el sistema de tipos. Con noImplicitAny, debe anotarlos.
// Without noImplicitAny:
function format(value) { return value.toUpperCase(); } // value: any
// With:
function format(value: string) { return value.toUpperCase(); }strictPropertyInitialization
Las propiedades de clase sin un inicializador definido pasan a considerarse posiblemente undefined. Inicialícelas o utilice el operador de asignación definitiva !.
class User {
name!: string; // tell TS: I'll set this elsewhere
age = 0; // default initialiser
email: string; // ERROR with strictPropertyInitialization
constructor(email: string) { this.email = email; } // FIX: init in ctor
}Use unknown en lugar de any
any desactiva la comprobación de tipos. unknown es seguro en cuanto a tipos: debe acotarlo antes de usarlo. Prefiera siempre unknown.
// any — no checks, bug magnet:
function parse(input: any) {
return input.toUpperCase(); // compiler is fine, runtime may crash
}
// unknown — must narrow:
function parse(input: unknown) {
if (typeof input === 'string') {
return input.toUpperCase();
}
throw new Error('Expected string');
}Aserciones de tipos seguras
Si debe hacer una aserción porque conoce el tipo mejor que TS, prefiera la sintaxis as. No haga aserciones dobles (x as unknown as T) a menos que realmente no tenga otra opción; es una señal de problemas en el código.
const el = document.getElementById('app') as HTMLDivElement;
el.style.background = 'blue';
// Safer alternative: runtime check
const el = document.getElementById('app');
if (!(el instanceof HTMLDivElement)) throw new Error('app missing');
el.style.background = 'blue'; // narrowed to HTMLDivElementEliminar any de un proyecto
Estrategia: active strict y corrija los errores resultantes, un archivo cada vez. Use unknown y acótelo. Añada @ts-expect-error con un comentario TODO en los puntos problemáticos conocidos para que no puedan ignorarse.
Regla de lint: no-explicit-any
Añada @typescript-eslint/no-explicit-any a la configuración de ESLint para impedir que se añada nuevo código con any.
// .eslintrc.json
{
"rules": {
"@typescript-eslint/no-explicit-any": "error"
}
}strictFunctionTypes
Impone la comprobación contravariante de los parámetros de las funciones y evita asignar funciones cuyos tipos de parámetro sean más generales que los esperados, algo que provocaría un error en tiempo de ejecución.
Tipo de la variable catch
useUnknownInCatchVariables hace que catch (e) infiera e: unknown en lugar de any. Debe acotarlo antes de acceder a sus propiedades.
try {
doRisky();
} catch (e) {
// e is unknown
if (e instanceof Error) {
console.error(e.message);
} else {
console.error('Unknown error', e);
}
}Consejos para la migración
Active strict en los proyectos nuevos desde el primer día. En código heredado, active las opciones de forma gradual. Empiece por strictNullChecks, que ofrece el mayor beneficio, y después continúe con noImplicitAny. Use //@ts-expect-error en lugar de //@ts-ignore para que el comentario se elimine cuando se solucione el problema.
Comprobación rápida
¿Por qué unknown es más seguro que any cuando no conoce el tipo de un valor?
Repaso: modo strict
Active strict: true para obtener una seguridad completa. strictNullChecks obliga a gestionar null. noImplicitAny exige anotar los parámetros. strictPropertyInitialization comprueba los campos de clase. Use unknown en lugar de any y acótelo con protectores de tipo. Evite las aserciones dobles. Use no-explicit-any con lint. Migre el código heredado un archivo cada vez mediante marcadores @ts-expect-error.
Preguntas frecuentes
¿La lección «Modo estricto y eliminación de any» es gratis?
Sí — el texto completo de «Modo estricto y eliminación de any» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Frontend Academy, actualiza a CoddyKit PRO. El curso de Frontend Academy incluye 4 lecciones en total.
¿Qué aprenderé en «Modo estricto y eliminación de any»?
Habilite todos los indicadores estrictos en tsconfig, use unknown en lugar de any, aplique aserciones de tipos de forma segura y migre un archivo débilmente tipado a estricto. Practicas Frontend Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Frontend Academy?
No se requiere experiencia previa. Frontend Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 4 de 4.
¿Cuánto tiempo toma la lección «Modo estricto y eliminación de any»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Frontend Academy?
Sí. Cada lección de Frontend Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- Tipos de literales de plantilla
- Decoradores y metadatos
- TypeScript con React: genéricos, FC y hooks
- Modo estricto y eliminación de any