Detailed explanation of new features of ES advanced function syntax

函数参数的默认值

ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面.

    // 函数默认参数值
    function fun1(name, sex = "男") {
    
        return [name, sex]
    }
    console.log(fun1("Alice"))

通常情况下,定义了默认值的参数,应该是函数的尾参数.因为这样比较容易看出来,到底省略了哪些参数.如果非尾部的参数设置默认值,实际上这个参数是没法省略的.

函数的 length 属性

指定了默认值以后,函数的length属性,将返回没有指定默认值的参数个数.这个表示默认参数不作为length的计算范围.

    // 函数的length属性
    function fun2(a, b, c = 0) {
    
    }

    function fun3(c = 0) {
    
    }

    console.log(fun2.length)  // 2
    console.log(fun3.length)  // 0

rest 参数

ES6 引入 rest 参数（形式为…变量名）,用于获取函数的多余参数,这样就不需要使用arguments对象了.rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中.

    // REST参数
    function func4(...args) {
    
        for (let arg of args) {
    
            console.log(arg)
        }
    }

    func4("参数1", "参数2", "参数3")

name 属性

函数的name属性,返回该函数的函数名.

function foo() {
    }
foo.name // "foo"

箭头函数

ES6 允许使用“箭头”（=>）定义函数.作为一个熟悉JAVA的开发者来说,其使用和JAVA8的Lambda还是非常相似的,也更容易上手.

    // 箭头函数
    let fun = v => v + " world!"
    console.log(fun("hello"))

    //等价于
    function fun5(v) {
    
        return v + " world!"
}

如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分.如果箭头函数的代码块部分多于一条语句,就要使用大括号将它们括起来,并且使用return语句返回.如果箭头函数直接返回一个对象,必须在对象外面加上括号.

    // 无参数
    let fun6 = () => 1 + 1
    console.log("fun6===" + fun6())
    // 多个参数
    let fun7 = (a, b) => a + b
    console.log("fun7===" + fun7(1, 2))
    // 方法体多行
    let fun8 = (a, b) => {
    
        a++
        b++
        return a + b
    }
    console.log("fun8===" + fun8(1, 2))
    // 返回值是对象
    let fun9 = (a, b) => {
    
        a++
        b++
        return {
    
            c: a + b,
            d: a - b
        }
    }
    console.log("fun9===" + fun9(1, 2).c)
    let fun10 = (a, b) => ({
    c: a + b, d: a - b})
    console.log("fun10===" + fun10(1, 2).c)

箭头函数的this分析

箭头函数没有自己的this对象.对于普通函数来说,内部的this指向函数运行时所在的对象,但是这一点对箭头函数不成立.它没有自己的this对象,内部的this就是定义时上层作用域中的this.也就是说,箭头函数内部的this指向是固定的,相比之下,普通函数的this指向是可变的.

Function.prototype.toString()

之前执行方法的toString()方法返回函数代码本身,但是会省略注释和空格.ES2019 对函数实例的toString()方法做出了修改,修改后的toString()方法,明确要求返回一模一样的原始代码.

    /**
     * 测试
     */
    function   /*** 测试*/   fun11() {
    
        return "1"
    }
    console.log(fun11.toString())

这个也会返回方法内部的内容,但是这个注释的返回并不友好,一般很少会把注释写在这个位置.

catch 命令的参数省略

JavaScript 语言的try…catch结构,以前明确要求catch命令后面必须跟参数,接受try代码块抛出的错误对象.

try {
    
  // ...
} catch (err) {
    
  // 处理错误
}

ES2019 做出了改变,允许catch语句省略参数.

try {
    
  // ...
} catch {
    
  // ...
}