企业🤖AI智能体构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
## 如何安全的修改对象 不知你是否遇到过这类问题:将一个变量(对象)赋值给另一个变量,结果修改这个变量,另外一个也跟着变了,无论修改哪一个,另外一个都会受影响。 先来看这个例子: ```javascript // javascript代码 var s = {"a":1}; var a = s; s; // Object {a: 1} a; // Object {a: 1} s.a = 2; // set s.a = 2; s; // Object {a: 2} a; // Object {a: 2} ``` s是一个对象,变量a是由s赋值的,s对象更改后,a也更改了。 你知道了,对象是引用指针,所以才会这样。再看看数据的情况: ```javascript // javascript代码 var s = [1]; var a = s; a[0]; // 1 s[0]; // 1 s[0] = 2; // set s[0] = 2; a[0]; // 2 a[0]; // 2 ``` 没想到换数据也是这样,其实js中的数组也是对象:`[] <=>new Array();` * * * * * **我们再来用PHP做一个跟这一样的实验:** ```php // 对象实验: class A { public $v = 0; public function set($v) { $this->v = $v; } } $a = new A(); echo '$a = new A();<br />'; $b = $a; echo '$b = $a;<br />'; echo '$a->v: ', $a->v, '<br />'; echo '$b->v: ', $b->v, '<br />'; $b->set(2); echo '$b->set(2);<br />'; echo '$a->v: ', $a->v, '<br />'; echo '$b->v: ', $b->v, '<br />'; // -------- // 输出结果: // $a = new A(); // $b = $a; // $a->v: 0 // $b->v: 0 // $b->set(2); // $a->v: 2 // $b->v: 2 ``` ```php // 变量实验: $a = 1; $b = $a; $a = 2; echo $b; // 1 ``` ```php // 数组实验: $a = [1]; $b = $a; $a[0] = 2; echo $b[0]; // 1 ``` 可以看见,php对象和js对象是一样的,赋值的变量是一个对象应用。知道了这个原因,那么问题就好解决了,用对象克隆。 ```php // 对象实验: class A { public $v = 0; public function set($v) { $this->v = $v; } } $a = new A(); echo '$a = new A();<br />'; $b = clone $a; echo '$b = $a;<br />'; echo '$a->v: ', $a->v, '<br />'; echo '$b->v: ', $b->v, '<br />'; $b->set(2); echo '$b->set(2);<br />'; echo '$a->v: ', $a->v, '<br />'; echo '$b->v: ', $b->v, '<br />'; // -------- // 输出结果: // $a = new A(); // $b = $a; // $a->v: 0 // $b->v: 0 // $b->set(2); // $a->v: 0 // $b->v: 2 ``` 继续回到问题,同样的JS中使用 `clone` 克隆关键字也可以。 但是js没有这个 `clone` 关键字。 但到这里,相信你也已经知道了怎么解决JS中克隆对象的问题。 *提示:自行百度 js对象克隆、js深拷贝/浅拷贝* * * * * * ### 参考: [JS对象深度克隆 - yxz_turing - 博客园](https://www.cnblogs.com/yxz-turing/p/4784861.html) [js如何复制一个对象? - CSDN博客](http://blog.csdn.net/liyujia6636/article/details/52198128) [JavaScript 深拷贝性能分析](http://mp.weixin.qq.com/s/VoiuMnM-VVY6A894UA-K9Q) last update:2018-2-7 18:47:05