Object.assign() 方法可以把任意多个的源对象自身的可枚举属性拷贝给目标对象,然后返回目标对象

 var obj = { a: 1 };
var copy = Object.assign({}, obj);
console.log(copy); // { a: 1 }

合并对象

 var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { c: 3 };
var obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1); // { a: 1, b: 2, c: 3 }, 注意目标对象自身也会改变

深度拷贝

假如需要深度拷贝的话,仍旧需要使用别的而不是本方法。因为 Object.assign() 拷贝的是在 source 里是对象的属性的引用而不是对象本身

function test() {
let a = { b: {c:4} , d: { e: {f:1}} }
let g = Object.assign({},a)
let h = JSON.parse(JSON.stringify(a)); //克隆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 } }
} //克隆生成的对象是独立的,克隆对象和源对象互不影响

Object.assign方法复制或合并对象的更多相关文章

  1. 纯原生仿ES6的Object.assign,实现深度合并对象

    源码: function isObj(x){ var type = typeof x; return x !== null && (type === 'object' || type ...

  2. Object.assign()方法

    对象的扩展 1.ES6中,对象的属性和方法可简写:对象的属性值可不写,前提是属性名已经声明: var name = "zhangsan"; "; var obj = { ...

  3. JavaScript 复制对象【Object.assign方法无法实现深复制】

    在JavaScript这门语言中,数据类型分为两大类:基本数据类型和复杂数据类型.基本数据类型包括Number.Boolean.String.Null.String.Symbol(ES6 新增),而复 ...

  4. 字符串操作函数:JSON.parse()与JSON.stringify()的区别,字符串转数组 str.split(','),数组转字符串String(),以及对象拼接合并Object.assign(),数组拼接合并concat()

    1.JSON.parse()  把字符串转化为 json 对象 例如 arr={ , "site":"www.runoob.com" } var obj = J ...

  5. ES6中Object.assign() 方法

    ES6中Object.assign() 方法 1. 对象合并Object.assign 方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象上.如下代码演示: var targ ...

  6. javascript学习总结之Object.assign()方法详解

    最近再写ES6的文章时候发现自己对Object.assign()方法不太了解,之前也没有接触过所以就就查阅了相关的资料,为了自己以后肯能会用到以及对知识进行巩固,所以在这里记录下自己学习的点点滴滴,毕 ...

  7. Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象。

    Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象. 语法EDIT Object.defineProperty(obj, ...

  8. 解决webpack和gulp打包js时ES6转译ES5时Object.assign()方法没转译成功的问题

    在webpack或gulp打包的配置文件中package.json 引入"@babel/plugin-transform-object-assign": "^7.2.0& ...

  9. object.assign()方法的使用

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

随机推荐

  1. Java新人学习(li)

    一.项目中搭配使用SVN和Git 安装SVN:安装熟悉Git:安装maven,修改setting.xml文件:安装eclipse,配置jdk.maven路径: 建立自己的Git仓库,熟悉常用的Git命 ...

  2. JVM-String比较-字节码分析

    一道String字符串比较问题引发的字节码分析 public class a { public static void main(String[] args)throws Exception{ } p ...

  3. struts通过action返回json

    其实struts2通过action返回json挺简单的,但是就是老要忘,所以索性写在博客上.好的,开始. 首先是引入必须的jar包: struts2-json-plugin-2.3.24.jar 然后 ...

  4. php 实现设计模式之 享元模式

    <?php class Book{ public $title; public $author; public function __construct($title,$author){ $th ...

  5. Chocolat.js – 响应式的 jQuery Lightbox 插件

    Chocolat.js 使您能够显示一个或多个图像在同一页面上.给用户展示一组图片缩略图,可以显示全页或块.Chocolat.js 可以很好地处理所有主要的浏览器.它在下面这些浏览器测试通过:IE7+ ...

  6. 分享15款很实用的 Sass 和 Compass 工具

    Sass 是 CSS 的扩展,增加了嵌套规则,变量,混入功能等很多更多.它简化了组织和维护 CSS 代码的成本.Compass 是一个开源的 CSS 框架,使得使用 CSS3 和流行的设计模式比以往任 ...

  7. angularjs—指令input

    input[text] input一般和ngModel结合使用来实现双向绑定,同时angular提供了很多表单校验的指令 required 必填 ngRequired 必填(ngRequired可以控 ...

  8. js 理解new的运行机制

    先上段代码: function People(name) { this.name = name; } People.prototype.sayName = function () { console. ...

  9. hibernate(3) —— 关系映射

    hibernate中关系映射指的是实体类与实体类间的关系.和数据库中表与表之间的关系类似,有一对一,多对一,一对多,多对多四种映射关系. 一:一对一映射 两个对象之间是一对一的关系,如人和身份证之间是 ...

  10. ArcGIS中的VBA修复

    一直以来,ArcGIS10.1 的VBA安装后,菜单栏里也没相关菜单,听说是许可的问题,直到遇到这个问题才知道真正的原因. 由于项目需要使用了ArcGIS10.0, 不知道操作了什么,打开ArcMap ...