2

我有两个 javaScript 数组

let x = [
    {
        id: 'Abc',
        children: [
            {
                id: 12,
                name: 'john'
            }, {
                id: 13,
                name: 'dow'
            }
        ]
    }, {
        id: 'xyz',
        children: [
            {
                id: 123,
                name: 'jack'
            }, {
                id: 134,
                name: 'abc'
            }
        ]
    }
]
let y = [
    {
        id: 12,
        name: 'mac'
    }, {
        id: 13,
        name: 'dow'
    }, {
        id: 123,
        name: 'Tom'
    }, {
        id: 134,
        name: 'abc'
    }
]

我想x用y这样的更新数组来更新我的

[
    {
        id: 'Abc',
        children: [
            {
                id: 12,
                name: 'mac'
            }, {
                id: 13,
                name: 'dow'
            }
        ]
    }, {
        id: 'xyz',
        children: [
            {
                id: 123,
                name: 'Tom'
            }, {
                id: 134,
                name: 'abc'
            }
        ]
    }
]

我试过这样的解决方案

x.map((a, index)=>{
    a.children.map((b, i)=>{
        // console.log('update')
        y.find(o => o.id === b.id) || b;
    })
})

但我有undefined。我搜索了很多答案，但没有得到任何运气。

4

3 回答 3

0 
x.map((a, index)=>{
    a.children.map((b, i)=>{
        // console.log('update')
        y.find(o => o.id === b.id) || b;
    })
})

首先，您在使用数组函数时犯了一个常见错误{}：括号对于单行指令是可选的，但是您需要指定return关键字。

arr.filter(v => v === 2)相当于arr.filter(v => {return v === 2})。忘记return,filter()并将返回一个空数组。

一站式解决方案：

const res = x.map((a, index) => ({ ...a, children: a.children.map((b, i) => y.find(o => o.id === b.id) || b) }));

代码片段： 

let x = [
    {
        id: 'Abc',
        children: [
            {
                id: 12,
                name: 'john'
            }, {
                id: 13,
                name: 'dow'
            }
        ]
    }, {
        id: 'xyz',
        children: [
            {
                id: 123,
                name: 'jack'
            }, {
                id: 134,
                name: 'abc'
            }
        ]
    }
]
let y = [
    {
        id: 12,
        name: 'mac'
    }, {
        id: 13,
        name: 'dow'
    }, {
        id: 123,
        name: 'Tom'
    }, {
        id: 134,
        name: 'abc'
    }
]

const res = x.map((a, index) => 
  ({ ...a, children: a.children.map((b, i) => y.find(o => o.id === b.id) || b) }));

console.log(res);

于 2021-01-25T10:24:37.917 回答
0

首先，您忘记在回调函数中返回结果。那么你不应该丢失对象的其他键。

const x = [
  {
    id: 'Abc',
    children: [
      {
        id: 12,
        name: 'john'
      }, {
        id: 13,
        name: 'dow'
      }
    ]
  }, {
    id: 'xyz',
    children: [
      {
        id: 123,
        name: 'jack'
      }, {
        id: 134,
        name: 'abc'
      }
    ]
  }
];
const y = [
  {
    id: 12,
    name: 'mac'
  }, {
    id: 13,
    name: 'dow'
  }, {
    id: 123,
    name: 'Tom'
  }, {
    id: 134,
    name: 'abc'
  }
];

const newArr = x.map((a, index) => {
  const children = a.children.map((b, i) => {
    return y.find(o => o.id === b.id) || b;
  })
  return { ...a, children };
})

console.log(newArr);

于 2021-01-25T10:25:04.990 回答
0

首先制作循环对象 for y，然后使用mapfor children forx

let x = [
  {
    id: "Abc",
    children: [
      {
        id: 12,
        name: "john",
      },
      {
        id: 13,
        name: "dow",
      },
    ],
  },
  {
    id: "xyz",
    children: [
      {
        id: 123,
        name: "jack",
      },
      {
        id: 134,
        name: "abc",
      },
    ],
  },
];
let y = [
  {
    id: 12,
    name: "mac",
  },
  {
    id: 13,
    name: "dow",
  },
  {
    id: 123,
    name: "Tom",
  },
  {
    id: 134,
    name: "abc",
  },
];

const lookupY = {};
y.forEach(({ id, name }) => (lookupY[id] = name));

const newX = x.map(({ id, children }) => ({
  id,
  children: children.map((item) => ({ id:item.id, name: lookupY[item.id] })),
}));

console.log(newX)

于 2021-01-25T10:22:00.617 回答