ES6(2015)Function函数

Posted 2021-09-23 优小U

文章目录

• 1. 默认参数
• 2. Rest 参数
• 3. 扩展运算符
• 4. length属性
• 5. name属性
• 6. 箭头函数

1. 默认参数

ES5 的时候大家都会这么写：

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

ES6中可以把默认参数写在参数列表：

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

函数参数是从左到右解析，如果没有默认值会被解析成 undefined

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

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

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

2. Rest 参数

function sum(...nums) {
    let num = 0
    nums.forEach(function(item) {
        num += item * 1
    })
    return num
}

console.log(sum(1, 2, 3)) // 6
console.log(sum(1, 2, 3, 4)) // 10

当然，Rest Parameter 也可以和其他参数一起来用，比如：

function sum(base, ...nums) {
    let num = base
    nums.forEach(function(item) {
        num += item * 1
    })
    return num
}

console.log(sum(30, 1, 2, 3)) // 36
console.log(sum(30, 1, 2, 3, 4)) // 40

Rest 参数只能有一个，且必须在参数列表的最后面。

3. 扩展运算符

Spread Operator 和 Rest Parameter 是形似但相反意义的操作符，简单的来说 Rest Parameter 是把不定的参数“收敛”到数组，而 Spread Operator 是把固定的数组内容“打散”到对应的参数。示例如下：

function sum(x = 1, y = 2, z = 3) {
    return x + y + z
}

console.log(sum(...[4])) // 9
console.log(sum(...[4, 5])) // 12
console.log(sum(...[4, 5, 6])) // 15

4. length属性

函数指定了默认值以后，函数的length属性，将返回没有指定默认值的参数个数。

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

5. name属性

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

function foo() {}

foo.name // "foo"

6. 箭头函数

// 定义函数
function hello() {
    console.log('say hello')
}
// 或
let hello = function() {
    console.log('say hello')
}

// 使用箭头函数
let hello = () => {
    console.log('say hello')
}

带参数箭头函数：

let hello = (name) => {
    console.log('say hello', name)
}
// 或者

let hello = name => {
    console.log('say hello', name)
}

如果只有一个参数，可以省略括号，如果大于一个参数一定要记得带括号。

如果返回值是表达式可以省略 return 和{}：

let pow = x => x * x

如果返回值是字面量对象，一定要用小括号包起来：

let person = (name) => ({
	age: 20,
	addr: 'Beijing City'
})

1、箭头函数中this指向定义时所在的对象，而不是调用时所在的对象
2、箭头函数不可以当作构造函数
3、箭头函数不可以使用arguments对象