45
loading...
Fundamentos de TypeScript 🦆| #5: Objetos
Como ya sabemos los objetos son una estructura de datos muy usada en JavaScript que consiste en pares clave-valor.
Por ejemplo:
const perro = {
nombre:"Boby",
edad:5,
}Es posible añadir nuevas propiedades así:
const perro = {
nombre:"Boby",
edad:5,
}
perro.color = "negro";
/*
const perro = {
nombre:"Boby",
edad:5,
color:negro,
}
*/En TypeScript un objeto se escribe exactamente igual que en JavaScript, pero con una gran diferencia en cuanto a funcionalidad:
const perro = {
nombre:"Boby",
edad:5,
}Este objeto tiene una estructura implícita que TypeScript hace que el dev deba respetar, podemos ver que el objeto solo tiene 2 propiedades:
nombre de tipo string y edad de tipo number, ergo la estructura sería la siguiente:const perro: {
nombre:string;
edad:number;
} = {
nombre:"Boby",
edad:5,
}Como notas, en vez de indicar un tipo de dato a la variable
Esta sintaxis de objeto es explícita puesto que somos nosotros quienes debemos indicar los campos del objeto con sus correspondientes tipos. Se aconseja usar la sintaxis implicita, ya que TypeScript es lo suficientemente inteligente para inferir dicha estructura con solo proporcionar las claves y los valores.
perro, la inicializamos con un objeto que dará estructura al objeto per se.Esta sintaxis de objeto es explícita puesto que somos nosotros quienes debemos indicar los campos del objeto con sus correspondientes tipos. Se aconseja usar la sintaxis implicita, ya que TypeScript es lo suficientemente inteligente para inferir dicha estructura con solo proporcionar las claves y los valores.
Por ende, ambos objetos se consideran el mismo en TypeScript.
const perro = {
nombre:"Boby",
edad:5,
}
const perro: {
nombre:string;
edad:number;
} = {
nombre:"Boby",
edad:5,
}Ambos objetos son iguales en cuanto a sintaxis
En Javascript al intentar acceder a un propiedad inexistente de un objeto obtenemos un
undefined:const perro = {
nombre:"Boby",
edad:5,
}
console.log(perro.nombre); // "Boby"
console.log(perro.sexo); // undefinedY al intentar añadirla basta con hacer lo siguiente:
const perro = {
nombre:"Boby",
edad:5,
}
perro.sexo = "macho"
/*
const perro = {
nombre:"Boby",
edad:5,
sexo:"macho"
}
*/En TypeScript hacer esto ya no es posible, si lo intentamos obtendremos un error como el siguiente:
const perro = {
nombre:"Boby",
edad:5,
}
perro.sexo = "macho"Property 'sexo' does not exist on type '{ nombre: string; edad: number; }'.
Nos indica que el el objeto
perro nunca declaramos una propiedad sexo, por ello no es posible agregarla.Del mismo modo no tendremos un error similar si intentamos acceder a una propiedad que no existe.
45