Деструктуризация объекта
пример деструктуризации объекта в JavaScript
Деструктуризация - синтаксис, с помощью которого можно распаковать содержимое объетка в совокупность переменных, в определенных ситуациях это очень удобно. Хотя деструктуризация обычно используется для объектов и массивов, в отношении функций такой подход тоже бывает эффективным.
Синтаксис:
let {var1, var2} = {var1:…, var2:…}
Левая сторона: “шаблон” для существующих свойств (чаще всего, это список названий переменных {…}), правая сторона - объект.
Например, у нас есть объект JavaScript, описывающий страны. Так же есть функция explain(country), которая выводит интересную информацию о странах в консоли.
const theNetherlands = {
name: 'Нидерланды',
favoriteFood: 'сыр',
averageHeight: 182,
population: 17180000,
}
function explain(country) {
console.log(`Жители страны ${country.name} имеют средний рост ${country.averageHeight} см. и любят есть ${country.favoriteFood}!`);
}
explain(theNetherlands);
В консоли мы получим:
Жители страны Нидерланды имеют средний рост 182 см. и любят есть сыр!
Тем не менее, мы можем не так часто повторять слово country
в исходном коде. Для этого достаточно достаточно деструктуризировать объект country
в переменные name
, averageHeight
и favoriteFood
, например, так:
function explain({ name, averageHeight, favoriteFood }) {
console.log(`Жители страны ${name} имеют средний рост ${averageHeight} см. и любят есть ${favoriteFood}!`);
}
Так же, можно оставить для функции explain параметр country и деструктуризировать саму функцию следующим образом:
function explain(country) {
const { name, averageHeight, favoriteFood } = country;
console.log(`Жители страны ${name} имеют средний рост ${averageHeight} см. и любят есть ${favoriteFood}!`);
}
Спасибо за внимание.