近期项目因为怕数据污染所以用到了js的对象复制

js里的对象都是继承自object,是引用类型,所以无法通过=号复制

所以整理了一些常用的复制方法,如下

一、通过JSON序列化和反序列化创建新的对象

 var obj = { a: 1, b: '2' };
var newObj = JSON.parse(JSON.stringify(obj));

测试一下:

obj.a = 3;//obj和newObj指向了不同的引用,所以newObj的b属性并不会变化
console.log(newObj);
console.log(obj);

测试结果:

然而,这个方法并不能进行深度复制,对于function属性并不能复制到。那么就有了下面的深度复制方式

二、深度对象复制

function clone(o) {
var s = {};
for (var k in o)
s[k] = typeof o[k] === 'object' ? clone(o[k]) : o[k];
return s;
}

测试一波:

var obj = {
a: 1,
b: 'b',
c: false,
d: new Date(),
e: { e: 1 },
f: function () { console.log(this.g) },
g: [1, 2]
};
var newObj = clone(obj);
console.log(newObj);
newObj.f();

测试结果:

二、Array的快速复制

Array.prototype.concat可以拼接两个数组并返回新对象,利用这一特性,可以快速复制一个数组

var arr1 = [1];
var arr2 = [].concat(arr1);

测试一波:

JavaScript对象复制的更多相关文章

  1. JavaScript对象复制(一)(转载)

    在JavaScript很多人复制一个对象的时候都是直接用"=",因为大家都觉得脚本语言是没有指针.引用.地址之类的,所以直接用"="就可以把一个对象复制给另外一 ...

  2. Javascript 对象复制

    如果对象只是一个数据集,可采用json化再反json化的方式克隆一个对象,这个过程会丢失对象的方法.效率比较低. 可以采用如下递归的方式复制一个对象. function clone(target) { ...

  3. Javascript 对象复制(深浅拷贝)

    一.数据类型分类: 基本变量 引用类型 二.什么叫做指针指向 栈内存.堆内存.指针指向(如下红圈圈的斜线). 三.赋值.拷贝.引用区别? 赋值指一个变量赋予某个值,包含两种方式,一种是直接量,另一种, ...

  4. JavaScript对象复制(二)

    <script> function copy(a) { ret = {}; for (sth in a) { temp = a[sth]; if (temp instanceof Arra ...

  5. 【转】JavaScript中的对象复制(Object Clone)

    JavaScript中并没有直接提供对象复制(Object Clone)的方法.因此下面的代码中改变对象b的时候,也就改变了对象a. a = {k1:1, k2:2, k3:3}; b = a; b. ...

  6. JavaScript对象的深浅复制

    前言 从层次上来看,对象的复制可以简单地分为浅复制和深复制,顾名思义,浅复制是指只复制一层对象的属性,不会复制对象中的对象的属性,对象的深复制会复制对象中层层嵌套的对象的属性. 在复制对象时,除了要复 ...

  7. 如何深度复制一个javascript对象

    前言 最近有人问我,如何将一个对象复制一份,因为他遇到了一个需求,需要将后端获取的数据,保存一份,原始数据会因为交互而发生变化,最终需要对比两份数据的异同. 他是一个刚入行的小朋友,他的实现方式就是新 ...

  8. web前端学习(二) javascript对象和原型继承

    目录 1. JavaScrpt对象 2. 原型对象和继承 3. 对象的克隆 (1)javascript对象 在JS中,对象是属性的容器.对于单个对象来说,都由属性名和属性值构成:其中属性名需要是标识符 ...

  9. JS对象复制

    在JavaScript很多人复制一个对象的时候都是直接用"=",因为大家都觉得脚本语言是没有指针.引用.地址之类的,所以直接用"="就可以把一个对象复制给另外一 ...

随机推荐

  1. Jmeter5.11安装

    jmeter5.11要对应jdk1.8以上版本 1.选择zip后缀进行下载 2.配置环境变量 (1)电脑桌面---->"计算机"图标---->鼠标右键选择"属 ...

  2. spring-JDBC模板

    Spring的JDBC的模板 Spring是EE开发的一站式的框架,有EE开发的每层的解决方案. Spring对持久层也提供了解决方案:ORM模块和JDBC的模板. Spring提供了很多的模板用于简 ...

  3. python简单的游戏场景代码

    模拟英雄联盟游戏场景的简单场景 最后计算出英雄的战斗力 class Hero: def __init__(self, na, gen, age, fig): self.name = na self.g ...

  4. jmeter测试 flask 接口请求

    jmeter测试 flask 接口请求 flask的代码如下: #!/usr/bin/env python # -*- coding: utf-8 -*- from flask import Flas ...

  5. git 项目最常用命令总结

    本文为博主原创,未经允许不得转载: 1.查看git基础配置信息 1.查看用户名和邮箱地址 git config user.name   git config user.email 2.修改用户名和邮箱 ...

  6. ISO/IEC 9899:2011 条款6.10——预处理指示符

    6.10 预处理指示符 语法 1.preprocessing-file: groupopt group: group-part group    group-part group-part: if-s ...

  7. C# Newtonsoft.Json解析json字符串处理(最清晰易懂的方法)

    需求: 假设有如下json字符串: { ", "employees": [ { "firstName": "Bill", &quo ...

  8. Spring cloud微服务安全实战-7-3prometheus环境搭建

    Prmetheus 主要用来做来Metrics的监控和报警,这张图是官方的架构图. 这是他的核心 它的作用是根据我们的配置去完成数据的采集.服务的发现,以及数据的存储. 这是服务的发现,通过Servi ...

  9. 监听微信、支付宝等移动app及浏览器的返回、后退、上一页按钮的事件方法

    在实际的应用中,我们常常需要实现在移动app和浏览器中点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面或执行一些其它操作的 需求,那在代码中怎样监听当点击微信.支付宝.百度糯米.百度钱包 ...

  10. ou can mix require and export. You can't mix import and module.exports.

    ou can mix require and export. You can't mix import and module.exports.