Деструктуризация объектов и массивов в JavaScript

Если вы новичок в javascript, вы можете подумать, что нет необходимости деструктурировать объекты или массивы, но деструктуризация имеет большое значение в javascript из-за его способности извлекать элементы из массива или объектов, а также может помочь вам переименовать этот объект а также дать этому элементу значение по умолчанию на тот случай, если существование элементов ложно.
Деструктуризация объектов в javascript:
Если мы хотим получить элемент из объекта, мы обычно просто ссылаемся на объект, а затем указываем на нужный нам элемент из этого объекта следующим образом. пример 1:

  const  objectExample1 = {
firstItmOne = elementOne,
firstItmTwo = elementTwo,
firstItmThree = elementThree
}
console.log(`this is the first element ${objectExample1.firstItmOne}, the second ${objectExample1.firstItmTwo}, and the third ${objectExample2.firstItmThree}

При деструктурировании объекта в javascript нам нужно учитывать положение объекта, если объект находится внутри другого объекта, нам также необходимо учитывать имена элементов, которые мы хотим деструктурировать из объекта, и мы деструктурируем элемент объекта следующим образом.
пример 2:

const objectExample2 = {
secondItmOne = secondElementOne,
secondItmTwo = secondElementTwo,
secondItmThree = secondElementThree
const {secondItmOne, secondItmTwo, secondItmThree} = objectExample2
console.log(`this is the first element ${secondItmOne}, the second ${secondItmTwo}, and the third ${secondItmThree}).

Вы также можете переименовать элементы объекта по своему усмотрению при деструктурировании.
пример 2.1:

const {secondItmOne: itemOne, second ItmTwo: itemTwo, thirdItmThree} = objectExample2
console.log(`this is the first element ${itemOne}, the second ${ItemTwo}, and the third ${secondItmThree}) .

В примере 2.1 выше я переименовал первый и второй элемент объекта, а третий оставил прежним. мы также можем установить значение по умолчанию, если существование элементов ложно, и мы делаем это следующим образом.
пример 2..2:

const {secondItmOne: itemOne="noFirstItem", second ItmTwo: itemTwo, thirdItmThree="noThirdItem"}) = objectExample2
console.log(`this is the first element ${itemOne}, the second ${ItemTwo}, and the third ${secondItmThree}) .

Например, 2.2 выше, если бы первый и третий элементы объекта не существовали, то в консоль было бы записано значение по умолчанию, так что деструктуризация работает в объекте именно так.
Деструктуризация массивов в javascript:
Если мы хотим получить элемент из массива, мы обычно просто ссылаемся на массив, а затем указываем индекс элемента, который нам нужен из этого массива, следующим образом. пример 3:

const  ArrayExample3 = [thirdElementOne,thirdelementTwo,thirdelementThree]
console.log(`this is the first element ${arrayExample3[0]}, the second ${arrayExample3[1]}, and the third ${arrayExample3[2]})

При деструктуризации массива в javascript нам нужно учитывать положение элементов, нам также необходимо учитывать индекс элемента, который мы хотим деструктурировать из массива, если элемент идет первым вторым или третьим, и мы деструктурируем элемент массива следующим образом.
пример 4:

const arrayExample4 =[arrayElementOne,arrayElementTwo,arrayElementThree ]
const {firstArray,secondArray , thirdArray} = arrayExample4
console.log(`this is the first element ${firstArray}, the second ${secondArray}, and the third ${thirdArray}).

мы также можем установить значение по умолчанию, если существование элементов ложно, и мы делаем это следующим образом.
пример 4.1:

const {firstArray = 'noFirstItem', secondArray, thirdArray = 'noThirdItem'}) = arrayExample4
console.log(`this is the first element ${firstArray}, the second ${secondArray}, and the third ${thirdArray}) .

В приведенном выше примере 4.1, если бы первый и третий элементы массива не существовали, то значение по умолчанию было бы записано в консоль, поэтому деструктурирование работает именно так в массиве.

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *