昨天用React写小demo,却发现了难以查找的bug,最后发现是自己愚蠢的用了浅拷贝。通常面试也愿意问,索性总结一下吧。
浅拷贝会带来以下问题:
1、原始数据被修改:
因为浅拷贝只拷贝对象的引用,而不是对象本身,如果拷贝对象中的属性为对象类型时,新产生的对象会与原始对象共享同一个引用,当其中一个对象改变时,另一个对象也会受到影响。
2、多层嵌套的对象无法完全拷贝:
由于浅拷贝只拷贝对象的引用,如果对象中的某个属性值为对象类型,那么拷贝后的新对象和原始对象中的该属性引用的是同一个对象,导致无法完全拷贝多层嵌套的对象。
3、对象中存在循环引用时会陷入无限循环,导致浏览器崩溃。
4、多个对象共享同一个引用:
如果在某个对象中新增了一个属性,这个属性会通过引用传递,也会影响到拷贝后生成的对象,导致多个对象共享同一个引用。
React中,一定要避免直接修改state,由于我使用了浅拷贝,修改了原始对象,导致了我意向不到的bug。
推荐使用React官方推荐的,使用lmmer编写简洁的更新逻辑