在写一些插件的时候,我们会经常遇到所传参数需要合并默认参数,并覆盖相同参数的情况,在jQuery中我们可以使用$.extend(),在原生中要想使用得自己封装,

但自从es6出现了Object.assign,我们就方便多了

var obj = {
name:"a",
age: 28,
gender: "male"
}; var defaultObj = {
name: "佚名",
age: 18
}
var res = Object.assign(defaultObj , obj);
     console.log(res);  //{name: "a", age: 28, gender: "male"}

可以看到上面的代码已经实现了我们的需求,但注意这里有一些坑,我们来看下面的代码

var obj = {
name:"a",
age: 28,
gender: "male"
}; var defaultObj = {
name: "佚名",
age: 18
}
var res = Object.assign(defaultObj , obj);
     console.log(res);  //{name: "a", age: 28, gender: "male"}
console.log(obj); //{name: "a", age: 28, gender: "male"}
console.log(defaultObj); //{name: "a", age: 28, gender: "male"}

可以看到我们同时也污染了defaultObj的值,那么怎么解决这样尴尬的局面呢,解决方案其实也很简单,代码如下

var obj = {
name:"a",
age: 28,
gender: "male"
}; var defaultObj = {
name: "佚名",
age: 18
}
var res = Object.assign({},defaultObj , obj);
     console.log(res);  //{name: "a", age: 28, gender: "male"}
console.log(obj); //{name: "a", age: 28, gender: "male"}
console.log(defaultObj); //{name: "佚名", age: 18}

es6中的Object.assign的更多相关文章

  1. js中的Object.assign接受两个函数为参数的时候会发生什么?

    缘由 今天看到一段代码 return Object.assign(func1, func2); 心生疑惑,为什么 Object.assign 的参数可以是函数? 于是有了下面这一堆东西,其实都是老生常 ...

  2. 在ES5实现ES6中的Object.is方法

    ES6中对象的扩展里面添加了一个Object.is方法,用于比较两个值是否严格相等.内部计算与 === 行为基本一致.那么我们怎么在不支持这个方法的ES5中实现呢? 首先我们需要搞清楚两点,1:Obj ...

  3. es6新语法Object.assign()

    1.介绍 Object.assign用于对象的合并,将源对象的所有可枚举属性复制到目标对象,只拷贝源对象自身的属性继承属性补考呗 Object.assign(target,source1,...)第一 ...

  4. ES6之Object.assign()详解

    译者按: 这篇博客将介绍ES6新增的Object.assign()方法. 原文: ECMAScript 6: merging objects via Object.assign() 译者: Funde ...

  5. ES6学习--Object.assign()

    ES6提供了Object.assign(),用于合并/复制对象的属性. Object.assign(target, source_1, ..., source_n) 1. 初始化对象属性 构造器正是为 ...

  6. es6 javascript对象方法Object.assign()

    es6 javascript对象方法Object.assign() 2016年12月01日 16:42:34 阅读数:38583 1  基本用法 Object.assign方法用于对象的合并,将源对象 ...

  7. ES6深入浅出-11 ES6新增的API(上)-1.Object.assign

    这些都是es6才有的 Object.assign 在a加上三个属性 分别是p1\p2\p3 以前是这么去加 b的三个属性p1.p2.p3就全部复制到a这个对象上了. 把后面的东西放到前面的东西上 两个 ...

  8. 【ES6学习笔记之】Object.assign()

    基本用法 Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target). const target = { a: 1 }; const sou ...

  9. ES6的Object.assign()基本用法

    Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target). 例如: const target = {a:1}, const source1 ...

随机推荐

  1. vue 静态资源文件夹src下的assets 和static的区别

    static下的静态资源在项目打包的时候,直接在dist文件夹下直接把static文件夹打包进去src下的assets,在打包时,vue是按照模块来引入里面的静态资源,一般使用这种方式

  2. iOS-打印控件

    20.UIPrintFormatterUIPrintFormatter时打印格式化的抽象基类:展示了传统的可打印的内容对象可以跨页边界.由于打印格式化,打印系统,可以自动打印与打印格式化的内容相关联的 ...

  3. Python之可变参数,*参数,**参数,以及传入*参数,进行解包

    1.定义了一个需要两个参数的函数 def print_str(first, second): print first print second if __name__ == "__main_ ...

  4. 老司机带大家领略MySQL中的乐观锁和悲观锁

    原文地址:https://cloud.tencent.com/developer/news/227982 为什么需要锁 在并发环境下,如果多个客户端访问同一条数据,此时就会产生数据不一致的问题,如何解 ...

  5. Ansible安装配置及命令使用详解

    Ansible和saltstack目前市面上一些其它的项目管理工具有很大的不同,它的设计初衷就是为了更方便.快捷的进行配置管理.它易于安装和使用.语法也非常简单易学.你可以用Ansible将平常复杂的 ...

  6. ubuntu gcc 安装 使用

    "人多不足以依赖,要生存只有靠自己." -- 拿破仑 gcc是什么:-------------------------- Linux系统下的Gcc(GNU C Compiler)是 ...

  7. 使用Lombok总结

    Lombok学习总结 Project Lombok is a java library that automatically plugs into your editor and build tool ...

  8. Tomcat报错:No result type specified for result named 'success'

    今天学Struts, tomcat报出了异常信息 Exception starting filter [struts2] Unable to load configuration.还有 No resu ...

  9. 剑指offer11:输入一个整数,输出该数二进制表示中1的个数。其中负数用补码表示。(进制转换,补码反码)

    1. 题目描述 输入一个整数,输出该数二进制表示中1的个数.其中负数用补码表示. 2. 思路和方法 使用移位(<<)和 “| & !”操作来实现.1的二进制是:前面都是0,最后一位 ...

  10. thinkphp5.0数据导出excel表格

    第一步.创建Model类文件(名称自定) 第二步.在类中写入以下代码 <?php namespace Admin\admin\model; use think\Model; class Mark ...