Деструктуризація об’єктів – це спосіб отримання властивостей об’єкта та присвоєння їх змінним. Це зручний інструмент, який дозволяє легко отримувати значення з об’єкта та розширює читабельність коду. У цьому розділі ми розглянемо основні аспекти деструктуризації об’єктів та надамо приклади її використання.

Основний синтаксис

const person = {
  name: "John",
  age: 30,
  gender: "male"
};

const { name, age, gender } = person;

console.log(name); // "John"
console.log(age); // 30
console.log(gender); // "male"

Значення за замовчуванням

Якщо властивість відсутня у об’єкта або має значення undefined, можна встановити значення за замовчуванням.

const person = {
  name: "John",
  age: 30
};

const { name, age, gender = "male" } = person;

console.log(name); // "John"
console.log(age); // 30
console.log(gender); // "male" (значення за замовчуванням)

Зміна імені змінної

Можна змінити ім’я змінної під час деструктуризації.

const person = {
  name: "John",
  age: 30
};

const { name: fullName, age: years } = person;

console.log(fullName); // "John"
console.log(years); // 30

Деструктуризація в циклах

Деструктуризацію можна використовувати під час перебору масиву об’єктів.

const people = [
  { name: "John", age: 30 },
  { name: "Jane", age: 25 }
];

for (const { name, age } of people) {
  console.log(`${name} is ${age} years old`);
}

Деструктуризація в функціях

Параметри функції також можна деструктуризувати.

const person = {name: 'John', age: 30};

function printUserInfo({name, age, email = 'unknown'}) {
	console.log(`User "${name}" is ${age} y.o. and has "${email}" email address.`);
}

printUserInfo(person); // User "John" is 30 y.o. and has "unknown" email address.

Глибока деструктуризація

Деструктуризація може бути глибокою для отримання вкладених властивостей.

const person = {
  name: "John",
  age: 30,
  address: {
    city: "New York",
    country: "USA"
  }
};

const { name, address: { city, country } } = person;

console.log(name); // "John"
console.log(city); // "New York"
console.log(country); // "USA"

Деструктуризація об’єктів робить код більш зрозумілим та спрощує доступ до властивостей об’єкта. Вона дозволяє ефективно робити розпакування значень та полегшує роботу з вкладеними структурами даних.