ProgramaciónDesarrollador Frontend

¿Puede hablar sobre la palabra clave 'readonly' en TypeScript? ¿Cómo y cuándo se debe aplicar? ¿Cuáles son sus características en comparación con const?

Supere entrevistas con el asistente de IA Hintsage

Respuesta.

La palabra clave readonly en TypeScript se utiliza para las propiedades de objetos y arreglos, para prohibir su modificación después de la inicialización:

  • Se utiliza en la definición de interfaces, tipos y clases, para que no se pueda cambiar el valor de un campo después de su establecimiento.
  • readonly se aplica solo a las propiedades de los objetos, y no a las variables.
  • A diferencia de const, que indica que una variable no puede ser reasignada, pero no prohíbe cambiar el contenido de un objeto, readonly sí prohíbe la modificación del propio campo o elemento del arreglo.

Ejemplo:

interface User { readonly id: number; name: string; } const user: User = { id: 1, name: 'Anna' }; user.id = 2; // Error: Cannot assign to 'id' because it is a read-only property.

Para los arreglos:

const nums: readonly number[] = [1, 2, 3]; nums.push(4); // Error: Property 'push' does not exist on type 'readonly number[]'.

Pregunta trampa.

¿Cuál es la diferencia entre const y readonly en TypeScript? ¿Pueden reemplazarse mutuamente?

Respuesta: No, no pueden. const es una restricción sobre la variable misma (no se puede reasignar), mientras que readonly es una restricción sobre propiedades individuales de un objeto o elementos de un arreglo, pero la variable misma puede ser modificada (si lo permite el contexto).

Ejemplo:

const arr: readonly number[] = [1, 2, 3]; // arr = [2, 3, 4]; // Error debido a const // arr[0] = 5; // Error debido a readonly

Historia

En un proyecto para una plataforma financiera, al trabajar con los datos de los usuarios, se utilizaron arreglos normales number[] en lugar de readonly number[]. Debido a esto, una función accidentalmente modificó los datos de entrada: los valores de las sumas en los arreglos se usaron en diferentes lugares, lo que llevó a discrepancias en los informes. El error fue descubierto varios días después, lo que costó a la empresa tiempo en auditoría y recuperación de datos.


Historia

En una API interna, se confundieron const y readonly, asumiendo que const user: User evitaría la modificación de los campos. Como resultado, fue posible cambiar los campos del objeto, aunque esto era inaceptable según los requisitos. Debido a la falta de conocimiento sobre la diferencia, hubo filtraciones de datos confidenciales entre servicios.


Historia

Dentro de una biblioteca de código abierto, accidentalmente se hizo que una de las estructuras de datos fuera modificable porque se olvidó de incluir readonly en la definición de la interfaz. Esto permitió a los desarrolladores externos modificar datos privados en tiempo de ejecución, lo que causó errores que requirieron refactorización.