js实现拷贝,使用普通赋值对象,在操作其中一个对象值的时候,另一个也会更改,不符合需求

因此引入深度拷贝,以下为实现深度拷贝的几种法:

Object.assign

// 合并多个对象
var target = { a: 1, b: 1 };
var source1 = { b: 2, c: 2 };
var source2 = { c: 3 };
Object.assign(target, source1, source2);

注意: 这个是伪深度拷贝,只能拷贝第一层

递归拷贝

function deepClone(source){
const targetObj = source.constructor === Array ? [] : {}; // 判断复制的目标是数组还是对象
for(let keys in source){ // 遍历目标
if(source.hasOwnProperty(keys)){
if(source[keys] && typeof source[keys] === 'object'){ // 如果值是对象,就递归一下
targetObj[keys] = source[keys].constructor === Array ? [] : {};
targetObj[keys] = deepClone(source[keys]);
}else{ // 如果不是,就直接赋值
targetObj[keys] = source[keys];
}
}
}
return targetObj;
}

... 拼接对象

let obj = {
name: 'admin'
} let obj2 = {
age: 14,
...obj
} console.log(obj2) // { age: 14, name: 'admin' }

js实现深度拷贝的更多相关文章

  1. js的深度拷贝和浅拷贝

    从extend看浅拷贝和深拷贝 请先查看: http://blog.sina.com.cn/s/blog_912389e5010120n2.html

  2. JS 深度拷贝 Object Array

    JS 深度拷贝 Object Array function cloneObj(o) { var isArray = o instanceof Array; var isObject = o insta ...

  3. js 深度拷贝

    js 数据类型 分为2种: 基本数据类型:Undefined.Null.Boolean.Number.String 复杂数据类型:Object.Array.function 他们的区别是在内存中的存储 ...

  4. js 数组的深度拷贝 的四种实现方法

    首先声明本人资质尚浅,本文只用于个人总结.如有错误,欢迎指正.共同提高. --------------------------------------------------------------- ...

  5. JS对象的拷贝

    1:对数据进行备份的时候,如果这个数据是基本的数据类型,那么很好办,通过赋值实现复制即可. 赋值与浅拷贝的区别 var obj1 = { 'name' : 'zhangsan', 'age' : '1 ...

  6. JS堆栈与拷贝

    一.堆栈的定义 1.栈是一种特殊的线性表.其特殊性在于限定插入和删除数据元素的操作只能在线性表的一端进行. 结论:后进先出(Last In First Out),简称为LIFO线性表.栈的应用有:数制 ...

  7. javascript中对数组对象的深度拷贝

    在前端开发的某些逻辑中,经常需要对现有的js对象创建副本,避免污染原始数据的情况. 如果是简单的一维数组对象,可以使用两个原生方法: 1.splice var arr1 = ['a', 'b', 'c ...

  8. Jquery的深度拷贝和深度克隆

    有人问,拷贝和克隆不都是“复制”的意思吗. 这位看官问的好,一般情况下是一样的,但在jquery中却有些不同.jqurey深度拷贝一般只js对象的复制,是$.extend()方法,jquery深度克隆 ...

  9. c#:如何处理对对象进行深度拷贝

    /// <summary> /// 对对象进行深度拷贝 /// </summary> /// <param name="obj"></pa ...

随机推荐

  1. Apache POI详解

    一 :简介 开发中经常会设计到excel的处理,如导出Excel,导入Excel到数据库中,操作Excel目前有两个框架,一个是apache 的poi, 另一个是 Java Excel Apache ...

  2. 域名和URL各部分组成

    什么是域名? 域名,是由一串用点分隔的名字组成的Internet上某一台计算机或计算机组的名称,用于在数据传 输时标识计算机的电子方位. IP地址是Internet主机的作为路由寻址用的数字型标识,人 ...

  3. css属性书写顺序(重点)

  4. Java IO流详解(三)——字节流InputStream和OutPutStream

    我们都知道在计算机中,无论是文本.图片.音频还是视频,所有的文件都是以二进制(字节)形式存在的,IO流中针对字节的输入输出提供了一系列的流,统称为字节流.字节流是程序中最常用的流.在JDK中,提供了两 ...

  5. 「CF1313C Skyscrapers」

    题目大意 给出一个长度为 \(N\) 的序列 \(a\) 需要构造出一个长度为 \(N\) 的序列 \(h\) 使得 \(\forall i \in \{1,2,\ldots ,N\} h_i \le ...

  6. Priority Queue(优先队列)

    今天早上起来完成了一个完整的基于二叉堆实现的优先队列,其中包含最小优先和最大优先队列. 上篇说了优先队列的特性,通过建堆和堆排序操作,我们就已经看到了这种数据结构中的数据具有某种优先级别,要么非根节点 ...

  7. 通过js检测浏览器支持的字体,从而显示支持的字体,让用户选择。

    http://www.zhangxinxu.com/wordpress/2018/02/js-detect-suppot-font-family/ 本文根据张鑫旭文章. 字体函数: var dataF ...

  8. echarts做飞线图

    先上图,要不感觉没有说服力: 飞线图应该是大屏中很常见的一种了,通常你可以很轻易的用datav做一个飞线图,而且datav做的大屏逼格真的很高,本身也是开源免费的项目,开箱即用,上手简单……行了回归正 ...

  9. mysql字符串相关函数(并与sql server对比)

    https://blog.csdn.net/zhengxiuchen86/article/details/81220779 1.判断子串substr在字符串str中出现的位置 例子:查询']'在‘OP ...

  10. php 随机生成汉字

    function getChar($num) // $num为生成汉字的数量 { $b = ''; for ($i=0; $i<$num; $i++) { // 使用chr()函数拼接双字节汉字 ...