IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> 关于js里的深拷贝和浅拷贝理解 -> 正文阅读

[JavaScript知识库]关于js里的深拷贝和浅拷贝理解

js里的深拷贝、浅拷贝类型

深拷贝类型:基本数据类型(number ? strting ?undefind ?null ?boolean ?symbol)

浅拷贝类型:引用数据类型(function ?array ?object ?data)

?1.深拷贝

let a = 1;				
let b = a;				
a = 2;				
console.log(b);   //b=1		

?上面的代码在栈和堆内存中发生的变化:基本数据类型会在栈内存中创建a = 1、因为let b = a,所以在栈内存中再创建b = 1,但是这个步骤是b复制了a的值,所以这时让a=2,只改变了a并没有改变b,所以b还是等于1,所以为深拷贝

2.浅拷贝?


let obj1 = {a:1};
let obj2 = obj1;
obj1.a = 2;
console.log(obj2);  	//{a:2}

?引用数据类型会在堆中创建一个{a:1},栈中会创建一个obj1堆中的内存地址,而创建obj2是复制了obj1堆中的内存地址。所以他们是指向了同一个对象,这时obj1.a = 2,堆中的就等于{a:2}? ? ?所以obj2.a也等于2,这是浅拷贝
? ? ? ?

3.总结

浅拷贝只复制栈中某个对象的指针,而不复制对象本身,新旧对象还是共享同一块内存。但深拷贝会另外创造一个一模一样的对象

简单来讲就是,操作原始对象里的属性,拷贝对象的值没有发生改变就是深拷贝,发生了改变就是浅拷贝 ? ? ?? ??? ?浅拷贝是直接复制原始对象的值

4.怎么让引用数据类型成深拷贝的三个方法

1.使用JSON.parse(JSON.stringify()),优点是:二级以下也可以实现深拷贝,缺点是:函数,正则,undefined无法拷贝

2.Object.assign,优点是:函数,正则,undefined可以拷贝,缺点是:第一级对象是深拷贝,二级以及二级一下对象是浅拷贝

3.关于方法里面还有方法就要通过递归复制了:创建一个方法把原始对象和新对象作为形参传进去,然后根据key来for循环原始对象,判断他里面是否还有对象属性,如果没有就根据key来把属性传进去给新对象,如果还有对象属性那就递归把新对象的对应key位置和对应key位置的原始对象在传进这个方法。

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-11-19 17:32:40  更:2021-11-19 17:34:15 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年5日历 -2024/5/20 23:06:04-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码