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

我需要从数组和包含另一个数组的属性创建一个新数组：

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和/或spread数组函数…

是的，如果您是正确的，您可以使用，然后将每个元素及其子元素添加到回调中的累加器中：

const bigArray=[{“bigArrayID”：1，“name”：“Xpto”，“childs”：[{“childID”：1，“name”：“XptoChild1”}，{“childID”：2，“name”：“bigArrayID”：2，“name”：“Foo”，“childs”：[{“childID”：3，“name”：“FooChild1”}，{“childID”：4，“name”：“FooChild2”}，{“bigArrayID”：3，“name”：“Bar”，“childs”：“{“childID”：5，“name”：“BarChild1”；“childID”}，{}]}]
const result=bigArray.reduce(
（result，element）=>result.concat（element，element.children），
[]
)
//stringify只是为了防止副作用
//堆栈代码段控制台行为的定义
console.log（JSON.stringify（result，null，2））

是的，如果您是正确的，您可以使用，然后将每个元素及其子元素添加到回调中的累加器中：

const bigArray=[{“bigArrayID”：1，“name”：“Xpto”，“childs”：[{“childID”：1，“name”：“XptoChild1”}，{“childID”：2，“name”：“bigArrayID”：2，“name”：“Foo”，“childs”：[{“childID”：3，“name”：“FooChild1”}，{“childID”：4，“name”：“FooChild2”}，{“bigArrayID”：3，“name”：“Bar”，“childs”：“{“childID”：5，“name”：“BarChild1”；“childID”}，{}]}]
const result=bigArray.reduce(
（result，element）=>result.concat（element，element.children），
[]
)
//stringify只是为了防止副作用
//堆栈代码段控制台行为的定义
console.log（JSON.stringify（result，null，2））

Original

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 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]);
  }
}

---

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

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

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

---

我们的想法是循环遍历所有父亲，以获取他们所有的孩子并将所有的孩子存储到一个数组中，然后将两个有父亲的孩子合并到一个数组中

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

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

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

我们的想法是循环遍历所有父对象，以获取其所有子对象并将所有子对象存储到一个数组中，然后将具有父对象的两个子对象合并到单个数组中

数组

中减少为

数组#concat

被称为，目前处于第3阶段。这也被称为

#链

你可以这样使用它

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=函数（f）
{返回这个.reduce
（（acc，x）=>
行政协调会（f（x））
, []
)
}
常量大数组=
[{bigArrayID:1
，名称：“Xpto”
，儿童：
[{childID:1，名称：“XptoChild1”}
，{childID:2，名称：“XptoChild2”}
]
}
，{bigArrayID:2
，姓名：“富”
，儿童：
[{childID:3，名称：“FooChild1”}
，{childID:4，名称：“FooChild2”}
]
}
，{bigArrayID:3
，姓名：“酒吧”
，儿童：
[{childID:5，名称：“BarChild1”}
，{childID:6，名称：“BarChild2”}
]
}
]
常数结果=
bigArray.flatMap
（node=>[node，…node.children]）
console.log（结果）
//[{bigArrayID:1，名称：'Xpto'，子项：[……]}
//，{childID:1，名称：'XptoChild1'}
//，{childID:2，名称：'XptoChild2'}
//，{bigArrayID:2，名称：'Foo'，子项：[……]}
//，{childID:3，名称：'FooChild1'}
//，{childID:4，名称：'FooChild2'}
//，{bigArrayID:3，名称：'Bar'，子项：[……]}
//，{childID:5，名称：'BarChild1'}
//，{childID:6，名称：'BarChild2'}
//]

Array#reduce

为

Array#concat

，目前为第3阶段。这也被称为

#链

你可以这样使用它

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=函数（f）
{返回这个.reduce
（（acc，x）=>
行政协调会（f（x））
, []
)
}
常量大数组=
[{bigArrayID:1
，名称：“Xpto”
，儿童：
[{childID:1，名称：“XptoChild1”}
，{childID:2，名称：“XptoChild2”}
]
}
，{bigArrayID:2
，姓名：“富”
，儿童：
[{childID:3，名称：“FooChild1”}
，{childID:4，名称：“FooChild2”}
]
}
，{bigArrayID:3
，姓名：“酒吧”
，儿童：
[{childID:5，名称：“BarChild1”}
，{childID:6，名称：“BarChild2”}
]
}
]
常数结果=
bigArray.flatMap
（node=>[node，…node.children]）
console.log（结果）
//[{bigArrayID:1，名称：'Xpto'，子项：[……]}
//，{childID:1，名称：'XptoChild1'}
//，{childID:2，名称：'XptoChild2'}
//，{bigArrayID:2，名称：'Foo'，子项：[……]}
//，{childID:3，名称：'FooChild1'}
//，{childID:4，名称：'FooChild2'}
//，{bigArrayID:3，名称：'Bar'，子项：[……]}
//，{childID:5，名称：'BarChild1'}
//，{childID:6，名称：'BarChild2'}
//]

这不会产生与问题中给定结果相同的顺序。是的，不会，让我尝试使用一些循环，而不是函数编程。如果我错了，请纠正我，但OP没有要求排序。这不会产生与问题中给定结果相同的顺序。是的，不会，让我尝试使用一些循环