详解ES6 中的Object.assign()的用法实例代码


Posted in Javascript onJanuary 11, 2021

方法Object.assign()
作用:将sourse对象的 赋值给目标对象,两者都有的会覆盖,target独有会保留,sourse独有会添加
使用方法

Object.assign方法实行的是浅拷贝,而不是深拷贝。也就是说,如果源对象某个属性的值是对象,那么目标对象拷贝得到的是这个对象的引用。

var object1 = { a: { b: 1 } };

ar object2 = Object.assign({}, object1);

object1.a.b = 2;

console.log(object2.a.b);

2.用途

2.1为对象添加属性

 2.2为对象添加方法

2.3克隆对象

function copyFnc(origin) {

return Object.assign({}, origin)}

var sur = { a: 1, b: 2 };

console.log(copyFnc(sur));

上面代码将原始对象拷贝到一个空对象,就得到了原始对象的克隆。

不过,采用这种方法克隆,只能克隆原始对象自身的值,不能克隆它继承的值。如果想要保持继承链,可以采用下面的代码。

function clone(origin) {

let originProto = Object.getPrototypeOf(origin);

return Object.assign(Object.create(originProto), origin);

}

在JS里子类利用Object.getPrototypeOf去调用父类方法,用来获取对象的原型。

2.4 合并多个对象

//多个对象合并到某个对象

const merge = (target, ...sources) => Object.assign(target, ...sources);

//多个对象合并到新对象

const merge = (...sources) => Object.assign({}, ...sources);

2.5为属性指定默认值

const DEFAULTS = {
logLevel: 0,
outputFormat: 'html'};
function processContent(options) {let options = Object.assign({}, DEFAULTS, options);
}

到此这篇关于详解ES6 Object.assign()的用法及用途的文章就介绍到这了,更多相关ES6 Object.assign()的用法内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
使用jscript实现二进制读写脚本代码
Jun 09 Javascript
WEB高性能开发之疯狂的HTML压缩
Jun 19 Javascript
浅析js预加载/延迟加载
Sep 25 Javascript
jQuery背景插件backstretch使用指南
Apr 21 Javascript
基于JS实现省市联动效果代码分享
Jun 06 Javascript
jQuery实现右键菜单、遮罩等效果代码
Sep 27 Javascript
原生javascript实现读写CSS样式的方法详解
Feb 20 Javascript
Javarscript中模块(module)、加载(load)与捆绑(bundle)详解
May 28 Javascript
基于js 字符串indexof与search方法的区别(详解)
Dec 04 Javascript
在ES5与ES6环境下处理函数默认参数的实现方法
May 13 Javascript
LayUi数据表格自定义赋值方式
Oct 26 Javascript
从Node.js事件触发器到Vue自定义事件的深入讲解
Jun 26 Javascript
vue实现防抖的实例代码
Jan 11 #Vue.js
详解uniapp的全局变量实现方式
Jan 11 #Javascript
微信小程序抽奖组件的使用步骤
Jan 11 #Javascript
JS数组索引检测中的数据类型问题详解
Jan 11 #Javascript
了不起的11个JavaScript代码重构最佳实践小结
Jan 11 #Javascript
js删除对象中的某一个字段的方法实现
Jan 11 #Javascript
jQuery实现购物车全功能
Jan 11 #jQuery
You might like
使用php实现快钱支付功能(涉及到接口)
2013/07/01 PHP
浅析ThinkPHP的模板输出功能
2014/07/01 PHP
PHP图片库imagemagick安装方法
2014/09/23 PHP
thinkphp文件处理类Dir.class.php的用法分析
2014/12/08 PHP
php使用MySQL保存session会话的方法
2015/06/18 PHP
用PHP代码给图片加水印
2015/07/01 PHP
必须收藏的php实用代码片段
2016/02/02 PHP
CodeIgniter框架实现的整合Smarty引擎DEMO示例
2019/03/28 PHP
对google个性主页的拖拽效果的js的完整注释[转]
2007/04/10 Javascript
jquery获得下拉框值的代码
2011/08/13 Javascript
IE关闭时判断及AJAX注销案例学习
2013/02/18 Javascript
jQuery实现有动画淡出效果的二级折叠菜单代码
2015/10/17 Javascript
js 上传文件预览的简单实例
2016/08/16 Javascript
Jquery组件easyUi实现选项卡切换示例
2016/08/23 Javascript
详解vuex 中的 state 在组件中如何监听
2017/05/23 Javascript
详解如何探测小程序返回到webview页面
2019/05/14 Javascript
[01:02:25]2014 DOTA2华西杯精英邀请赛 5 24 iG VS DK
2014/05/26 DOTA
用Python代码来绘制彭罗斯点阵的教程
2015/04/03 Python
Python中使用Queue和Condition进行线程同步的方法
2016/01/19 Python
python在回调函数中获取返回值的方法
2019/02/22 Python
python mac下安装虚拟环境的图文教程
2019/04/12 Python
Python Image模块基本图像处理操作小结
2019/04/13 Python
Python应用领域和就业形势分析总结
2019/05/14 Python
python设计微型小说网站(基于Django+Bootstrap框架)
2019/07/08 Python
使用python-pptx包批量修改ppt格式的实现
2020/02/14 Python
keras 多gpu并行运行案例
2020/06/10 Python
记一次Django响应超慢的解决过程
2020/09/17 Python
中国旅游网站:同程旅游
2016/09/11 全球购物
毕业生自我推荐
2013/11/04 职场文书
木工主管岗位职责
2013/12/08 职场文书
开学典礼策划方案
2014/05/28 职场文书
2014年党课学习心得体会
2014/07/08 职场文书
助学感谢信范文
2015/01/21 职场文书
安全员岗位职责
2015/02/10 职场文书
2015小学语文教师个人工作总结
2015/05/20 职场文书
【2·13】一图读懂中国无线电发展
2022/02/18 无线电