La mejora de objetos literales se utiliza para agrupar variables del ámbito global y convertirlas en objetos de JavaScript. Es el proceso de reestructurar o volver a armar.
Ejemplo 1:
<script>
// variable declaration
var name = "Duke";
var color = "Brown";
var age = 5;
// Using Object Literal Enhancement
// Combines all variables into a dog object
var dog = {name, color, age};
console.log(dog);
</script>
Salida: el nombre, el color y la edad ahora son claves del objeto perro .
{
name:"Duke",
color:"Brown",
age:5
}
Ejemplo 2: También podemos crear métodos de objeto con mejora de literal de objeto.
<script>
// variable declaration
var name = "Tike";
var color = "Black";
var age = 7;
// function declaration
var bark = function(){
console.log("Woof Woof!!");
}
// Using Object Literal Enhancement
// combines all variables into an anotherDog object
var anotherDog = {name, color, age, bark};
anotherDog.bark();
</script>
Producción:
Woof Woof!!
Ejemplo 3: También podemos usar la palabra clave “this” para acceder a las claves del objeto.
<script>
// Variable declaration
var name = "Lilly";
var color = "White";
var age = 3;
// function declaration
// using "this" keyword to access the object keys.
var barkWithName = function(){
console.log('Woof Woof!!, I am '
+this.name+' and I am a '
+this.age+' years old, '
+this.color+ ' coloured dog.Woof Woof!!');
}
// Using Object Literal Enhancement
// combines all variables into a yetAnotherDog object
var yetAnotherDog = {name, color, age, barkWithName};
yetAnotherDog.barkWithName();
</script>
Producción :
Woof Woof!!, I am lilly and I am a 3 years old, white coloured dog.Woof Woof!!
Ejemplo 4: al definir métodos de objetos, ya no es necesario utilizar la palabra clave de función . La mejora de objetos literales nos permite extraer variables globales en objetos y reduce la escritura al hacer que el
<script>
// Old syntax
var driver1 = {
name: "John",
speed: 50,
car:"Ferrari",
speedUp: function(speedup){
this.speed = this.speed + speedup;
console.log("new speed = "+ this.speed)
}
}
// New syntax without function keyword
const driver2 = {
name: "Jane",
speed: 60,
car:"McLaren",
speedUp(speedup){
this.speed = this.speed + speedup;
console.log("new speed = "+ this.speed)
}
}
</script>