JS Object Deep Copy & 深拷贝 & 浅拷贝

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign

Object.assign 是浅拷贝

针对深度拷贝,需要使用其他方法 JSON.parse(JSON.stringify(obj));,因为 Object.assign() 拷贝的是属性值。

假如源对象的属性值是一个指向对象的引用,它也只拷贝那个引用值。


function test() {
let a = { b: {c:4} , d: { e: {f:1}} }; let g = Object.assign({},a); let h = JSON.parse(JSON.stringify(a)); console.log(g.d); // { e: { f: 1 } }
g.d.e = 32; console.log('g.d.e set to 32.')
// g.d.e set to 32.
console.log(g); // { b: { c: 4 }, d: { e: 32 } }
console.log(a); // { b: { c: 4 }, d: { e: 32 } } console.log(h);
// { b: { c: 4 }, d: { e: { f: 1 } } } h.d.e = 54;
console.log('h.d.e set to 54.') ;
// h.d.e set to 54. console.log(g); // { b: { c: 4 }, d: { e: 32 } }
console.log(a); // { b: { c: 4 }, d: { e: 32 } } console.log(h);
// { b: { c: 4 }, d: { e: 54 } }
}
test();

jQuery

https://stackoverflow.com/questions/122102/what-is-the-most-efficient-way-to-deep-clone-an-object-in-javascript

I want to note that the .clone() method in jQuery only clones DOM elements.

https://api.jquery.com/jQuery.extend/

将两个或多个对象的内容合并到第一个对象中。

// Shallow copy
var newObject = jQuery.extend({}, oldObject); // Deep copy
var newObject = jQuery.extend(true, {}, oldObject);

https://api.jquery.com/jquery.extend/

https://api.jquery.com/clone/


xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


JS Object Deep Copy & 深拷贝 & 浅拷贝的更多相关文章

  1. JS Object Deep Copy & 深拷贝

    JS Object Deep Copy & 深拷贝 针对深度拷贝,需要使用其他方法 JSON.parse(JSON.stringify(obj));,因为 Object.assign() 拷贝 ...

  2. 由Python的浅拷贝(shallow copy)和深拷贝(deep copy)引发的思考

    首先查看拷贝模块(copy)发现: >>> help(copy)Help on module copy:NAME    copy - Generic (shallow and dee ...

  3. copy&mutableCopy 浅拷贝(shallow copy)深拷贝 (deep copy)

    写在前面 其实看了这么多,总结一个结论: 拷贝的初衷的目的就是为了:修改原来的对象不能影响到拷贝出来得对象 && 修改拷贝出来的对象也不能影响到原来的对象 所以,如果原来对象就是imm ...

  4. js 中引用类型 的深拷贝 和 浅拷贝的区别

    一.曾经在读JQ源码的时候,对深拷贝算是有了一点的理解.我们在项目中是不是经常会遇到这样的问题呢? 后台返回一个数组对象(引用类型).次数在页面渲染中需要对部分数据进行处理 比如:银行卡6234509 ...

  5. js引用类型赋值,深拷贝与浅拷贝

    JS中引用类型使用等号“=” 赋值,相当于把原来对象的地址拷贝一份给新的对象,这样原来旧的对象与新的对象就指向同一个地址,改变其中一个对象就会影响另外那个对象,也就是所谓的浅拷贝.例如: var ar ...

  6. [CareerCup] 13.4 Depp Copy and Shallow Copy 深拷贝和浅拷贝

    13.4 What is the difference between deep copy and shallow copy? Explain how you would use each. 这道题问 ...

  7. 深拷贝(deep clone)与浅拷贝(shallow clone)

    深拷贝(deep clone)与浅拷贝(shallow clone) 浅复制(浅克隆):被复制对象的所有变量都含有与原来的对象相同的值,而所有的对其他对象的引用仍然指向原来的对象.换言之,浅复制仅仅复 ...

  8. JS中的引用、浅拷贝和深拷贝

    js的深拷贝浅拷贝是很常遇到的问题,一直模模糊糊有点说不过去,所以这次好好总结一下. 1.js的引用 JS分为基础类型和引用类型两种数据类型: 基础类型:number.string.boolean.n ...

  9. JS数组和对象的浅拷贝和深拷贝

    共勉~ 在许多编程语言中,传递参数和赋值是通过值的直接复制或者引用复制完成的.在JavaScript中,对于值是直接进行复制还是引用复制在语法上是没有区别的,完全是根据值的类型来决定的. 在JavaS ...

随机推荐

  1. kvm实战

    1. 安装环境 # yum install qemu-kvm libvirt virt-install virt-manager virt-viewer -y # systemctl start li ...

  2. python3多进程 进程池 协程并发

    一.进程           我们电脑的应用程序,都是进程,进程是资源分配的单位.进程切换需要的资源最大,效率低.         进程之间相互独立         cpu密集的时候适合用多进程 #多 ...

  3. The OAuth 2.0 Authorization Framework OAuth2.0的核心角色code 扫码登录

    RFC 6749 - The OAuth 2.0 Authorization Framework https://tools.ietf.org/html/rfc6749 The OAuth 2.0 a ...

  4. vue组件中data为什么必须是一个函数?

    因为JavaScript的特性所导致,在component中,data必须以函数的形式存在,不可以是对象. 组建中的data写成一个函数,数据以函数返回值的形式定义,这样每次复用组件的时候,都会返回一 ...

  5. 配置CLion管理Qt项目国际化支持

    随着Qt 6的发布,cmake也正式宣告接管qmake的工作了. 在之前的一篇博客里我介绍了如何使用cmake管理你的qt项目,不过有一点我没有讲,那就是对国际化(i18n)的处理. 今天我们就来介绍 ...

  6. HTML5 使用浏览器内置数据库之 indexedDB

    indexedDB是H5规范里的浏览器内置数据库,是nosql数据库的一种.因为另一种数据库Web SQL不再受W3C支持,所以还得学习下这个. 基本情况 兼容性:ie11及以上都支持, W3C是这么 ...

  7. 学习SpringBoot,整合全网各种优秀资源,SpringBoot基础,中间件,优质项目,博客资源等,仅供个人学习SpringBoot使用

    学习SpringBoot,整合全网各种优秀资源,SpringBoot基础,中间件,优质项目,博客资源等,仅供个人学习SpringBoot使用 一.SpringBoot系列教程 二.SpringBoot ...

  8. HTML5 初学者一步一步攀爬 努力加油学习

    Html 5 Html:Hyper Text MarKup Language超文本标签语言 Html:网页的源码 浏览器:"解释和执行"HTMl源码的工具 Head 标签内的信息用 ...

  9. Java中运行javascript代码

    Java中运行javascript代码 1.Java 代码 2.JS代码 2.1demoWithParams.js 2.2demoWithListParams.js 原文作者:russle 原文地址: ...

  10. sql画图

    ---------------------------------------------------------------------------------------------------- ...