Деструктурирование, также известное как "деструктурирование назначений", представляет собой выражение JavaScript, позволяющее распаковывать значения из массивов или свойства объектов в отдельные переменные.
Как разработчики, мы стремимся придерживаться стандартов DRY (Dне Rповторять Yсебя) и писать чистый, понятный код. Благодаря деструктуризации мы можем писать меньше строк кода и лучше понимать, какую информацию мы хотим извлечь из объекта.
Обычно в JavaScript, если мы хотим присвоить данные отдельным переменным из объекта верхнего уровня, нам нужно сделать что-то вроде этого.
Как видите, этот код довольно повторяющийся. Сначала нам нужно объявить две переменные, type и nickname. Имена этих переменных будут указывать на определенные атрибуты с теми же именами в нашем Object, то есть squirtle.type и squirtle.nickname. Наконец, мы назначим значения атрибутов, равные созданным переменным.
С помощью деструктуризации приведенный выше код можно получить всего одной строкой.
Разве это не выглядит намного чище? Деструктурировать вложенные объекты так же просто.
К счастью, деструктурирование не ограничивается только объектами, его можно использовать и с массивами.
При деструктурировании массивов мы можем выбирать, какие элементы мы хотим назначить с помощью ,. Символ , указывает, что элемент в этой позиции должен быть исключен из деструктурированного присваивания.
Строки также могут быть деструктурированы так же, как и массивы, их просто нужно сначала преобразовать в массив с .split(). Как и в случае с массивами, часть строки может быть опущена с помощью ,.
Значения по умолчанию
Переменным можно присвоить значения по умолчанию посредством деструктуризации, что полезно, когда распакованное значение равно undefined.
Значение type равно undefined , поскольку переменная была объявлена без значения. Поскольку const использовался для объявления type, его значение не может быть изменено с undefined. Использование значений по умолчанию может помочь вам избежать подобных проблем при деструктуризации.
Вывод
Деструктуризация — это быстрый и простой способ очистить ваш код, когда вы присваиваете данные переменным из объектов, массивов и строк. С помощью деструктуризации вы можете выбрать, какие фрагменты данных вы хотите извлечь и назначить, а также установить значения по умолчанию.
Если вы впервые экспериментируете с деструктурированием, это может показаться немного сложным для понимания. Однако с практикой вы сможете использовать деструктурирование и мгновенно пожинать его плоды.
