Question

我试图从每个数组中获取两个属性，然后从中组成一个数组。我还显示了预期的输出。


columns = [
           {Header: ƒ, Cell: ƒ, sortable: false, show: true},
           {Header: ƒ, accessor: "firstName", sortable: false, show: true},
           {Header: ƒ, accessor: "status", sortable: false, show: true},
           {Header: ƒ, accessor: "visits", sortable: false, show: true}
          ]

我希望输出为

[{name: "firstName",show: true},{name: "status",show: true},{name:"visits", show: true}]

我尝试过这种获取一个字段的方法，如何获取两个值，然后形成一个新的对象数组itlef。

 let keys = [...new Set(arr.map(arr => arr.accessor))]; // able to get one property, but need two in form of object

Answer 1

使用简单的Map()：

columns.filter(
  col => !!col.accessor).map(
   column => ({ name: column.accessor, show: column.show })
 )

过滤器删除没有accessor属性的列。

Map()返回格式化的数组。

const columns = [
           {Header:"ƒ", Cell: "ƒ", sortable: false, show: true},
           {Header: "ƒ", accessor: "firstName", sortable: false, show: true},
           {Header: "ƒ", accessor: "status", sortable: false, show: true},
           {Header: "ƒ", accessor: "visits", sortable: false, show: true}
          ]

const newColumns = columns.filter(
      col => !!col.accessor).map(
       column => ({ name: column.accessor, show: column.show })
     );
     
console.log(newColumns);

Answer 2

您可以使用reduce创建单线：

const columns = [{Header:"ƒ", Cell: "ƒ", sortable: false, show: true},{Header: "ƒ", accessor: "firstName", sortable: false, show: true},{Header: "ƒ", accessor: "status", sortable: false, show: true},{Header: "ƒ", accessor: "visits", sortable: false, show: true}]

var filtered = columns.reduce((acc, {accessor:a, show}) => a ? [...acc, {name: a, show}] : acc , [])
console.log(filtered)

a ?将检查accessor是否存在，如果存在则将推送新对象，如果不存在则返回acc累加器。

Answer 3

简单的filter（），用于过滤具有访问器并显示值的适当列，和map（）自定义值。

var ƒ = "dummy"
columns = [
           {Header: ƒ, Cell: ƒ, sortable: false, show: true},
           {Header: ƒ, accessor: "firstName", sortable: false, show: true},
           {Header: ƒ, accessor: "status", sortable: false, show: true},
           {Header: ƒ, accessor: "visits", sortable: false, show: true}
          ]
    
  var finalResult = columns.filter(column => column.accessor && column.show).map(item => {
      return {name: item.accessor,show: item.show}
    })
    
    console.log(finalResult)

Answer 4

col.map(element => {
    return {accessor: element.accessor, show: element.show}
})

修改：与其像其他解决方案那样两次循环，不如遍历它并仅添加所需的元素。

let res = [];
columns.forEach(element => {
    if(!!element.accessor) {
        res.push({accessor: element.accessor, show: element.show})
    }
})

Answer 5

您应该在map函数内部返回对象

columns.map(item => {
   return {name: item.accessor, show: item.show}
});

从对象数组中获取属性

5 个答案: