推送对象多维数组对象javascript

时间:2020-08-20 04:06:10

标签: javascript

请帮助我。 当我想将对象推入现有数组对象时遇到问题。请告诉我是否有类似的问题。

这是我的代码:

var menu = [{
  "id": 1,
  "text": "menu 1",
  "parent": "-",
  "child": {}
},
{
  "id": 3,
  "text": "menu 3",
  "parent": "-",
  "child": {}
}];

var menuchild = [{
  "id": 2,
  "parent": 1,
  "text": "menu 2"
},
{
  "id": 5,
  "parent": 3,
  "text": "menu 5"
},
{
  "id": 6,
  "parent": 1,
  "text": "menu 6"
}];

$.each(menuchild, function(key, value) {

  let item = {
    'id': value.id,
    'text': value.text,
    'parent': value.parent
  }

let parentindex = menu.findIndex(el => el.id === value.parent);

// if i use this return error push is not a function
menu[parentindex]['child'].push(item) 

// if i use this the data wil be replace if there is 2 object with same parent
menu[parentindex]['child'] = item

})

请告诉我什么是最好的数据推送方法?

1 个答案:

答案 0 :(得分:0)

如果您希望child中的menu成为object,那么下面就是这种方法。

var menu = [
  {
    id: 1,
    text: 'menu 1',
    parent: '-',
    child: {},
  },
  {
    id: 3,
    text: 'menu 3',
    parent: '-',
    child: {},
  },
];

var menuchild = [
  {
    id: 2,
    parent: 1,
    text: 'menu 2',
  },
  {
    id: 5,
    parent: 3,
    text: 'menu 5',
  },
  {
    id: 6,
    parent: 1,
    text: 'menu 6',
  },
];

let updatedParents = menuchild.map(ch => {
  childParent = menu.find(m => m.id === ch.parent)
  return {
    ...childParent,
    child: {...ch}
  }
});

console.log(updatedParents)
.as-console-wrapper{
  max-height: 100% !important;
}

但是,如果要将child数组中的menu设为array,则下面是实现所需输出的方法。

var menu = [{
    id: 1,
    text: 'menu 1',
    parent: '-',
    child: [],
  },
  {
    id: 3,
    text: 'menu 3',
    parent: '-',
    child: [],
  },
];

var menuchild = [{
    id: 2,
    parent: 1,
    text: 'menu 2',
  },
  {
    id: 5,
    parent: 3,
    text: 'menu 5',
  },
  {
    id: 6,
    parent: 1,
    text: 'menu 6',
  },
];


const finalResult = menuchild.reduce((result, ch) => {
  let index = result.findIndex(r => r.id === ch.parent);
  result[index].child.push(ch);
  return result;
}, [...menu])

console.log(finalResult)
.as-console-wrapper{
  max-height: 100% !important;
}