解构赋值是深拷贝吗？

William_Sang 发布于2019-08-23 17:00 / 733人阅读

摘要：最近在使用想到一个问题，里常用的一种语法是这样的通过解构赋值保留了里未修改的部分，并覆盖修改的部分，那么现在问题来了，这里的新对象通过解构得来的，是否是原来属性的引用赋值呢我们知道，如下情况这里是的一个引用赋值。比如上例中希望可以帮助大家。

最近在使用Redux想到一个问题，Redux里常用的一种语法是这样的：

setSth(state, { payload }) {
    const { newthing} = payload;
    return {
        ...state,
        newthing
    }
}

Redux通过解构赋值...state,保留了state里未修改的部分，并覆盖修改的部分，那么现在问题来了，这里的新对象通过解构得来的...state，是否是原来属性的引用赋值呢？

我们知道，如下情况：

let state = {a: 1, b: 2}
let state2 = state;
state2.a = 5;
// state.a === 5 => true

这里state2是state的一个引用赋值。
那么使用解构赋值生成一个新对象会如何呢？

let state = {a: 1, b: 2}
let state2 = { ...state }
state2.a = 5;
// state.a === 1 => true

通过实验可见，state2属性的修改并没有影响到state，所以这是一份拷贝，那么问题又来了，这个拷贝是只有一层的浅拷贝，还是递归进去的深拷贝呢，我直觉地认为是深拷贝，于是又做了一个实验：

let state = {a: {a1: 1, a2: 2}, b: 2}
let state2 = { ...state }
state2.a.a1 = 5;
// state.a.a1 === 5 => true

事实证明我的直觉错了，解构复制到全新对象里只是浅拷贝，对象里属性的属性还是对原来对象里属性的属性的一个引用,因为解构赋值可以生成一份浅拷贝，其实我们针对已知结构的对象也可以全部使用这个方法实现自己想要的拷贝。比如上例中：

let state = {a: {a1: 1, a2: 2}, b: 2}
let state2 = { ...state, a: { ...state.a } }

希望可以帮助大家。

GPU云服务器云服务器解构赋值 linux 拷贝usb数据吗对象解构解构函数

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/103650.html

es6中容易忽视的细节（二）

摘要：变量的解构赋值结构赋值允许使用默认值内部使用严格相等运算符，判断一个位置是否有值。所以，只有当一个数组成员严格等于，默认值才会生效。这样的层层判断非常麻烦，因此现在有一个提案，引入了传导运算符，简化上面的写法。变量的解构赋值结构赋值允许使用默认值 let [foo = true] = []; foo // true ES6 内部使用严格相等运算符（===），判断一个位置是否...

RayKr 2019-08-21 18:44 评论0 收藏0
ES6学习（二）之解构赋值及其原理

摘要：基本原理解构是提供的语法糖，其实内在是针对可迭代对象的接口，通过遍历器按顺序获取对应的值进行赋值。属性值返回一个对象的无参函数，被返回对象符合迭代器协议。迭代器协议定义了标准的方式来产生一个有限或无限序列值。更多系列文章请看 1、基本语法 1.1、数组 // 基础类型解构 let [a, b, c] = [1, 2, 3] console.log(a, b, c) // 1, 2, ...

chunquedong 2019-08-23 16:19 评论0 收藏0
JS 里的类型

摘要：中是确定的，是的引用后面，变成的引用，但中的是确定的，所以在中又加上了深拷贝方法方法一如果这样写，对象中的简单类型是深拷贝，而复杂类型是简单拷贝方法二循环引用垃圾回收如果一个对象没有被引用，它就是垃圾，将被引用被赋值后，这个函数不是垃圾 JS 里的类型 number类型转 `string`：`toString`、String()全局函数、加上空字符串 `boolean：Boolean(...

calx 2019-08-23 10:41 评论0 收藏0
ES6（中）

摘要：它用来比较两个值是否严格相等，与严格比较运算符的行为基本一致。两个对象的地址不一样与严格比较运算符的不同之处只有两个一是不等于，二是等于自身基本用法方法用于对象的合并，将源对象的所有可枚举属性，赋值到目标对象。这是ES6的入门篇教程的笔记，网址：链接描述，以下内容中粗体+斜体表示大标题，粗体是小标题，还有一些重点；斜体表示对于自身，还需要下功夫学习的内容。这里面有一些自己的见解，所以...

dreamGong 2019-08-26 10:48 评论0 收藏0
深浅拷贝

摘要：好像栗子不是那么好吃，那我们来看看下面的解释吧深浅拷贝深拷贝和浅拷贝只针对像这样的引用类型数据。深拷贝则是开启一个新的栈，两个对象对应两个不同的引用地址，修改一个对象的属性，不会改变另一个对象的属性。拷贝顾名思义就是复制，但是它并不简单哦，拷贝分为深浅拷贝，那么啥是深拷贝啥是浅拷贝呢，让我们来举个栗子，浅拷贝就是当你拷贝别人的U盘里东西时，却没有新建文件存放在自己的电脑里，直接在里面...

yck 2019-08-21 17:42 评论0 收藏0