Javascript的箭头函数

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions

• 语法形式：

() => expression

param => expression

(param) => expression

(param1, paramN) => expression

() => {
  statements
}

param => {
  statements
}

(param1, paramN) => {
  statements
}

• 箭头函数可以是 async 的，方法是在表达式前加上 async 关键字。

async param => expression
async (param1, param2, ...paramN) => {
  statements
}

• 箭头函数既可以使用表达式体（expression body），也可以使用通常的块体（block body）。
• 在表达式体中，只需指定一个表达式，它将成为隐式返回值。在块体中，必须使用显式的 return 语句。
• 只有当函数直接返回表达式时，才可以省略大括号。如果函数体有额外的处理，则大括号是必需的，return 关键字也是必需的。箭头函数无法猜测函数体返回什么或何时返回。
• 箭头函数总是未命名的。如果箭头函数需要调用自身，请使用具名函数表达式。也可以将箭头函数赋值给一个变量，这样它就有了名字。
• 用表达式体语法 (params) => { object: literal } 返回对象字面量时，不能按预期工作。要解决这个问题，可以用括号将对象字面量包装起来： (params) => ({ object: literal }) 。

示例：在参数周围加上小括号

const numbers = [1, 2, 3]

console.log(numbers.map((number) => number + 10))

输出：

示例：如果无参数，需在参数列表周围加上小括号

// 这是一个立即执行函数表达式
const a = (() => 'good')()
console.log(a)

输出：

示例：

// 这是一个立即执行函数表达式，值是undefined
const a = (() => { })()
console.log(a)

输出：

示例：

const func = (a) => (a + 10)

console.log(func(2))

输出：

示例：如果函数只有一个参数，参数列表周围的小括号可以省略

const func = a => (a + 10)

console.log(func(2))

输出：

示例：

const func = a => a + 10

console.log(func(2))

输出：

示例：

// 箭头函数的右边使用大括号，没有return语句，结果是undefined
const func = a => { a + 10 }

console.log(func(2))

输出:

示例：

// 箭头函数的右边使用大括号，有return语句
const func = a => { return a + 10 }

console.log(func(2))

输出：

示例：

// 箭头函数的右边使用大括号，有return语句
const func = (a) => { return a + 10 }

console.log(func(2))

输出：

示例：如果有多个参数，参数列表周围的小括号不能省略

// 箭头函数的右边使用大括号，有return语句
const func = (a, b) => { return a + b }

console.log(func(2, 3))

输出：

示例：只有当函数直接返回表达式时，才可以省略大括号。如果函数体有额外的处理，则大括号是必需的，return 关键字也是必需的

const func = (a) => {
    if (a < 10) {
        return a
    }
    return a + 10
}

console.log(func(2))

console.log(func(10))

输出：

示例：用表达式体语法 (params) => { object: literal } 返回对象字面量时，不能按预期工作。要解决这个问题，可以用括号将对象字面量包装起来： (params) => ({ object: literal }) 。

// 不能按预期工作
const func1 = () => { name: 'tom' }
console.log(func1())

// 按预期工作
const func2 = () => ({ name: 'li' })
console.log(func2())

输出：