JS 对象和数组引用传递的解决方案
比较简单的描述一下这个问题:在 JS 中,对象和数组在传参的时候是引用传递,所以如果你函数中修改了对象或者数组那么将会影响到对象或者数组本身。
然后我们说一下解决方案,这里有两个解决方案:
一、 格式化为 JSON 字符串,然后再解析回对象或者数组
JSON.parse(JSON.stringify(...))
二、使用 Lodash 库
它有一个 _.cloneDeep(value)
函数可以递归的深拷贝原数据,点这里查看文档
var objects = [{ 'a': 1 }, { 'b': 2 }]; var deep = _.cloneDeep(objects); console.log(deep[0] === objects[0]); // => false
最后分享一下我遇到这个问题的场景,在 VUE 中引入子组件传值的时候,定义的 props
可能遇到这种问题,第二个就是在子组件中使用 $emit
函数时会遇到这个问题,点这里查看官方解释