es6 - 函数的扩展

es6 - 函数的扩展

上一篇，我们介绍了es6箭头函数的内容 - es6 - 箭头函数。

事实上，箭头函数只是函数扩展中最有意思的那部分，除此以外，es6函数还增加了一些其他的特性，下面将对它们进行一一介绍。

语法

es6函数参数的默认值

在es6之前，我们如果想要设置函数参数的默认值，需要这样写代码：

function makeRequest(url, timeout, callback){
    timeout = timeout || 2000;
    callback = callback || function(){};
    //...
}

或者更加严谨的写法:

timeout = (typeof timeout !== 'undefined') ? timeout : 2000;
callback = (typeof callback !== 'undefined') ? callback : function(){};

es6增加了函数参数默认值的特性，可以直接在参数里设置

function makeRequest(url, timeout = 2000, callback = function(){}){
    //...
}

注意：只有在没有传入相应的参数或是传入undefined时，才会使用参数的默认值。

es6剩余参数

剩余参数由三个点...和一个具名参数指定，比如

function pick(object, ...keys){
    console.log(keys);
}

在这个函数内部，剩余参数keys是由传入的第二个参数及以后的参数组成的数组。如果只传入0个或者1个参数，keys为空数组。

扩展运算符...

扩展运算符有点像是剩余参数的反作用。 我们使用一个场景来说明扩展运算符...该怎么使用：

function getMax(num1, num2){
    let result = arguments[0];
    for(var i=0; i<arguments.length; i++){
        if(arguments[i] > result){
            result = arguments[i];
        }
    }
    return result;
}

上面这个函数大概实现了返回参数中最大值的功能。我们可以这样调用它，getMax(num1, num2, num3, ...)。

可是如果我现在想把一个很大的数组 arr 作为参数传入函数中呢？

或许可以使用apply方法：getMax.apply(null, arr);

可是这样实现总感觉不大对劲，使用...能够使得代码意图更加清晰： getMax(...arr)。

...运算符能够将arr分割为单独的参数传入函数，它甚至还可以和其他参数一起使用：
比如： getMax(num1, ...arr, num2)。代码这样看起来好多了。

函数的名称属性

es6给所有的函数都添加了name属性，用来根据名称识别函数。匿名函数的name属性的值为空字符串。在实践中，该属性使用很少，不再赘述。

尾调用优化

记得在js语言精粹中介绍递归部分时，作者说，js没有尾调用优化，所以递归可能因为堆栈溢出而运行失败。
在es6中，js提供了尾调用优化，什么是尾调用优化？可以参考下面代码：

function doSomething(){
    return doSomethingElse();
}

上面的doSomethingElse函数的调用语句是doSomething的最后一条语句，并作为doSomething返回值返回。上面的函数就实现了尾调用优化。

尾调用优化能够提高函数的性能。它最适合的使用场景是在递归中使用。

在平时的开发中，除非使用递归或者是尽力优化函数的性能，否则无需考虑太多尾递归优化。

注意事项

• 使用剩余参数时，剩余参数在函数中最多只能有一个，并且要作为最后一个参数。
• 除了上面列举的外，es6函数还引入了new.target元属性。用来判断函数的调用方式，是作为普通函数调用，还是使用new作为构造函数调用。

最佳实践

es6新引入的默认参数和剩余参数特性都非常好用。推荐使用默认参数代替原来arg1 = arg1 || 默认值 的书写方式， 使用剩余参数代替arguments的能力来操作参数。