从数组和包含另一个数组的属性创建一个新数组

时间:2018-05-21 14:57:44

标签: javascript arrays object functional-programming concat

我需要从数组创建一个新数组,并且你的属性包含另一个数组:

bigArray = [
    {
     bigArrayID : 1,
     name: 'Xpto',
     children: [
         {childID:1,Name:'XptoChild1'},
         {childID:2,Name:'XptoChild2'},
     ]
    },
    {
     bigArrayID : 2,
     name: 'Foo',
     children: [
         {childID:3,Name:'FooChild1'},
         {childID:4,Name:'FooChild2'},
     ]
    },
    {
     bigArrayID : 3,
     name: 'Bar',
     children: [
         {childID:5,Name:'BarChild1'},
         {childID:6,Name:'BarChild2'},
     ]
    }
]

将bigArray转为:

result = [
            {
             bigArrayID : 1,
             name: 'Xpto',
             children: [
                 {childID:1,Name:'XptoChild1'},
                 {childID:2,Name:'XptoChild2'},
             ]
            },
            {childID:1,Name:'XptoChild1'},
            {childID:2,Name:'XptoChild2'},
            {
             bigArrayID : 2,
             name: 'Foo',
             children: [
                 {childID:3,Name:'FooChild1'},
                 {childID:4,Name:'FooChild2'},
             ]
            },
            {childID:3,Name:'FooChild1'},
            {childID:4,Name:'FooChild2'},
            {
             bigArrayID : 3,
             name: 'Bar',
             children: [
                 {childID:5,Name:'BarChild1'},
                 {childID:6,Name:'BarChild2'},
             ]
            },
            {childID:5,Name:'BarChild1'},
            {childID:6,Name:'BarChild2'}
        ]

每个孩子必须是新阵列中的元素。

我需要一个以父亲和所有孩子为对象的新数组。

我需要把孩子变成你父亲的兄弟姐妹。

我想我需要使用concat和/或扩展数组函数......

4 个答案:

答案 0 :(得分:2)

是的,你是对的,你可以在回调中使用Array#reduce()然后Array#concat()每个元素及其子元素到累加器:

Person

答案 1 :(得分:0)

原始

var resultArray = bigArray.concat(bigArray.map(function(item) {
  return item.children;
})

订购

var result = [];
for(var i = 0; i < bigArray.length; i++) {
  result.push(bigArray[i]);
  for( var y = 0; y < bigArray[i].children.length; y++) {
    result.push(bigArray[i].children[y]);
  }
}

使用函数式编程和命令

var result = [];
bigArray.forEach(function(item) {
  result.push(item);
  item.forEach(result.push);
})

答案 2 :(得分:0)

不确定我是否正确理解了您的问题,但在我看来,您想要平整层次结构?如果排序不是很重要,那么下面的解决方案可能会有所帮助

let childArray = [];
bigArray.forEach(x=> {
  childArray = [...childArray, x.children]
});

let answer = [...childArray,...bigArray];

这个想法是通过所有父亲循环,以便抓住他们所有的孩子并将所有孩子存储到一个数组中,然后将父亲的子项合并为单个数组

答案 3 :(得分:0)

Array#reduceArray#concat被称为Array#flatMap,目前是第3阶段。根据{{​​3}},这也称为#chain

您可以像这样使用

const result =
  bigArray .flatMap
    (node => [ node, ...node.children ])

console.log (result)
// [ { bigArrayID: 1, name: 'Xpto', children: [ ... ] }
// , { childID: 1, name: 'XptoChild1' }
// , { childID: 2, name: 'XptoChild2' }
// , { bigArrayID: 2, name: 'Foo', children: [ ... ] }
// , { childID: 3, name: 'FooChild1' }
// , { childID: 4, name: 'FooChild2' }
// , { bigArrayID: 3, name: 'Bar', children: [ ... ] }
// , { childID: 5, name: 'BarChild1' }
// , { childID: 6, name: 'BarChild2' }
// ]

如果您的环境中没有它,您可以轻松地将其填充

Array.prototype.flatMap = function (f)
  { return this.reduce
      ( (acc, x) =>
          acc .concat (f (x))
      , []
      )
  }

在您的浏览器中运行该程序的完整演示

Array.prototype.flatMap = function (f)
  { return this.reduce
      ( (acc, x) =>
          acc .concat (f (x))
      , []
      )
  }

const bigArray =
  [ { bigArrayID: 1
    , name: "Xpto"
    , children:
        [ { childID: 1, name: "XptoChild1" }
        , { childID: 2, name: "XptoChild2" }
        ]
    }
  , { bigArrayID: 2
    , name: "Foo"
    , children:
        [ { childID: 3, name: "FooChild1" }
        , { childID: 4, name: "FooChild2" }
        ]
    }
  , { bigArrayID: 3
    , name: "Bar"
    , children:
      [ { childID: 5, name: "BarChild1" }
      , { childID: 6, name: "BarChild2" }
      ]
    }
  ]

const result =
  bigArray .flatMap
    (node => [ node, ...node.children ])

console.log (result)
// [ { bigArrayID: 1, name: 'Xpto', children: [ ... ] }
// , { childID: 1, name: 'XptoChild1' }
// , { childID: 2, name: 'XptoChild2' }
// , { bigArrayID: 2, name: 'Foo', children: [ ... ] }
// , { childID: 3, name: 'FooChild1' }
// , { childID: 4, name: 'FooChild2' }
// , { bigArrayID: 3, name: 'Bar', children: [ ... ] }
// , { childID: 5, name: 'BarChild1' }
// , { childID: 6, name: 'BarChild2' }
// ]

如果您希望提供Array#mapArray#reduce以及Array#filter之类的索引和上下文切换,您也可以添加

Array.prototype.flatMap = function (f, context)
  { return this.reduce
      ( (acc, x, i) =>
          acc .concat (f .call (context, x, i, this))
      , []
      )
  }