Привет, ребята! Надеюсь, у вас у всех все хорошо.
Сегодня я собираюсь поделиться некоторой полезной информацией о важной концепции деструктурирования вызовов JavaScript.
Так что же такое деструктурирование???
ОК. Давайте начнем с того, что MDN говорит о деструктурировании.
синтаксис присваивания - это выражение JavaScript, которое позволяет распаковывать значения из массивов или свойства из объектов в отдельные переменные.”деструктурирование“
Итак, проще говоря, деструктурирование - это способ извлечения значений из массива или свойств объектов в различные переменные.
И следующий вопрос, который у нас на уме, заключается в том, каков синтаксис и преимущества деструктурирования? Давайте разберемся в этом на нескольких примерах.
Предположим, у меня есть массив имен учащихся, и требуется извлечь первое и второе имя из массива и сохранить в разных переменных. Итак, давайте посмотрим, как мы можем достичь этого обычным способом (что все разработчики JS когда-то делали).
Здесь мы создали две переменные first и second и назначаем элемент из массива student на основе индекса элемента (0 и 1). В приведенном выше коде нет ничего плохого, и он будет работать так, как ожидалось, но с помощью деструктурирования мы можем добиться того же самого лучшим и чистым способом с меньшими усилиями.
Как?? давайте посмотрим…
И что мы здесь сделали? Мы добились того же с меньшим количеством кода и упрощенным способом, используя деструктурирование. Здесь вместо того, чтобы создавать две переменные и сопоставлять их с отдельным элементом массива на основе индекса элемента, мы создали массив из двух переменных и сопоставили его с массивом students и получили тот же результат. При деструктурировании первая переменная сопоставляется первому элементу массива, а вторая переменная сопоставляется второму элементу массива, и мы закончили!!
Больше нет доступа к элементу с помощью индекса, используйте деструктурирование.
Мы также можем использовать деструктурирование с объектом для доступа к свойствам объекта. Давайте разберемся в этом на примере.
Предположим, у меня есть объект, содержащий сведения об ученике (как указано ниже), и я просто хочу получить доступ к firstname, lastname и email из этого.
Опять же, один из способов достижения этой цели
Хорошо! мы получим результат, как и ожидалось, но все же мы можем оптимизировать этот код и добиться того же с меньшими усилиями, используя деструктурирование. Давайте посмотрим, как это сделать..
Как видно из приведенного выше блока кода, мы достигаем того же результата с меньшими затратами кода, усилий и стандартным способом.Существует больше способов использования деструктурирования, о которых я расскажу в следующей статье. А пока давайте начнем использовать деструктурирование и улучшим ваш код.
Приятного обучения!!Спасибо!