深拷贝和浅拷贝JavaScript
2022/1/3 20:16:08
本文主要是介绍深拷贝和浅拷贝JavaScript,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
深拷贝和浅拷贝
假设B复制了A,当修改A时,看B是否会发生变化。如果B变化了,那么就是浅拷贝;如果B没有变化,则是深拷贝。
js数据类型
JavaScript的数据类型分为两种:原始类型(即基本数据类型)和对象类型(即引用数据类型);
- js常用的基本数据类型包括undefined、null、number、boolean、string;
- js的引用数据类型也就是对象类型Object,比如:Object、array、function、data等;
基本数据类型
基本数据类型是按值访问的,存放在栈中。就是说我们可以操作保存在变量中的实际的值;基本数据类型的值是不可变的,任何方法都无法改变一个基本数据类型的值,所以基本数据类型不存在深浅拷贝。
栈内存(stack):会自动分配的内存空间,它由系统自动释放。
引用数据类型
引用数据类型也叫对象数据类型,包括function,object,array,date等可以可以使用new创建的数据,又叫对象类型,它在栈内存中仅仅存储了一个引用,而真正的数据存储在堆内存中。
堆内存(heap):动态分配的内存及大小,不一定会自动释放。
特点:
- 引用类型的值可以改变,可以添加属性和方法。
- 引用数据类型的赋值是对象引用,引用类型的比较是引用的比较
- 引用类型是同时保存在栈区中和堆区中的,引用类型的存储需要在内存的栈区和堆区中共同完成,栈区保存变量标识符和指向堆内存的地址。
实现浅拷贝
function clone(obj) { var cloneObj = {}; for(var key of Object.keys(obj)) { cloneObj[key] = obj[key]; } return cloneObj; }
实现原理:创建一个拷贝的方法 clone(),通过遍历传入对象的键名及键值,然后赋值给一个空对象,这样就完成了对原对象的浅拷贝。浅拷贝只复制了原对象中最外层的属性,也就是拷贝了其基本类型的数据,而对于引用类型数据而言,它仅复制了其引用,指向的地址还是原对象的地址。
实现深拷贝
注:通过对浅拷贝的认识,如果我们要实现对更深层级的数据不仅是单纯的引用,则需要对原对象内所有的属性值进行遍历递归,这就是我们的深拷贝了。
一层对象
直接遍历
function copy (obj) { let newObj = {}; for (let item in obj ){ newObj[item] = obj } return newObj; }
Object.assgin
var obj = { name: '彭湖湾', job: '学生' } var copyObj = Object.assign({}, obj);
Object.assign:用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target),并返回合并后的target。
ES6扩展运算符
var obj = { name: '王嘉尔 ', job: '歌手' } var copyObj = { ...obj }
扩展运算符(…)用于取出参数对象的所有可遍历属性,拷贝到当前对象之中。
多层对象
递归实现
function copy(obj){ let newobj = null; //声明一个变量用来储存拷贝之后的内容 //判断数据类型是否是复杂类型,如果是则调用自己,再次循环,如果不是,直接赋值即可, //由于null不可以循环但类型又是object,所以这个需要对null进行判断 if(typeof(obj) == 'object' && obj !== null){ //声明一个变量用以储存拷贝出来的值,根据参数的具体数据类型声明不同的类型来储存 newobj = obj instanceof Array? [] : {}; //循环obj 中的每一项,如果里面还有复杂数据类型,则直接利用递归再次调用copy函数 for(var i in obj){ newobj[i] = copy(obj[i]) } }else{ newobj = obj } return newobj; //函数必须有返回值,否则结构为undefined }
内置对象JSON
function JSONClone(obj) { return JSON.parse(JSON.stringify(obj)) }
- parse用于从一个字符串中解析出json对象。(字符串单引号写在{}外,每个属性名都必须用双引号,否则会抛出异常)
- stringify()用于从一个对象解析出字符串。
注意:只有可以转成JSON格式的对象才可以这样用,像function没办法转成JSON。
这篇关于深拷贝和浅拷贝JavaScript的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-24Java中定时任务实现方式及源码剖析
- 2024-11-24Java中定时任务实现方式及源码剖析
- 2024-11-24鸿蒙原生开发手记:03-元服务开发全流程(开发元服务,只需要看这一篇文章)
- 2024-11-24细说敏捷:敏捷四会之每日站会
- 2024-11-23Springboot应用的多环境打包入门
- 2024-11-23Springboot应用的生产发布入门教程
- 2024-11-23Python编程入门指南
- 2024-11-23Java创业入门:从零开始的编程之旅
- 2024-11-23Java创业入门:新手必读的Java编程与创业指南
- 2024-11-23Java对接阿里云智能语音服务入门详解