8.深浅拷贝和异常处理

news/2025/2/12 5:33:17/

开发中我们经常需要复制一个对象。如果直接用赋值会有下面问题:
在这里插入图片描述

8.1 浅拷贝

首先浅拷贝和深拷贝只针对引用类型
浅拷贝:拷贝的是地址
常见方法:
1.拷贝对象:Object.assgin() / 展开运算符{…obj} 拷贝对象
2.拷贝数组:Array.prototype.concat() 或者 […arr]
在这里插入图片描述
但是浅拷贝只适用于单层(简单数据类型,里面不要再套复杂数据类型)

【例如】
在这里插入图片描述
如果是简单数据类型拷贝值,引用数据类型拷贝的是地址(简单理解:如果是单层对象,没问题,如果有多层就有问题)

8.2 深拷贝

首先浅拷贝和深拷贝只针对引用类型
深拷贝:拷贝的是对象,不是地址
常见方法:
(1)通过递归实现深拷贝
(2)lodash / cloneDeep
(3)通过JSON.stringify()实现

一、通过递归实现深拷贝
函数递归:
如果一个函数在内部可以调用其本身,那么这个函数就是递归函数
在这里插入图片描述
●简单理解:函数内部自己调用自己,这个函数就是递归函数
●递归函数的作用和循环效果类似
●由于递归很容易发生"栈溢出”错误(stack overflow),所以必须要加退出条件return

【示例】

// 拷贝函数
function deepCopy(newObj, oldObj) {for (let k in oldObj) {// 处理数组的问题if (oldObj[k] instanceof Array) {newObj[k] = []// 递归调用 把数组里的值一个一个给deepCopy(newObj[k], oldObj[k])}// 处理对象问题else if (oldObj[k] instanceof Object) {newObj[k] = {}// 递归调用  deepCopy(newObj[k], oldObj[k])}else {// k 属性名  oldObj[k] 属性值newObj[k] = oldObj[k]}}
}

深拷贝总结:
1.要用到函数递归
2.当我们在普通拷贝时,直接赋值即可。但是如果遇到数组或者对象,就需要再次调用递归函数
3.记住先Array再Object (因为数组也属于对象)

二、js库lodash里面cloneDeep内部实现了深拷贝
【示例】

<body><!-- 先引用 --><script src="lodash.min.js"></script><script>const obj = {name: 'Kai',age: 18,hobby: ['羽毛球', '足球'],family: {sister: 'pink'}}// 语法:_.cloneDeep(要被克隆的对象)const o = _.cloneDeep(obj)o.family.sister = 'blue'o.age = 3console.log(o)console.log(obj)</script>
</body>

三、利用JSON实现深拷贝
【示例】

<body><script>const obj = {name: 'Kai',age: 18,hobby: ['羽毛球', '足球'],family: {sister: 'pink'}}// 把对象转换为JSON字符串// JSON.stringify(obj)const o = JSON.parse(JSON.stringify(obj))console.log(o)o.family.sister = '1234'console.log(obj)</script>
</body>

在这里插入图片描述

在这里插入图片描述

8.3 throw抛出异常

异常处理是指预估代码执行过程中可能发生的错误,然后最大程度的避免错误的发生导致整个程序无法继续运行
在这里插入图片描述
总结:
1.throw抛出异常信息,程序也会终止执行
2.throw后面跟的是错误提示信息
3.Error对象配合throw使用,能够设置更详细的错误信息

8.4 try/catch捕获错误信息

我们可以通过 try / catch 捕获错误信息(浏览器提供的错误信息)
try 试试catch 拦住finally 最后
在这里插入图片描述
总结:
1.try-catch用于捕获错误信息
2.将可能发生错误的代码写在try代码段中
3.如果try代码段中出现错误后,会执行catch代码段,并截获到错误信息
4. finally不管是否有错误,都会执行

8.5 debugger

使用方法:
在这里插入图片描述


http://www.ppmy.cn/news/1041383.html

相关文章

构建LLM应用程序时需要了解的5件事

推荐&#xff1a;使用 NSDT场景编辑器 助你快速搭建可二次编辑的3D应用场景 1.幻觉 使用LLM时应注意的主要方面之一是幻觉。在LLM的背景下&#xff0c;幻觉是指产生不真实的&#xff0c;不正确的&#xff0c;无意义的信息。LLM非常有创意&#xff0c;它们可以用于不同的领域&am…

56.linux 进程管理命令和用户管理命令

目录 一、进程管理命令 1.ps 2.pstree 3.kill 4.pkill 5.&后台运行程序 6.jobs 7.fg bg 8.top 二、用户管理命令 1.系统存储用户信息的文件 2.添加新用户 3.修改用户密码 4.删除用户 一、进程管理命令 1.ps 用于查看当前系统中运行的进程信息。它可以…

Anaconda详细安装过程

一、前言 Anaconda是一个开源的Python和R编程语言的发行版本&#xff0c;用于数据科学、机器学习、人工智能和科学计算。它提供了一个集成的平台&#xff0c;包含了大量的开源工具、库和软件包&#xff0c;方便用户进行数据分析、处理和建模。 二、实验环境 WIndows10、11 …

【C++题解】[2020普及组模拟题]wgy的JX语言

P a r t Part Part 1 1 1 读题 题目描述 w g y wgy wgy发明了 J X JX JX编程语言&#xff0c;在这种编程语言里&#xff0c;只有 这个运算符&#xff0c;可以将某个变量的值增加。 现在输入 a a a&#xff0c; b b b&#xff0c; n n n&#xff0c;请问仅使用 a a a&…

Vue 2的计算属性与侦听器

计算属性 vs 方法 vs 侦听器 计算属性的出现是为了解决模板内表达式太过复杂而变得难以维护。 假设我们知道长和宽&#xff0c;要计算一个矩形的面积&#xff0c;如果没有计算属性&#xff0c;我们可能像下面这样处理&#xff1a; <div id"app"><input t…

机器视觉应用开发什么最重要?

&#xff08;QQ群有答疑&#xff09;零基础小白快速上手海康VisionMaster开发系列课程 高级语言在机器视觉就是工具&#xff0c;机器视觉软件&#xff0c;在机器视觉中也是工具&#xff0c;在机器视觉应用开发中&#xff0c;图像处理是最重要的&#xff0c;一切看图像&#xff…

【Docker】docker搭建Ftp服务器,真香

Docker搭建Ftp服务器&#xff0c;真香 1.搜索镜像2.进行下载3.启动docker4.访问5.兼容问题 方便公司正常内网传递大文件&#xff0c;FTP服务就派上用场了&#xff0c;ftp分为主动模式&#xff08;PORT&#xff09;和被动模式(PASV)。主动模式使用20和21端口&#xff0c;其中20为…

设计师必备的5个PNG免抠素材网站,简直不要太好用~

广大设计师们是不是经常要用免抠素材的时候网上找的质量差&#xff0c;还要各种付费才能使用&#xff0c;最后只能打开PS慢慢的扣&#xff0c;真的很费时间。本期我就给大家推荐5个高质量、免费的免抠素材网站&#xff0c;有需要的朋友们赶紧收藏。 菜鸟图库 https://www.suc…