Уничтожение вложенных объектов

Question

Я пытаюсь поиграть в ES6 и пытаюсь преобразовать функцию ES5 в ES6.

ES5:

const ResponseData = {
    items: [{name: 'Matt'}]
}

function getName(ResponseData) {
    let itemDetails = ResponseData && ResponseData.items && ResponseData.items[0];
    return itemDetails.name;
}

Однако я не уверенкак получить доступ к элементам [0] в ES6 при деструктуризации.

Вот моя попытка:

function getItemES6(ResponseData) {
 const { items : item = []   } = ResponseData;
 return item;
}

Это в значительной степени дает мне массив элементов, как мне получить элементы [0] и проверить.name используя ES6?

Немного путают с деструктуризацией.Может кто-то просветить?

Answer 1

Вы деструктурируете объекты следующим образом:

const { key: yourVar = 'defaultVal' } = obj

Массивы похожи, но вместо ссылки на ключи вы ссылаетесь на сами элементы: const [ firstElem, secondElem ] = arr

const obj = {
  a: 1,
  b: {
    b1: 'a'
  }
};

const objWithArr = {
  a: 1,
  b: [{
    key: 5,
  }, {
    key: 6
  }]
}

const {
  b: {
    b1: b1Val = 'default',
  } = {},
} = obj;

const {
  b: [{
      key: firstKey,
    } = {},
    {
      key: secondKey,
    } = {}
  ] = [],
} = objWithArr;

console.log(b1Val);
console.log(firstKey);
console.log(secondKey);

Answer 2

Вы можете деструктурировать вложенные объекты и массивы, добавить добавить пустой объект / массив по умолчанию, чтобы получить undefined, если значение не существует:

const ResponseData = { items: [{name: 'Matt'}] };

const getItemES6 = ({ items: [{ name } = {}] = [] }) => name;

console.log(getItemES6(ResponseData));