如何数组映射而不是嵌套 for 循环

Question

对于我的场景，我需要将元素推送到包含对象的地址数组。 我正在使用 vue.js。

我目前的工作职能是：

propagateCustomerInfo(selectedOption, id){

        // Propagate addresses
        this.addresses = selectedOption.addresses

        // Propagate contact's addresses
        for (var i = selectedOption.contacts.length - 1; i >= 0; i--) {
            for (var j = selectedOption.contacts[i].addresses.length - 1; j >= 0; j--) {
                let address = selectedOption.contacts[i].addresses[j]
                address.contact = selectedOption.contacts[i]
                this.addresses.push(address)
            }
        }
    },

selectedOption对象具有以下结构：

{
   addresses: [
      {
         id: 0,
         street: 'My street'
      },
      {...}
   ],
   contacts: [
      {
         id: 0,
         name: 'Lorem Ipsum',
         addresses: [
            {
               id: 0,
               street: 'My street'
            },
            {...}
         ],
      }
   ]
}

除了将每个联系人的地址对象推送到this.addresses数组之外，我还需要将联系人附加到地址本身以进行多选渲染。 这就是为什么我在做address.contact = selectedOption.contacts[i]

我几乎可以肯定，这可以通过一些映射/减少组合以最漂亮的方式完成，但我不知道如何去做。

任何帮助将不胜感激。 谢谢！

Answer 1

如果要将联系人变量中的所有地址组合到地址变量：

    this.contacts.map(contact => this.addresses.push(...contact.addresses))

编辑。
注入contact.id和contact.name：

this.contacts.map(contact => {
  let temp = []
    contact.addresses.map(address => {
    temp.push({
      name: contact.name,
      id: contact.id,
      ...address
    })
  })
  this.addresses.push(...temp)
})