在 es6 中解构对象数组

Question

在 es6 中，如何使用解构简化以下几行？

const array0 = someArray[0].data;
const array1 = someArray[1].data;
const array2 = someArray[2].data;

Answer 1

使用解构是否实际上是一种简化是有争议的，但这是可以做到的：

const [
  { data: array0 },
  { data: array1 },
  { data: array2 }
] = someArray

实例：

const someArray = [
  { data: 1 },
  { data: 2 },
  { data: 3 }
];

const [
  { data: array0 },
  { data: array1 },
  { data: array2 }
] = someArray

console.log(array0, array1, array2);

发生的事情是，您首先从

someArray

中提取每个对象，然后通过提取

data

属性并重命名它来解构每个对象：

// these 2 destructuring steps
const [ obj1, obj2, obj3 ] = someArray // step 1
const { data: array0 } = obj1 // step 2
const { data: array1 } = obj2 // step 2
const { data: array2 } = obj3 // step 2

// written together give
const [
  { data: array0 },
  { data: array1 },
  { data: array2 }
] = someArray

也许将解构与映射结合起来以获得（可能）更具可读性的代码：

const [array0, array1, array2] = someArray.map(item => item.data)

实例：

const someArray = [
  { data: 1 },
  { data: 2 },
  { data: 3 }
];

const [array0, array1, array2] = someArray.map(item => item.data)

console.log(array0, array1, array2);

Answer 2

我相信你真正想要的是

const array = someArray.map(x => x.data)

如果你真的想要三个变量（提示：你不应该），你可以将

map

ping与解构结合起来：

const [array0, array1, array2] = someArray.map(x => x.data)

Answer 3

如果您想使用这个纯 JS，请按照以下代码片段进行操作。它会对你有帮助。

let myArray = [
    {
        "_id": "1",
        "subdata": [
            {
                "subid": "11",
                "name": "A"
            },
            {
                "subid": "12",
                "name": "B"
            }
        ]
    },
    {
        "_id": "2",
        "subdata": [
            {
                "subid": "12",
                "name": "B"
            },
            {
                "subid": "33",
                "name": "E"
            }
        ]
    }
]


const array = myArray.map(x => x.subdata).flat(1)

const isExist = (key,value, a) => {
  return a.find(item => item[key] == value)
}

let a = array.reduce((acc, curr) => {
  if(!isExist('subid', curr.subid, acc)) {
    acc.push(curr)
  }
  return acc
}, [])

console.log(a)

Answer 4

const myInfo = someArray.map((item) => {
const {itemval1, itemval2} = item;
return(
   //return data how you want it eg:
   <p>{itemval1}</p>
   <p>{itemval2}</p>)
})

这就是我的反应方式，如果我错了请纠正我，我对这个世界还是新手

Answer 5

@Daniel，我想您正在寻找解构对象数组中的嵌套对象。关注 @nem035 能够使用他的模式提取嵌套对象的属性。

发生的情况是，您首先从地址数组中提取每个对象，然后通过提取其属性并重命名每个对象（包括嵌套对象）来解构每个对象：

addresses = [
  {
    locality:"Sarjapura, Bangalore",
    coordinates:{latitude:"12.901160", longitude:"77.711680"}
  },
  {
    locality:"Vadakara, Kozhikode",
    coordinates:{latitude:"11.588980", longitude:"75.596450"}
  }
]
    
const [
  {locality:loc1, coordinates:{latitude:lat1, longitude:ltd1}}, 
  {locality:loc2, coordinates:{latitude:lat2, longitude:ltd2}}
] = addresses

console.log(`Latitude of Vadakara :: ${lat2}`)