工作中碰到需要自己匹配数据的需求，后端给我两个对象数组，我需要自己把两个对象数组中相同id属性的数据匹配出来，并且返回对比后的对象然后做一些操作。
呃~~~~~
其实刚开始我是拒绝的，这个难道不是后端查表跟方便一些？，这个操作类似一个数据库的Join啊
不过想想也蛮有意思的。
一开始是需求是匹配两个对象数组的id，然后将后一个的name属性赋给前一个
let data = [
{ id:1, desc:"101", code:"121" },
{ id:2, desc:"202", code:"232" },
{ id:3, desc:"303", code:"343" }
]
let mateData = [
{ id:1, name:'asdas', str:"shhh" },
{ id:2, name:'asdas2', str:"shhh2" },
{ id:3, name:'asdas3', str:"shhh3" }
]
let translate=(
data, // 初始字段 对象数组
mateData // 对比数据 对象数组
)=>data.map(item=>{
let mateRes= mateData.filter(mateItem=>item.id===mateItem.id)[0]
item.name=mateRes.name
return item
})
到这是不是写完啦？ 0.0 是的勉强达到要求，但是为了更好的支持扩展。为了不支持自定义参数对比，以及自定义属性的赋值。我开始改进啦....
因此我加入了两个参数，param-比对的属性，mateParam-匹配后需要的属性
let param='id'
let mateParam='name'
let translate=(
param, //初始字段
mateParam, //匹配字段
data, // 初始字段 对象数组
mateData // 对比数据 对象数组
)=>data.map(item=>{
let mateRes= mateData.filter(mateItem=>item[param]===mateItem[param])[0]
item[mateParam]=mateRes[mateParam]
return item
})
至此这个方法就写完啦？真的么。。。
试着打印一下这个data
有没有发现不同？？
原数据被改了？ what？？
map不是会生成一个新数组的么
思考：map确实是个新数组，原数组的长度并没改变呀，至于这个数组内的对象嘛，这个就涉及到浅拷贝和深拷贝啦
于是我又做了以下改进：
let translate=({
param, //初始字段
mateParam, //匹配字段
data, // 初始字段 对象数组
mateData // 对比数据 对象数组
})=>data.map(item=>{
let mateRes= mateData.filter(mateItem=>item[param]===mateItem[param])[0]
console.log('mateRes',mateRes,item)
let itemObj = {
...item // 解构对象，js中对象是引用类型，直接操作item会改变原数组中的对象
}
itemObj[ mateParam ]=mateRes[mateParam]
return itemObj
})
多加了一个解构操作，将对象深拷贝过来，妈妈再也不用担心会改变原数据啦
深拷贝浅拷贝可以参考这篇：深拷贝与浅拷贝 - 简书
如有错误和改进，请联系我
