JavaScript 对象赋值和浅拷贝的区别
时间:2022-07-25
本文章向大家介绍JavaScript 对象赋值和浅拷贝的区别,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
赋值和浅拷贝的区别
一直以为对象赋值和对象浅拷贝是一样的,但实际上它们还是有很大差异。
先看赋值,将一个对象赋值给一个新的对象的时候,赋的其实是该对象在栈中的地址,而不是堆中的数据。也就是一个对象的改变就会改变另外一个对象。
再看浅拷贝,浅拷贝会创建一个对象,再去遍历原始对象,如果原对象的属性值是基础类型,那么就拷贝基础类型,如果是引用类型,则拷贝的是指针。
是不是有点蒙蔽?
看一个例子:
var obj1 = {
name: '前端大杂货铺',
content: ['前端', '生活']
}
// 赋值
var obj2 = obj1
obj2.name = 'Gping'
obj2.content[2] = '感悟'
console.log(obj1, obj2)
var obj1 = {
name: '前端大杂货铺',
content: ['前端', '生活']
}
// Object.assign 是浅拷贝
var obj3 = Object.assign({}, obj1)
obj3.name = 'Gping'
obj3.content[2] = '感悟'
console.log(obj1, obj3)
obj1 是源对象,obj2 是赋值得到的,obj3 是浅拷贝得到的,如果我们改变的第一层数据不管是原始类型还是引用类型,那么 obj2 的改变都会导致 obj1 的改变。
obj3 如果第一层数据改变的是原始类型,那么不会影响源数据,改变的是引用类型数据,则会影响 obj1 的改变。
关于赋值,还有一个很基础的点,很惭愧,之前竟然理解错了。上代码
var a = {};
b = a;
b = {}; // 这里 b 已经指向了新的地址,和 a 已经没有任何关系了。跟new Object()应该是一样的
a.name = 'Gping';
console.log(b); // {}
个人理解,通过对象表达式的方式创建一个对象,就已经指向新的地址的,也就是跟之前指向的地址已经没有关系了
总结
赋值和浅拷贝的区别在于对象第一层数据对原对象的影响,如果是赋值,改变会直接影响原对象。如果是浅拷贝,而且属性值是基础类型的话,就不会影响原对象。属性值为引用类型,就会影响原对象
- 用Layer.search快速查询图元
- Ado.Net连接池的速度测试
- Excel小账本使用说明
- Enterprise Library 4.1学习笔记8----缓存应用程序块之FileDependency
- CSS实现按钮的两张图片的同步出现
- 完整部署CentOS7.2+OpenStack+kvm 云平台环境(6)--在线调整虚拟机的大小
- 关于vb中的容器
- 关于vb中的容器
- Mysql数据库之Binlog日志使用总结
- 揭秘新人机大战柯洁对手天壤 AI排名已力压Deepzen
- 一路走到java工程师,java都快出java9了,到底该如何学java?
- 网站发布合并bll问题的解决
- 痛并快乐着:浅谈大数据时代的分布式存储架构
- linux运维中的命令梳理(四)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- Oracle基本参数(CONTROL_FILES)
- Oracle基本参数(DB_BLOCK_SIZE)
- Oracle基本参数(DB_CREATE_FILE_DEST,DB_CREATE_ONLINE_LOG_DEST_n)
- React16的memo函数有啥用
- 要点2:循环、条件控制
- VSCode代码格式化设置
- MapReduce之MapJoin案例
- MapReduce之多个Job串联的案例
- Java Class文件常量池
- Kubernetes 学习笔记——使用 Heml 安装和使用 OpenFaaS
- 奈学:reaseShared共享式释放锁
- 奈学:reaseShared共享式释放锁
- 【DB宝18】在Docker中安装使用MySQL高可用之MGR
- MapStruct
- 聊聊claudb的exportRDB