ES6—Function新特性

默认参数

ES5中，函数的参数都是写在函数体里的

function foo(x,y){
    y=y||'world'
    console.log(x,y)
}
foo('hello','jim')//hello jim
foo('hello',0)//hello world

但是当函数多个参数都涉及到初始化时，这样写显然不太优雅，ES6就提供了一种写法：

function foo(x,y='world'){
    console.log(x,y)
}
foo('hello',0)//hello world

函数参数是从左到右解析，如果只想给某个参数使用默认值，可以用undefined进行赋值：

function f(x, y = 7, z = 42) {
    return x + y + z
}
console.log(f(1, undefined, 43)) // 51

在ES6中我们不仅可以给参数默认赋值具体的数值，同时参数赋值支持参数的逻辑运算进行赋值：

function f(x, y = 7, z = x + y) {
    return z * 0.5
}

console.log(f(1, 7)) // 4

还可以与解构赋值（解构赋值就是从数组和对象提取值，对变量进行赋值）结合起来使用：

function foo({x,y=5}){
    console.log(x,y)
}
foo({})//undefined 5
foo({
    x:1,
    y:2
})//1 2
foo()//报错

function ajax(url,{
    body='',
    method='get',
    headers={}
}={}){
    console.log(method)
}
ajax('http://www.baidu.com')//get
ajax('http://www.baidu.com',{})//get
ajax('http://www.baidu.com',{method:'post'})//post

函数作用域

let x=1
function foo(x,y=x){//先在作用域内找 找到x=2
    console.log(y)//2
}
foo(2)

let x=1
function foo(y=x){//使用x时,下面的let x=2还没有被声明 沿作用域链往上找到全局的let x=1
    let x=2
    console.log(y)//1
}
foo()

length属性

ES5中获取函数参数的个数可以使用arguments：

function foo(a, b = 1, c) {
    console.log(arguments.length)
}
foo('a', 'b') //2

然而在 ES6 中不能再使用 arguments 来判断了，但可以借助 Function.length 来判断：

function foo(a, b = 1, c) {
    console.log(foo.length)
}
foo('a', 'b') // 1

细心的同学会发现，打印结果跟arguments.length的结果不一致，是的，Function.length统计的是第一个默认参数之前的参数个数，所以建议将有默认值的形参写到最后：

function foo(x,y,z=5){
    console.log(x,z,y)
}
foo(1,2)//1 5 2

name属性

函数的name属性，返回该函数的函数名：

function foo(){}
console.log(foo.name)//foo

另外，ES6的函数新特性还包括了扩展运算符、Rest参数和箭头函数，写在另一篇博客中。