Отличная функция в ES6
До ES6, например, при обычном назначении мы извлекали по одному фрагменту данных за раз.
Выход.
Что такое деструктурирующее задание?
В JavaScript ES6 был добавлен новый синтаксис для создания нескольких переменных из индекса массива или свойства объекта, который называется деструктуризация. Это правило предписывает использовать деструктуризацию вместо доступа к свойству через выражение члена.
Вот простые деструктурирующие присваивания с использованием массивов значений.
Этот код выполняет тот же вывод, что и предыдущий, и извлекает только то, что нам нужно.
Разрушение объекта
Деструктуризация объектов позволяет нам извлекать значения свойств в пакетном режиме с помощью шаблонов, которые выглядят как объектные литералы.
Базовый синтаксис
Мы можем думать о шаблоне как о прозрачном листе, который мы помещаем поверх данных: ключ шаблона ‘user_name’ имеет совпадение в данных. Таким образом, мы также можем объектно-деструктурировать примитивные значения.
И мы также можем объектно-деструктурировать массивы следующим образом.
Можем выполнять задания без декларации
Переменной может быть присвоено значение с деструктуризацией отдельно от ее объявления.
Отсутствующие свойства при деструктуризации объекта
Если свойство в шаблоне объекта не имеет соответствия в правой части, мы получаем значение undefined.
Если мы хотим использовать другое значение, нам нужно указать значение по умолчанию.
Мы не можем деструктурировать объекты undefined и null
Деструктуризация объекта завершается ошибкой только в том случае, если деструктурируемое значение равно undefined или null.
Например, со значением undefined.
Выход.
Деструктуризация массива
Деструктуризация массива позволяет извлекать значения элементов массива с помощью шаблонов, которые выглядят как литералы массива.
Мы можем пропустить элементы, указав дыры внутри массивов. Элемент массива с индексом 1 игнорируется.
Отсутствующие элементы в деструктуризации массива
Если элемент в шаблоне массива не имеет соответствия с правой стороны, вы получите значение undefined.
Выход.
Мы также можем установить значения по умолчанию в Array-destructuring.
Мы не можем деструктурировать не повторяющиеся значения в массиве
Деструктуризация массива требует, чтобы деструктурированное значение было повторяемым. Следовательно, мы не можем деструктурировать массивы undefined и null. Но мы также не можем деструктурировать non-iterable объекты в массивах.
Выход.
Магия разрушения
Мы можем использовать деструктуризацию для обмена значениями переменных в JavaScript?
До. Как поменять местами две переменные?
Теперь мы можем использовать деструктуризацию массива, чтобы поменять местами значения двух переменных без временной переменной.
Выход.
Итак, мы можем поменять местами значения нескольких переменных без каких-либо временных переменных.
Операции, возвращающие массивы
Деструктуризация массива полезна, когда операции возвращают массивы.
Мы пропустили элемент с индексом 0, потому что он соответствует целому.
Напишите функцию, которая возвращает несколько значений
Деструктуризация очень полезна, если функция возвращает несколько значений.
Определения параметров аналогичны деструктурированию
Фактически, следующие два объявления функций эквивалентны.
Вложенная деструктуризация
Деструктуризация также работает с вложенными объектами.
Легко, правда?
Получите доступ к экспертному обзору - Подпишитесь на DDI Intel
