[ES6] Object.assign (with defaults value object)
function spinner(target, options = {}){
let defaults = {
message: "Please wait",
spinningSpeed: 5,
cssClass: ".is-spinning"
};
let settings = Object.assign(
{},
defaults,
options
);
if(settings.spinningSpeed !== defaults.spinningSpeed){
settings.cssClass = _addSpeedClass(target);
}
_renderSpinner(target, settings);
}
- Best pratices to write defaults as an objects, much clean and reuseable.
- Write an empty object {} to the object.assign is recommened, it avoid defaults been mutated.
- in if block, you see we might still use default value, so it is important to keep the origin defautls value.
Example2:
function spinner(target, options = {}) {
let defaults = {
message: "Please wait",
spinningSpeed: 5,
cssClass: ".is-spinning"
};
let settings = Object.assign({} , defaults , options);
console.log(`Message: ${settings.message}`);
console.log(`spinningSpeed: ${settings.spinningSpeed}`);
console.log(`cssClass: ${settings.cssClass}`);
}
spinner(targetElement, {
cssClass: ".is-fast-spinning",
spinningSpeed: 8
});
[ES6] Object.assign (with defaults value object)的更多相关文章
- es6 Object.assign
ES6 Object.assign 一.基本用法 Object.assign方法用来将源对象(source)的所有可枚举属性,复制到目标对象(target).它至少需要两个对象作为参数,第一个参数是目 ...
- es6 javascript对象方法Object.assign()
es6 javascript对象方法Object.assign() 2016年12月01日 16:42:34 阅读数:38583 1 基本用法 Object.assign方法用于对象的合并,将源对象 ...
- es6 Object.assign ECMAScript 6 笔记(六) ECMAScript 6 笔记(一) react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式
es6 Object.assign 目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...
- ES6中Object.assign() 方法
ES6中Object.assign() 方法 1. 对象合并Object.assign 方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象上.如下代码演示: var targ ...
- 【ES6学习笔记之】Object.assign()
基本用法 Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target). const target = { a: 1 }; const sou ...
- ES6的Object.assign()基本用法
Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target). 例如: const target = {a:1}, const source1 ...
- [转]javascript之Object.assign()痛点
本文转自:http://blog.csdn.net/waiterwaiter/article/details/50267787 最近也一直会用javascript,然后中间使用的一些组件,如Echar ...
- [Javascript] Object.assign()
Best Pratices for Object.assign: http://www.cnblogs.com/Answer1215/p/5096746.html Object.assign() ca ...
- javascript系列--Object.assign实现浅拷贝的原理以及实现
一.前言 之前在前面一篇学习了赋值,浅拷贝和深拷贝.介绍了这三者的相关知识和区别. 传送门:https://www.mwcxs.top/page/592.html 本文会介绍浅拷贝Object.ass ...
随机推荐
- ASP.NET性能优化小结
一.返回多个数据集 检查你的访问数据库的代码,看是否存在着要返回多次的请求.每次往返降低了你的应用程序的每秒能够响应请求的次数.通过在单个数据库请求中返回多个结果集,可以减少与数据库通信的时间,使你的 ...
- 使用<pre>标签为你的网页加入大段代码
在上节中介绍加入一行代码的标签为<code>,但是在大多数情况下是需要加入大段代码的,如下图: 怎么办?不会是每一代码都加入一个<code>标签吧,没有这么复杂,这时候就可以使 ...
- web开发 关于src跳转
src跳转看传递的参数值,如果参数值一样就不会再次跳转,也不会向后台的服务器提供request. 想要随时都能跳转可以传递不同的参数,如 onClick="this.src='http:// ...
- centos U盘安装
1.版本 LiveCD 和 LiveDVD 是可以直接进入运行系统,类似win PE, 进入系统后有一个图标 install - HHD(从硬盘安装). netinstall 是用于网络安装和系统救援 ...
- Java笔试知识总结(第一回)
- Python 3中bytes和str的分别
最近把一段py2的代码转换到py3的代码,结果运行到向socket中写数据的代码部分出现了'str' does not support the buffer interface这样一个错误. 一番搜索 ...
- HTML5拖放
HTML5拖放 <!doctype html> <html> <head> <meta charset="UTF-8"> <t ...
- [HTML5 Canvas学习] 基础知识
HTML5 canvas元素通过脚本语言(通常是Javascript) 绘制图形, 它仅仅是一个绘图环境,需要通过getContext('2d')方法获得绘图环境对象,使用绘图环境对象在canvas元 ...
- Thinkphp 零散知识点(caa/js路径,引入第三方类,ajax返回,session/cookie)
一.关于JS和CSS路径问题 1.找路径是从入口文件index.php来找的,而不是从文件本身所在位置来找, 因为我们访问时是访问的入口文件 2.在存放JS和CSS的时候可以放到public文件夹下 ...
- exit() die return 的区别
rutrun 会返回一个值,或不返回值 只是当前函数内return后面的语句将不会执行,后面的其它语句继续执行exit()可以返回值,也可以不返回值直接终止程序 函数输出一条消息,并退出当前脚本. 会 ...