ES6小技巧 - 使用解构赋值设置函数参数默认值
栏目: JavaScript · 发布时间: 6年前
内容简介：本文要说的并不是下面这种ES6的函数参数默认值：很多时候，我们在写一个构造函数时，可能需要传入很多参数，这时候就不可能使用函数参数一个一个的传入，而是传入一个对象当作参数。举个例子：一个函数，参数传入一个对象，对象里可以设置两个属性(a, b)，a默认值为1，b默认值为2。
本文要说的并不是下面这种ES6的函数参数默认值：
function fn(a = 0, b = 1) {}
复制代码
很多时候，我们在写一个构造函数时，可能需要传入很多参数，这时候就不可能使用函数参数一个一个的传入，而是传入一个对象当作参数。
举个例子：一个函数，参数传入一个对象，对象里可以设置两个属性(a, b)，a默认值为1，b默认值为2。
ES5
以前我们是这么设置函数参数默认值的：
function es5Fn (options) {
options = options === undefined ? {} : options;
var a = options.a === undefined ? 1 : options.a;
var b = options.b === undefined ? 2 : options.b;
console.log(a, b);
}
复制代码
- 首先判断函数是否传入了一个对象，如果没有创建一个空对象。
- 然后判断这个对象中是否含有a、b属性，没有将会设置为默认值。
ES6
function es6Fn ({a = 1, b = 2} = {}) {
console.log(a, b);
}
复制代码
使用ES6解构赋值的方式设置默认值是不是简单了很多？
终于水完了这篇文章，如果有在开发H5（活动专题）页面的小伙伴看下我的脚手架～
X-BUILD是针对 H5 开发的一套自动化构建工具，致力于提升开发效率，减小开发难度。它可以让你在没有任何构建工具（例如 grunt 、 gulp 或 webpack 等工具）配置经验的情况下，帮你快速生成一个完整的前端工程，并可以打包代码和静态资源，使你的项目以最优异的性能上线。>>使用文档<<
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持 码农网
猜你喜欢:
本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。
JavaScript凌厉开发
张鑫 黄灯桥、杨彦强 / 清华大学出版社 / 2010 年4月 / 49.00元
本书详细介绍Ext JS框架体系结构，以及利用HTML/CSS/JavaScript进行前端设计的方法和技巧。作者为Ext中文站站长领衔的三个国内Ext JS先锋，在开发思维和开发经验上有着无可争议的功力。 本书包含的内容有Ext.Element.*、事件Observable、Ext组件+MVC原理、Grid/Form/Tree/ComboBox、Ajax缓存Store等，并照顾JavaSc......一起来看看 《JavaScript凌厉开发》 这本书的介绍吧!
