学习ES6-默认参数的例子 | ecmascript5在这篇文章中，我们将通过实例来学习es6的特点--函数的默认参数教

在这篇文章中，我们将通过实例来学习es6的特点--函数的默认参数教程。

在Es6 Java版本之前，以下是处理默认参数值的方法。

ES5默认参数和以前的javascript版本

声明了一个convertEmployObjectToJsonString函数，将Employ的参数转换为JSON字符串，有两个参数--姓名和工资

名称是一个必要参数

薪资是可选参数

salary参数是一个可选参数。当salary参数没有被传递时，默认值被分配为5000。

function convertEmployObjectToJsonString(name,salary){
    salary = (typeof salary !== 'undefined') ? salary : 5000;
    return JSON.stringify({'name':name,'salary':salary});
}
console.log(convertEmployObjectToJsonString('Frank', 6000));
console.log(convertEmployObjectToJsonString('Ram'));
console.log(convertEmployObjectToJsonString());
console.log(convertEmployObjectToJsonString(null,null));

输出是

{"name":"Frank","salary":6000}
{"name":"Ram","salary":5000}
{"salary":5000}

当调用convertEmployObjectToJsonString时，没有传递salary参数意味着未定义，默认值是5000。我们为未定义的情况增加了对工资参数的检查，如果未定义，则初始化默认值。

ECMAScript 2016 默认参数

默认参数是对函数参数的语法修改，Es6是一个新的javascript版本，当函数参数未定义或未通过时，默认参数在函数参数中被初始化为默认值。语法：


function [name]([param1[ = defaultValue1 ][, ..., paramN[ = defaultValueN ]]]) {
   statements
}

使用Es6默认参数重写上述相同的例子

function convertEmployObjectToJsonString(name,salary=5000){
    return JSON.stringify({'name':name,'salary':salary});
}
console.log(convertEmployObjectToJsonString('Frank', 6000));
console.log(convertEmployObjectToJsonString('Ram',''));
console.log(convertEmployObjectToJsonString());
console.log(convertEmployObjectToJsonString(null,null));
console.log(convertEmployObjectToJsonString('asdfads',null));
console.log(convertEmployObjectToJsonString('Ram','undefined'));

输出为

{"name":"Frank","salary":6000}
{"name":"Ram","salary":""}
{"salary":5000}
{"name":null,"salary":null}
{"name":"asdfads","salary":null}
{"name":"Ram","salary":"undefined"}

需要记住的要点

在javascript中，函数的参数默认为未定义，这允许改变不同的值。当有效值作为参数被传递时，默认参数没有初始化任何值，空和空被认为是有效值，未定义，值没有被传递，函数的参数没有被传递，未定义值被认为，默认值被初始化为默认值默认参数在调用时被评估。

请将上述结果与此点对应起来，以便有一个好的理解。

函数作为默认参数的例子

这里Function next被声明在getValues函数的主体中。执行的顺序如下。

默认参数总是先运行。在函数主体中声明的嵌套函数接下来被执行。当getValues()方法被调用并带有一个函数参数时，函数声明是不可用的，所以下面的代码会抛出一个错误 - Uncaught ReferenceError: next is not defined 所以我们的收获是，在其他函数体内声明的函数不能作为默认参数传递。

function getValues(value = next()) {
  function next() { return 'next function method'; }
}

修复/解决ReferenceError的方法是将内部函数移到全局或外部范围。

function next() { return 'next function method'; }

function getValues(value = next()) {
}

缺省参数解构赋值示例

默认参数也可以与破坏性赋值一起使用。破坏性赋值是ES6中引入的一种新的语法，表达式可以从数组和对象中获取数值并赋值给变量。

破坏性赋值示例

var value1, value2;
[value1, value2] = [30, 50]; // outputs value1=30 and value2=50
[value1=4, value2=value1] = [];     // value1=4;value2=4
[value1=5, value2=value1] = [6];    // value1=6; value2=6
[value1=3, value2=value1] = [3,5]; // value1=3; value2=5

这里是一个销毁赋值的例子，作为函数声明中的默认参数

function func([a, b] = [5, 6], {c: c} = {c: 2}) {
  return a + b + c;
}
console.log(func()); // outputs 13

破坏性对象赋值示例

默认参数也可以用Object destructuring赋值来声明。下面是一个使用Object销毁的例子

function funcObject ({
    name = 'Frank',
    salary = 5000
  } = {}) {

  return (`${name}, ${salary}`);
}
console.log(funcObject({
  name: 'kiran'
}));
console.log(funcObject({}));

上述代码的输出

kiran, 5000
Frank, 5000

学习ES6-默认参数的例子 | ecmascript5