如何安全的修改对象
最后更新于：2022-04-02 04:30:15
## 如何安全的修改对象
不知你是否遇到过这类问题：将一个变量（对象）赋值给另一个变量，结果修改这个变量，另外一个也跟着变了，无论修改哪一个，另外一个都会受影响。
先来看这个例子：
```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();
'; $b = $a; echo '$b = $a;
'; echo '$a->v: ', $a->v, '
'; echo '$b->v: ', $b->v, '
'; $b->set(2); echo '$b->set(2);
'; echo '$a->v: ', $a->v, '
'; echo '$b->v: ', $b->v, '
'; // -------- // 输出结果： // $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();
'; $b = clone $a; echo '$b = $a;
'; echo '$a->v: ', $a->v, '
'; echo '$b->v: ', $b->v, '
'; $b->set(2); echo '$b->set(2);
'; echo '$a->v: ', $a->v, '
'; echo '$b->v: ', $b->v, '
'; // -------- // 输出结果： // $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
';
'; $b = $a; echo '$b = $a;
'; echo '$a->v: ', $a->v, '
'; echo '$b->v: ', $b->v, '
'; $b->set(2); echo '$b->set(2);
'; echo '$a->v: ', $a->v, '
'; echo '$b->v: ', $b->v, '
'; // -------- // 输出结果： // $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();
'; $b = clone $a; echo '$b = $a;
'; echo '$a->v: ', $a->v, '
'; echo '$b->v: ', $b->v, '
'; $b->set(2); echo '$b->set(2);
'; echo '$a->v: ', $a->v, '
'; echo '$b->v: ', $b->v, '
'; // -------- // 输出结果： // $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