说起深浅拷贝,我觉得需要理清楚 值类型 和 引用类型,本文主要和大家分享js实现深浅拷贝方法,希望能帮助到大家。

值类型

所谓 值类型 就是 undefined,null,number, string ,boolean 等五种基本数据类型, 应该还有一个Symbol类型。

值类型的数据存储在栈内存中

在 值类型 中修改值相当于重新在栈内存中开辟了一个新的存储空间,类似于:

用代码来解释就是:var num1 = 5var num2 = num1

值类型的值不可改变javascript中的原始值(undefined、null、布尔值、数字和字符串)与对象(包括数组和函数)有着根本区别。原始值是不可更改的:任何方法都无法更改(或“突变”)一个原始值。对数字和布尔值来说显然如此 —— 改变数字的值本身就说不通,而对字符串来说就不那么明显了,因为字符串看起来像由字符组成的数组,我们期望可以通过指定索引来假改字符串中的字符。实际上,javascript 是禁止这样做的。字符串中所有的方法看上去返回了一个修改后的字符串,实际上返回的是一个新的字符串值。var str = 'abc'str[0] = 'd'console.log(str) // 'abc'

值类型的比较是对值的比较

值类型的比较是值的比较,只要它们的值相等就认为他们是相等的var a = 1;var b = 1;console.log(a === b);//true

引用类型

引用类型的数据存放在堆内存中

引用类型的值存放在堆内存中,变量保存的是一个存放在栈内存,指向堆内存的指针。var person1 = {name:'jozo'};var person2 = {name:'xiaom'};var person3 = {name:'xiaoq'};

引用类型的值可以改变

引用类型是可以直接改变其值的var a = [1,2,3];

a[1] = 5;

console.log(a[1]); // 5

引用类型的比较是引用的比较

所以每次我们对 js 中的引用类型进行操作的时候,都是操作其对象的引用(保存在栈内存中的指针),所以比较两个引用类型,是看其的引用是否指向同一个对象。var a = [1,2,3];var b = [1,2,3];console.log(a === b); // falsevar a = [1, 2, 3]var b = aconsole.log(a === b) // true

传值与传址

了解了基本数据类型与引用类型的区别之后,我们就应该能明白传值与传址的区别了。

在我们进行赋值操作的时候,基本数据类型的赋值(=)是在内存中新开辟一段栈内存,然后再把再将值赋值到新的栈中var a = 10;var b = a;

a ++ ;

console.log(a); // 11console.log(b); // 10

所以说,基本类型的赋值的两个变量是两个独立相互不影响的变量。

但是引用类型的赋值是传址。只是改变指针的指向,例如,也就是说引用类型的赋值是对象保存在栈中的地址的赋值,这样的话两个变量就指向同一个对象,因此两者之间操作互相有影响。var a = {}; // a保存了一个空对象的实例var b = a; // a和b都指向了这个空对象a.name = 'jozo';

console.log(a.name); // 'jozo'console.log(b.name); // 'jozo'b.age = 22;

console.log(b.age);// 22console.log(a.age);// 22console.log(a == b);// true

浅拷贝

实现:function shallowCopy (src) {

let new = {} for (let i in src) { if (src.hasOwnProperty(i)) { new[i] = src[i]

}

} return new}

深拷贝

一种骚操作是利用JSON.parse 和 JSON.stringifyvar a = {

name: 'SpawN',

age: 28}var b = JSON.parse(JSON.stringify(a))

b.name = 'Johnny.R'console.log(a.name) // 'SpawN'

另外一种是科班操作,也就是常规操作,就是利用递归,来遍历目标对象下的所有属性function deepCopy(obj) {

if (typeof obj !== 'object') return

// 初始化

var newObj = obj instanceof Array ? [] : {} for (let k in obj) { if (obj.hasOweProperty(k)) {

newObj[k] = typeof obj[k] === 'object' ? agruments.callee(obj[k]) : obj[k]

}

} return newObj

}

这里仅仅是实现了基本的深拷贝,对一些边界并没有进行妥善的处理。基本思路就是通过for in 循环,当值为对象的时候,再递归进行for in循环。

相关推荐:

