взять значение массива из и массив объекта с деструктуризацией javascript - PullRequest
0 голосов
/ 29 января 2020

У меня есть массив объектов ниже:

const obj = [
 0:{
  "content": {
    "tabs": [
      {
        "name": "Overview",
        "id": 1,      
        "sections":[           
          {"event_description":"Event Description"},
          {"photos":"Photos"},
          {"reference_documents":"Reference Documents"},
          {"discussion":"Discussion"}

        ]
      },{...},{..}
     ]
   }
 },
 1:{}
]

Как я могу взять только массив sections из obj с деструктуризацией? Я пробовал эти вещи:

const [{content={}}] = obj;
const [{content{tabs={}}]=obj;
const [{content{tabs[0]{sections}}}]=obj;

А также sections следует изменить на другое имя переменной.

Ответы [ 5 ]

3 голосов
/ 29 января 2020

в принципе вы действительно близки, здесь у вас есть рабочий пример, а также добавление значений по умолчанию на всякий случай:)

const obj = {
  content: {
    tabs: [{
      name: "Overview",
      id: 1,
      sections: [{
        event_description: "Event Description"
      }, {
        photos: "Photos"
      }, {
        reference_documents: "Reference Documents"
      }, {
        discussion: "Discussion"
      }]
    }]
  }
};

const { content: { tabs: { 0: { sections = [] } = {} } = {} } = {} } = obj;

console.log(sections);
2 голосов
/ 29 января 2020

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

При необходимости добавить некоторые значения по умолчанию.

const
    obj = [{ content: { tabs: [{ name: "Overview", id: 1, sections: [{ event_description: "Event Description" }, { photos: "Photos" }, { reference_documents: "Reference Documents" }, { discussion: "Discussion" }] }] } }],
    key = 'sections',
    { 0: { content: { tabs: { 0: { [key]: value } } } } }= obj;

console.log(value);
0 голосов
/ 29 января 2020

Вы можете сделать это, заходя по одному за раз или используя ключи к Destruture.

const obj ={
  "content": {
    "tabs": [
      {
        "name": "Overview",
        "id": 1,      
        "sections":[           
          {"event_description":"Event Description"},
          {"photos":"Photos"},
          {"reference_documents":"Reference Documents"},
          {"discussion":"Discussion"}

        ]
      },
     ]


  }
}
//do the following
const {content} = obj;
const {tabs} = obj["content"} //or const {tabs} = content

аналогично всем на протяжении.

0 голосов
/ 29 января 2020

Сделай это

const obj ={
  "content": {
    "tabs": [
      {
        "name": "Overview",
        "id": 1,      
        "sections":[           
          {"event_description":"Event Description"},
          {"photos":"Photos"},
          {"reference_documents":"Reference Documents"},
          {"discussion":"Discussion"}

        ]
      }
     ]
   }
};

const { content: { tabs } } = obj;

const sections = tabs.map(tab => tab.sections)

console.log(sections)
0 голосов
/ 29 января 2020

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

const obj = [{ "content": { "tabs": [{ "name": "Overview", "id": 1, "sections": [{ "event_description": "Event Description" }, { "photos": "Photos" }, { "reference_documents": "Reference Documents" }, { "discussion": "Discussion" } ] }] } }];

const [{content: {tabs: [{sections: foo}]}}] = obj;
console.log(foo); // here `foo` refers to sections
.as-console-wrapper { max-height: 100% !important;} /* ignore */

Разрушающий синтаксис имитирует синтаксис литерала объекта, поэтому его легче понять при форматировании. Вот параллельное сравнение синтаксиса деструктуризации и имеющегося у вас массива объектов:

// Desctructuing:       Actual object/array:
const [{                // [{
  content: {            //   "content": {             
    tabs: [{            //     "tabs": [{
      sections: foo     //       "name": "Overview", "id": 1, "sections": {...}
    }]                  //     }, ...]
  }                     //   }
}] = obj;               // }, ...]
...