【ES6基础】默认参数值

若是调用函数的过程当中，定义的参数缺失，此参数变量的值则会是undefined。怎么给缺失的参数赋值默认值，在ES6以前，没有简洁的语法设置缺失参数的默认值，可是咱们通常能够这么编写代码解决缺失参数默认值：

function myFunction(x, y, z) {
 x = x === undefined ? 1 : x;
 y = y === undefined ? 2 : y;
 z = z === undefined ? 3 : z;
 console.log(x, y, z); //Output "6 7 3"
 }
 myFunction(6, 7);复制代码

这种写法是否是比较麻烦？默认值的设置是否是不够直观？

在ES6中，咱们能够用更简洁的语法进行实现，经过本篇文章你将学习到如下内容：

• 使用ES6语法声明参数默认值
• 使用undefined传参
• 参数运算

本篇文章阅读时间大约5分钟

使用ES6语法声明参数默认值

咱们能够使用ES6简洁的语法，以下示例进行声明函数参数的默认值：

function myFunction(x = 1, y = 2, z = 3) {
 console.log(x, y, z); 
}
myFunction(6,7); // Outputs 6 7 3复制代码

在上述代码示例中，咱们在调用此函数中传递了前两个参数，所以参数的默认值(即x=1和y=2)将会被覆盖(即x=6和y=7)。因为第三个参数缺省，所以z使用默认值，将会是3。

使用undefined传参

若是咱们想让具体某个参数使用默认值，咱们能够使用undefined进行赋值，以下段代码所示：

function myFunction(x = 1, y = 2, z = 3) {
   console.log(x, y, z); // Outputs "1 7 9"
 }
 myFunction(undefined,7,9);复制代码

是否是很简单，只须要使用undefined，咱们就能够指定具体某个参数使用默认值。

参数运算

在ES6中咱们不只能够给参数默认赋值具体的数值，同时参数赋值支持参数的逻辑运算进行赋值，以下段代码所示：

function myFunction(x = 1, y = 2, z = x + y) {
   console.log(x, y, z); // Output "6 7 13"
 }
 myFunction(6,7);复制代码

在上述代码中，咱们只传入了前两个参数，第三个参数缺省，第三个参数的值默认值是则会是前两个参数之和。

小节

今天的内容就到这里，当咱们在开发一些工程应用通用组件时，都须要暴露一些接口以供使用。而这些接口的友好性是决定这个组件质量的一大指标，其中参数缺省值（默认值）的完善程度同时也影响接口的友好性，感谢ES6能让咱们用如此简介的语法设置参数的缺省值。

E6相关文章

【ES6基础】let和做用域

【ES6基础】const介绍

更多精彩内容，请微信关注”前端达人”公众号！