php深浅拷贝,js实现深浅拷贝方法相关推荐

  1. 17.深浅拷贝和写时拷贝

    深浅拷贝 浅拷贝只拷贝指针,但拷贝后两个指针指向同一个内存空间: 深拷贝不但对指针进行拷贝,而且对指针指向的内容进行拷贝,经深拷贝后的指针指向两个不同地址. 当类成员不包括指针何引用时,浅拷贝并无问题 ...

  2. JS的深浅复制,原来如此!

    摘要:之所以会出现深浅拷贝的问题,实质上是由于JS对基本类型和引用类型的处理不同. 本文分享自华为云社区<js的深浅复制,一看就明白>,作者: 鑫2020. 浅复制的意思 浅复制是仅仅对数 ...

  3. js值的拷贝和值的引用_到达P值的底部:直观的解释

    js值的拷贝和值的引用 介绍 (Introduction) Welcome to this lesson on calculating p-values. 欢迎参加有关计算p值的课程. Before ...

  4. JS 中的 assign 方法究竟是 “深克隆” 还是 “浅克隆”?

    先说一下答案:assign做的是浅克隆. "第一层是深克隆,下面的每一层做的是浅克隆" 这种说法其实是错误的.    在我们去探究assign是深克隆还是浅克隆之前,我们必须先明白 ...

  5. js中text方法是啥意识_一盏茶的时间,快速捕获JS中常用的方法(细心整理,持续更新ing)...

    不知不觉上班一周辽-趁着大好周末,小编挣扎着从床上爬起来,决定对前端日常编程中常用到的一些方法做一个系统的整合. 有些人或许会觉得忘了百度就完事儿,no no no!这事儿小编真的亲践过好多次,百度一 ...

  6. php 合并数组对象,JS内数组合并方法与对象合并实现步骤详解

    这次给大家带来JS内数组合并方法与对象合并实现步骤详解,JS内数组合并方法与对象合并实现的注意事项有哪些,下面就是实战案例,一起来看一下. 1 数组合并 1.1 concat 方法var a=[1,2 ...

  7. 请尽可能说出js中数组的方法,最少3个,越多越好

    我接下来要把数组方法全都过一遍,顺手做个整理. 至于为什么整理这个,最近总听说面试经常会问到这个问题, 面试官灵魂发问:请尽可能说出js中数组的方法,最少3个,越多越好 据可靠消息了解到,如果你回答的 ...

  8. C#调用JS的几种方法

    cmd调用phantomjs 官方资料:http://phantomjs.org/quick-start.html 手动执行 从官方下载phantomjs.exe,拷贝它与要执行的js同目录 打开cm ...

  9. 【Android RTMP】x264 图像数据编码 ( NV21 格式中的 YUV 数据排列 | Y 灰度数据拷贝 | U 色彩值数据拷贝 | V 饱和度数据拷贝 | 图像编码操作 )

    文章目录 安卓直播推流专栏博客总结 一. NV21 图像数据中的 YUV 数据简介 二.向 x264 编码图片 三. 提取 NV21 数据中的灰度数据 Y 四. 提取 NV21 数据中的饱和度数据 U ...

最新文章

  1. 收藏的 sql经典语句 ---来自网上
  2. 单片机实现水位控制C语言,单片机课程设计 水位自动控制.doc
  3. Android 4.0 ICS SystemUI浅析——StatusBar加载流程分析
  4. RabbitMQ的项目实际应用
  5. Highlight Plus - Unity3D物体高亮插件使用教学
  6. 邮递员问题java实现_中国邮递员问题算法.PPT
  7. Java获取当前年份,计算当前月有多少自然日、有多少工作日、有几周
  8. nodejs--数据库与身份验证:初识数据库、安装并配置 MySQL、MySQL 的基本使用、SQL语法、在项目中操作 MySQL
  9. 获取微信公众号文章内容
  10. BM3D算法相关笔记
  11. 腾讯云服务器漏洞怎么修复,腾讯云安全中心监测到微软披露的99个漏洞,win系统云服务器用户尽快修复...
  12. python获取虎牙弹幕_python实现虎牙直播弹幕
  13. 《九日集训》打卡第二天
  14. JavaScript之赛车游戏
  15. 1.3 Codesys十六进制数字字符串与字节互转
  16. 【Java】Java计算器
  17. React中三元运算符的坑
  18. C# Winform开发 文件夹的删除
  19. 华北理工大学的计算机科学与技术在哪个学院,2021年华北理工大学有哪些专业好和学院及院系排名...
  20. strocli64 源码_storcli64和smartctl定位硬盘的故障信息

热门文章

  1. 硬盘占用100%解决
  2. AVpacket与avframe
  3. JAVA强制类型转换原理
  4. 当贝投影仪三个不同型号,优势性能大对比
  5. matplotlib绘制常见统计图
  6. 代理服务器和NAT技术
  7. opera linux 64 42.0,Opera 浏览器 beta
  8. fatal error C1189: #error: “You have to define _USE_MATH_DEFINES in the compiler settings“
  9. 已知银行整存整取存款不同期限的年息利率分别为
  10. OpenMMLab-AI实战营第二期——4-1.目标检测与MMDetection