前端数据深拷贝与浅拷贝问题
前端数据交互赋值的时候很容易遇到深拷贝浅拷贝的问题,就会导致数据的耦合,今天来用一组代码来讲解一下
<script> var json = { a: 123, b: "456" }; console.log(json) var json2 = json json2.a=222 console.log(json2) </script>打印出来的结果应该如下:
虽然表面看我们的数据没有任何变化,但是当我们打开数据的时候就会发现如下结果:
我们json中的数据被影响了,
解决方案如下:
<script> var json = { a: 123, b: "456" }; console.log(json) var json2 = JSON.parse(JSON.stringify(json)); json2.a=222 console.log(json2) </script>我们将数组中的值先JSON.stringify()转义一下,之后使用JSON.parse赋值给json2,我们可以理解为一个新的数组,在json2中的值进行修改就不会影响到原json中的值,这样就解决了深拷贝的问题
JQ中也提供了一个深拷贝方法,代码如下:
<script> var json = { a: 123, b: "456" }; console.log(json) var json2 = $.extend(true, {}, json); json2.a=222 console.log(json2) </script>
声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。