Разрушение ES6 для получения n-го элемента из внутреннего массива

Question

У меня есть массив в моем состоянии в моем проекте React.что-то вроде:

state = {
   cats : [
      {cid : 1 , value : 1}
      {cid : 2 , value : 3}
      {cid : 3 , value : 4}
   ],
   curpage : 3
}

Теперь все, что я хочу, это получить nth item массива cats с деструктурой.Я пытался

const { cat : {cats[id]} } = this.state;

или

 const { cats[id] } = this.state;

Answer 1

Вы можете использовать свойство вычисляемого объекта с деструктуризацией , чтобы получить n элемент массива и присвоить его переменной:

const state = {
   cats : [
      {cid : 1 , value : 1},
      {cid : 2 , value : 3},
      {cid : 3 , value : 4}
   ],
   curpage : 3
}

const n = 2;

const { cats: { [n]: nthCat} } = state;

console.log(nthCat)

Или, если n мало и вы знаете это заранее, вы можете игнорировать значения , которые вам не нужны:

const state = {
   cats : [
      {cid : 1 , value : 1},
      {cid : 2 , value : 3},
      {cid : 3 , value : 4}
   ],
   curpage : 3
}

const { cats: [,,thirdCat] } = state;

console.log(thirdCat)

Answer 2

let nthID = 1;let {cats} = state;let nthChild = cats [nthID];

Answer 3

Вы можете выполнить деструктуризацию до индекса и принять переименованное значение.

var state = { cats: [{ cid: 1, value: 1 }, { cid: 2, value: 3 }, { cid: 3, value: 4 }], curpage: 3 },
    index = 2,
    { cats: { [index]: item } } = state;

console.log(item);