Intermediojavascript
Objetos y Prototipos
Domina los objetos literales, desestructuracion, spread operator y la cadena de prototipos.
Objetos literales
Los objetos son colecciones de pares clave-valor. Son la estructura fundamental de JavaScript y la base de JSON.
javascript
1const usuario = {
2 nombre: "Ana",
3 edad: 28,
4 activo: true,
5 saludar() {
6 return `Hola, soy ${this.nombre}`;
7 }
8};
9
10console.log(usuario.nombre); // "Ana"
11console.log(usuario["edad"]); // 28
12console.log(usuario.saludar()); // "Hola, soy Ana"Desestructuracion
La desestructuracion permite extraer valores de objetos y arrays en variables individuales de forma concisa.
javascript
1const { nombre, edad, ...resto } = usuario;
2console.log(nombre); // "Ana"
3console.log(resto); // { activo: true, saludar: [Function] }
4
5// En parametros de funcion
6function mostrarPerfil({ nombre, edad }) {
7 console.log(`${nombre} tiene ${edad} anios`);
8}
9mostrarPerfil(usuario);Spread y Rest operator
El operador
... (spread) permite expandir un iterable. Como rest, recoge los argumentos restantes en un array.javascript
1const original = { a: 1, b: 2 };
2const copia = { ...original, c: 3 };
3console.log(copia); // { a: 1, b: 2, c: 3 }
4
5const nums = [1, 2, 3];
6const masNums = [...nums, 4, 5];
7console.log(masNums); // [1, 2, 3, 4, 5]
8
9function sumar(...numeros) {
10 return numeros.reduce((a, b) => a + b, 0);
11}
12console.log(sumar(1, 2, 3, 4)); // 10Prueba lo aprendido
Escribe código JavaScript y ejecútalo directamente en el navegador.
Editor de Códigojavascript
1const usuario = {
2 nombre: "Ana",
3 edad: 28,
4 activo: true,
5 saludar() {
6 return `Hola, soy ${this.nombre}`;
7 }
8};
9
10console.log(usuario.nombre); // "Ana"
11console.log(usuario["edad"]); // 28
12console.log(usuario.saludar()); // "Hola, soy Ana"