js 深拷贝和浅拷贝

js 深拷贝和浅拷贝

先举一下项目中遇到的两个例子:

例子1:


var json = $.parseJSON(data.data); 
//data.data是后台返回的值 
var a = json.channels;
var b = json.channels;
console.log(a===b)//true

这个例子是浅拷贝,a、b两个对象是完全相等的,指向的内存地址也是一样的,a和b会互相影响,当b对象改变时,a也会跟着改变。

在项目中就吃了这个亏,a对象本来想要存一个原始值,b是一个在原始值上会变动的数组,最后a和b会进行对比,但是发现这两个一直都是b修改后的最新数组,最后修改方式为下一个例子


例子2:


var json = $.parseJSON(data.data);
var a = $.parseJSON(data.data).channels;
var b = $.parseJSON(data.data).channels;
console.log(a === b);//false

这个例子是深拷贝,a、b两个对象指向的内存地址是不一样的,当赋值的时候同时给对象开了新的内存地址,所以判断的时候是false。a和b两个对象由于指向的内存地址不一样了所以不会互相影响


浅拷贝:一般是直接对(object、array)属性的拷贝,如例子一就是直接对json这个对象里的channels属性进行了拷贝,这样的拷贝是会互相影响值

深拷贝:如果想要互不影响达到深拷贝效果可以采用以下方法:

  • Array.prototype.slice(),
  • Array.prototype.concat(),
  • jQury的$.extend({},obj)
  • JSON.parse(),
  • JSON.stringify(),
  • jQury的$.extend(true,{},obj),
  • lodash的_.cloneDeep
  • _.clone(value, true)

举一个示范例子:



var a = {c:1};
var b = $.extend(true,{},a);
var d = a;
console.log(a===b);//false
console.log(a===d);//true
a.c = 2;
console.log(b.c);//1 深拷贝 没有受到a影响,所以仍为1
console.log(d.c);//2 浅拷贝 受到a影响,所以改成2

其实整篇最根本原因是对象的内存分配问题,这个将会在下一篇具体说明~


更多专业前端知识,请上 【猿2048】www.mk2048.com

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/361344.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

在jOOQ之上构建的RESTful JDBC HTTP服务器

jOOQ生态系统和社区正在持续增长。 我们个人总是很高兴看到基于jOOQ构建的其他开源项目。 今天,我们非常高兴为您介绍BjrnHarrtell结合REST和RDBMS的一种非常有趣的方法。 BjrnHarrtell从小就是瑞典的程序员。 他通常在Sweco Position AB上忙于编写GIS系统和集成&a…

Tiny Wings 为什么能迅速成为 iOS App Store 付费应用第一名?

Tiny Wings 不知是有意无意,完美的利用了人的性意识。有节奏感的上上下下,找准G点后毫不犹豫的迎头猛扎下去。期待自己拥有绝佳技巧,不放过任何一次能high起来的机会。飞上天触到云的瞬间high得全身淋漓畅快,连续多触云几次基本上…

node.js 搭建http调取 mysql数据库中的值

首先,我们先在数据库中创建两个表t_news,t_news_type;插入数据: 然后我们再写代码: //加载模块express var express require("express"); var fs require("fs"); //加载路径 var url require("url"); //加…

Spring Caching抽象和Google Guava Cache

Spring为缓存昂贵的方法调用提供了强大的开箱即用支持。 这里详细介绍了缓存抽象。 我的目的是要介绍Spring现在为框架的4.0版本提供的较新的缓存实现之一-使用Google Guava Cache 简而言之,请考虑一种具有几种慢速方法的服务: public class DummyBoo…

NHibernate.3.0.Cookbook第三章第9节的翻译

Using stateless sessions 使用无状态会话 当进行大量数据处理的时候,可能会放弃使用一些高级特性,而使用更接近底层的API来提高性能.在NHibernate中,这种高性能的底层API就是无状态的会话.本节介绍如何使用无状态会话来更新movie对象的价格. 准备 使用第一章的Eg.Core和第二章…

致电以验证您的JavaFX UI的响应能力

最近,Jim Weaver在他的Surface Pro上为演示安装了我的小图片索引应用“ picmodo”,并且GUI变成了垃圾。 显然,Windows Tablet上JavaFX的基本字体大小很高: 我认为,即使调整大小行为和预期一样工作,UI也绝…

上周热点回顾(7.9-7.15)

热点随笔: 2012五大主流浏览器 HTML5 和 CSS3 兼容性大比拼(梦想天空(山边小溪)) 原创:让密码不再被遗忘 - 在web中尝试图形口令!(网无忌) 构建一个Outlook风格漂亮界面…

