TypeScriptIntermedio11 oct 2025
¡Tuplas elásticas! Cuando tu "array fijo" se estira sin preguntar 😱
snippet.typescript
type UserInfo = [string, number, boolean]; // [name, age, isActive]
function logAndAppend(data: (string | number | boolean)[]) {
console.log("Before append:", data);
data.push("extra"); // This is allowed by the function's signature
console.log("After append:", data);
}
const currentUser: UserInfo = ["Alice", 30, true];
console.log("Original currentUser:", currentUser);
logAndAppend(currentUser);
console.log("currentUser after function call:", currentUser);¿Qué crees que imprime?
✅ Salida Esperada
Original currentUser: [ 'Alice', 30, true ]
Before append: [ 'Alice', 30, true ]
After append: [ 'Alice', 30, true, 'extra' ]
currentUser after function call: [ 'Alice', 30, true ]⚠️ Salida Real
Original currentUser: [ 'Alice', 30, true ]
Before append: [ 'Alice', 30, true ]
After append: [ 'Alice', 30, true, 'extra' ]
currentUser after function call: [ 'Alice', 30, true, 'extra' ]¿Por qué pasa esto?
Aquí tenemos el **WTF de la semana**: ¡nuestras pobres tuplas, que creíamos inmutables en longitud, se convierten en chicle! 🍬
- Las **tuplas de TypeScript** (como `UserInfo`) prometen ser arrays de longitud fija y tipos específicos. Son como un equipo de fútbol con posiciones fijas: un portero, un defensa, etc. 🥅
- Pero hay un truco: una tupla `[T1, T2]` es **asignable** a un `(T1 | T2)[]`. Es decir, puedes pasar tu equipo de fútbol a una función que espera 'cualquier grupo de jugadores'.
- Dentro de `logAndAppend`, TypeScript ve solo un `(string | number | boolean)[]`. Y los arrays, ¡ay, los arrays!, son como adolescentes que crecen sin parar. `push` es totalmente válido.
- Como los arrays son **tipos por referencia**, la mutación dentro de la función afecta al `currentUser` original.
- Resultado: `currentUser` ¡ahora tiene 4 elementos! 🤯 El tipo `UserInfo` sigue diciendo `[string, number, boolean]`, pero miente descaradamente. Es como si el portero trajera a su primo al campo y nadie se diera cuenta hasta el pitido final. ¡Cuidado al pasar tus tuplas a funciones genéricas! Usa `readonly` si quieres verdadera inmutabilidad. 🛡️
Conceptos relacionados
tuplestype-safetymutability