JS数据拷贝
JS的拷贝可分为浅拷贝和深拷贝:
浅拷贝:如果数组元素是基本类型,就会拷贝一份,互不影响,而如果是对象或者数组,就会只拷贝对象和数组的引用,这样我们无论在新旧数组进行了修改,两者都会发生变化。
深拷贝:就是指完全的拷贝一个对象,即使嵌套了对象,两者也相互分离,修改一个对象的属性,也不会影响另一个。
通常我们用的slice(截取)、concat(拼接)函数,都是浅拷贝。
// 可用concat、slice返回一个新数组的特性来实现拷贝
var arr = ['old', 1, true, null, undefined];
var new_arr = arr.concat(); // 或者var new_arr = arr.slice()也是一样的效果;
new_arr[0] = 'new';
console.log(arr); // ["old", 1, true, null, undefined]
console.log(new_arr); // ["new", 1, true, null, undefined] // 数组嵌套了对象或者数组的话用concat、slice拷贝只要有修改会引起新旧数组都一起改变
var arr = [{old: 'old'}, ['old']];
var new_arr = arr.concat(); // 或者var new_arr = arr.slice()也是一样的效果;
arr[0].old = 'new';
new_arr[1][0] = 'new';
console.log(arr); // [{old: 'new'}, ['new']]
console.log(new_arr); // [{old: 'new'}, ['new']]
如果需要深拷贝,有如下2种方法:
1:可拷贝数组和对象(但不能拷贝函数)
var arr = ['old', 1, true, ['old1', 'old2'], {old: 1}]
var new_arr = JSON.parse(JSON.stringify(arr))
console.log(new_arr);
2.函数实现,拷贝的时候判断属性值的类型,如果是对象,继续递归调用深拷贝函数
function(obj) {
// 只拷贝对象
if (typeof obj !== 'object') return;
// 根据obj的类型判断是新建一个数组还是一个对象
var newObj = obj instanceof Array ? [] : {};
for (var key in obj) {
// 遍历obj,并且判断是obj的属性才拷贝
if (obj.hasOwnProperty(key)) {
// 判断属性值的类型,如果是对象递归调用深拷贝
newObj[key] = typeof obj[key] === 'object' ? deepCopy(obj[key]) : obj[key];
//改成下面的代码,就是浅拷贝
//newObj[key] = obj[key];
}
}
return newObj;
}
参考文章:https://blog.csdn.net/qq_37268201/article/details/80448848
JS数据拷贝的更多相关文章
- JS深浅拷贝及其实现
基本数据类型和引用数据类型 JS数据分为基本数据类型和引用数据类型.基本数据类型的变量存储在栈中,引用数据类型则存储在堆中,引用数据类型的存储地址则保存在栈中. 下面来看一个小例子 // 基本数据类型 ...
- JS 数据类型转换
JS 数据类型转换 方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把 ...
- JS 深度拷贝 Object Array
JS 深度拷贝 Object Array function cloneObj(o) { var isArray = o instanceof Array; var isObject = o insta ...
- docker数据拷贝
docker数据拷贝的方式有很多种,下面介绍几种数据拷贝的方式:此处只是介绍几种简易的方式,更多方式可以google下. 从容器中向主机拷贝数据 docker cp <containerId&g ...
- JS数据类型转换
JS 数据类型转换 方法主要有三种 转换函数.强制类型转换.利用js变量弱类型转换. 1. 转换函数: js提供了parseInt()和parseFloat()两个转换函数.前者把值转换成整数,后者把 ...
- scroll pagination.js数据重复加载、分页问题
scroll pagination.js数据重复加载.分页问题 解决办法 参考资料: http://blog.csdn.net/dyw442500150/article/details/1753242 ...
- template.js 数据渲染引擎
template.js 数据渲染引擎 template.js是一款JavaScript模板引擎,用来渲染页面的. 原理:提前将Html代码放进编写模板 <script id="tpl& ...
- js 深度拷贝
js 数据类型 分为2种: 基本数据类型:Undefined.Null.Boolean.Number.String 复杂数据类型:Object.Array.function 他们的区别是在内存中的存储 ...
- m_Orchestrate learning system---三十五、php数据和js数据的解耦:php数据(php代码)不要放到js代码中
m_Orchestrate learning system---三十五.php数据和js数据的解耦:php数据(php代码)不要放到js代码中 一.总结 一句话总结:也就是以html为中介,用html ...
随机推荐
- JavaWeb_(Spring框架)认识Spring中的aop
1.aop思想介绍(面向切面编程):将纵向重复代码,横向抽取解决,简称:横切 2.Spring中的aop:无需我们自己写动态代理的代码,spring可以将容器中管理对象生成动态代理对象,前提是我们对他 ...
- manjaro 18.10 install soft
1.添加新账户 useradd username新建账户; useradd -d /home/xxx -m xxx创建用户,并同时生成用户目录,不然账户无法正常启用; passwd username修 ...
- COM组件双接口对象模型
模型如下: 这里COM对象一共实现了三个接口,IUnknown,IDispatch, Ixxx. 每个COM都必须实现IUnknown,不考虑在内的话共实现了IDispatch和自定义接口Ixxx两个 ...
- benchmark在postgresql上的安装及使用
BenchmarkSQL是一款经典的开源数据库测试工具,内嵌了TPCC测试脚本,可以对EnterpriseDB.PostgreSQL.MySQL.Oracle以及SQL Server等数据库直接进行 ...
- UML期末复习题——2.8:UML Design Class Diagram(DCD)
第八题:设计类图 重要概念: 1. 类图(Class Diagram): 类图是面向对象系统建模中最常用和最重要的图,是定义其它图的基础.类图主要是用来显示系统中的类.接口以及它们之间的静态结构和关系 ...
- ForkJoinPool 源码分析
ForkJoinPool ForkJoinPool 是一个运行 ForkJoinTask 任务.支持工作窃取和并行计算的线程池 核心参数+创建实例 // 工作者线程驻留任务队列索引位 static f ...
- 阶段5 3.微服务项目【学成在线】_day02 CMS前端开发_23-CMS前端页面查询开发-分页查询实现
修改为默认的参数 点击分页的事件 current-change 我们弹个alert测试下 看文档,参数是当前页 把当前页的数据赋值给params.page这个对象 分页效果实现 最终代码 <te ...
- JavaFX入门:简单Demo-学习NetBeans开发平台
零. 最终目标 通过两种方式(纯代码控制.FXML),实现一个简单的登录界面: Paste_Image.png 涉及到的控件: 文本(Text,动态显示内容).标签(Label,显示文本).文本域 ...
- spring常用模式--委派模式
1.委派模式简介 在常用的23种设计模式中其实面没有委派模式(delegate)的影子,但是在Spring中委派模式确实用的比较多的一种模式. 在spring中的体现:Spring MVC框架中的Di ...
- 【论文笔记】DeepOrigin: End-to-End Deep Learning for Detection of New Malware Families
DeepOrigin: End-to-End Deep Learning for Detection of New Malware Families 标签(空格分隔): 论文 论文基本信息 会议: I ...