Обычный вариант записи присвоения имён переменных
В JavaScript существует формат присвоения, при помощи которого можно получать имена новых переменных так, чтобы значения в этих переменных подхватывались из одноимённых ключей самого объекта.
В чём суть? Представим, что у нас имеется объект вида:
let obj = {aa: 1, bb:2};
В обычной ситуации, если мы хотим отдельно работать со значениями ключей этого объекта, мы бы создавали в Блоке (Block) имена переменных равные именам ключей. Почему так? Это просто удобно — легче читать код.
Мы бы записали следующее:
let aa = obj.aa; let bb = obj.bb;
Давайте посмотрим на это из консоли.
Если визуально смотреть на эту синтаксическую конструкцию, то можно заметить повторения.
Присвоение деструктуризации
В JavaScript есть способ более короткого написания подобного функционала — присваиваем то, что деструктурировали.
let obj = {aa: 1, bb:2}; let {aa, bb} = obj;
Мы как бы меняем местами фигурные скобки относительно знака равенства. Сперва может показаться, что мы пытаемся присвоить объект, но это не так.
Мы пытаемся создать переменные, которые находятся внутри фигурных скобок. Если у объекта есть значение под одноимённым ключом, тогда для новой переменной присваивается это значение.
Пробуем такой вариант написания в консоли.
Обратите внимание! До деструктурирования объекта мы пробовали обращаться к переменным с именами «aa» и «bb«, но получали ссылочную ошибку (Uncaught ReferenceError: aa is not defined) так как среда выполнения кода ещё ничего не знала об этих идентификаторах привязки.
После деструктурирования переменные стали доступны и в них начали храниться значения.
Информационные ссылки
Стандарт ECMAScript — Раздел «13.15.5 Destructuring Assignment» — https://tc39.es/ecma262/multipage/ecmascript-language-expressions.html#sec-destructuring-assignment
