Объекты | Object

В ES6 добавлен синтаксис который упростил работу с простыми объектами.

  • В ES6 если название свойства совпадает с названием переменной то можно указать только свойство. Значение автоматически вставится из переменной с таким же названием.
let firstName = 'Bill',
    lastName = 'Gates',
	email = 'billgates@microsoft.com';

let person = {
    firstName,
    lastName,
    email
};

console.log(person); // Object { firstName: "Bill", lastName: "Gates", email: "billgates@microsoft.com" }
  • В ES6 можно упростить написание названия метода. Вместо
let person = {
    firstName,
    lastName,
    email,
    sayHello: function() {
        console.log(`Hi my name is ${this.firstName} ${this.lastName}`);
    }
}

можно написать

let person = {
    firstName,
    lastName,
    email,
    sayHello() {
        console.log(`Hi my name is ${this.firstName} ${this.lastName}`);
    }
};
  • В ES6 можно динамически указывать название свойства
let property = 'lastName';
let person = {
    [property]: 'Bill'
};

Или другой пример:

function createCar(prop, value){
	return {
		[prop]: value,
		['get' + prop](){
			return this[prop];
		}
	};
}
console.log(createCar('vin', 1)); // Object { vin: 1, getvin: createCar/<() }

Можно создавать специальные свойства которые внутри объекта вглядят и работают как методы, а снаружи выглядят и работают как свойства. Эти свойства называются get и set.

let person = {
	firstName,
    lastName,
	email,
	get fullName() {
        return this.firstName + ' ' + this.lastName;
    },
    set fullName(value) {
		this.firstName = value;
	}
};
console.log(person); // Object { firstName: "Bill", lastName: "Gates", email: "billgates@microsoft.com", fullName: Getter }
person.fullName = 'Jon';
console.log(person); // Object { firstName: "Jon", lastName: "Gates", email: "billgates@microsoft.com", fullName: Getter }