vuex 管理vue-router的传值

假设有这样的一种情况,在两个组件中。一个组件【A】主要是比如说放表格数据,而另外一个组件【B】是专门用来向组件A的表格添加数据的表单。这个时候就是两个兄弟组件之间传递数据了。首先想到的是使用兄弟组件传递数据的方法: 新建一个中间件…

命令行下使用curl,采集数据遇到的问题。

前几天遇到这样一个问题,写了一段php采集程序,里面用到了curl_init()等,在浏览器里可以获得数据,但在命令行里不可以用的php环境是wamp,加载了php_curl, php.ini文件里面加载的,打印phpinfo 也显…

纪事地图和Yahoo Cloud服务基准

总览 Yahoo Cloud Service Benchmark是一种相当广泛使用的基准测试工具,用于测试大量密钥(例如1亿)和少量客户端(即由一台计算机提供服务)的密钥值存储。 在本文中,我将研究如何使用Chronicle Map在具有12…

JSP 插入到数据库的数据出现 “SQLServerException: 将截断字符串或二进制数据” 错误解决方案

最近在编写一个小型基于的jsp系统开发。掌握数据库一直感觉还不错。但是今天就出现了一个问题困扰我大半天。后来本来准备睡觉,但是觉得今天不解决这个问题恐怕晚上是“彻夜难眠啊”!!于是打开电脑,又开始捣腾。遇到问题首先去网上…

c++ 错误处理

void __fastcall TForm1::Button1Click(TObject *Sender) { try { int iEdit1->Text.ToInt(); Edit1->TextAnsiString(10/i); } catch (...) { ShowMessage("Error"); } } 通过 为知笔记 发布转载于:https://www.cnblogs.com/xe2011/archive/2012/07/16/55298e…

使用FizzBu​​zz和Mockito进行单元测试

我有时使用FizzBu​​zz向新手演示单元测试的基础。 尽管FizzBu​​zz确实是一个简单的问题,但是它也可以用于演示更高级的单元测试技术,例如模拟 。 FizzBu​​zz Kata: “ 编写一个程序,打印从1到100的数字。但是,…

前后端分手大师——MVVM 模式

阅读目录简而言之组成部分没有什么是一个栗子不能解决的简而言之 之前对 MVVM 模式一直只是模模糊糊的认识,正所谓没有实践就没有发言权,通过这两年对 Vue 框架的深入学习和项目实践,终于可以装B了有了拨开云雾见月明的感觉。 Model–View–…

Java性能调优调查结果(第三部分)

这是该系列文章的第三篇,我们将分析2014年10月进行的调查的结果。如果您尚未这样做,我建议从该系列的前两篇文章开始: 问题严重性分析和监视域分析 。 这篇文章着重于故障排除/根本原因检测。 本调查部分的背景:意识到性能问题并…

划分树

昨天的杭电多校联合训练热身赛的一道题,求区间的中位数,快排会超时,划分树的模版题。。 划分树是一种基于线段树的数据结构。主要用于快速求出(在log(n)的时间复杂度内)序列区间的第k大值 。划分树和归并树都是用线段树作为辅助的…

Canvas事件绑定

canvas事件绑定 众所周知canvas是位图,在位图里我们可以在里面画各种东西,可以是图片,可以是线条等等。那我们想给canvas里的某一张图片添加一个点击事件该怎么做到。而js只能监听到canvas的事件,很明显这个图片是不存在与dom里面…

使用Maven配置JBoss / Wildfly数据源

大多数Java EE应用程序在其业务逻辑中使用数据库访问,因此开发人员经常面临在应用程序服务器中配置驱动程序和数据库连接属性的需求。 在本文中,我们将使用Maven为JBoss / Wildfly和Postgre数据库自动化该任务。 这项工作是根据我从以前的魔兽拍卖批量应…

控件注册 - 利用资源文件将dll、ocx打包进exe文件(转)

很多时候自定义或者引用控件都需要注册才能使用,但是如何使要注册的dll或ocx打包到exe中,使用户下载以后看到的只是一个exe,点击直接运行呢?就像很多安全控件,如支付宝的aliedit.exe那样。 现在介绍一种使用资源文件,将…

Canvas-图片旋转

Canvas-图片旋转 众所周知canvas是位图,你可以在里面渲染你要的东西,不过你只能操作canvas的属性来进行编辑。就是说你并不能操作画进canvas的东西,例如我在canvas里添加一幅画,我现在想将那幅画移动10px,我们并不能直…