js高级-es6中箭头函数的使用

145 阅读1分钟

箭头函数由什么组成?

1. (): 参数

2> =>: 箭头

3> {}: 函数的执行体

完整箭头函数

var foo = (num1, num2, num3) => {
  console.log(num1, num2, num3)
  var result = num1 + num2 + num3
  console.log(result)
}

箭头函数的常用简写

简写一: 如果参数只有一个, ()可以省略

var nums = [10, 20, 45, 78]
nums.forEach(item => {
  console.log(item) // 10 / 20 / 45 / 78
})

简写二: 如果函数执行体只有一行代码, 那么{}也可以省略

强调: 并且它会默认将这行代码的执行结果作为返回值

var nums = [10, 20, 45, 78]
nums.forEach(item => console.log(item)) // 10 / 20 / 45 / 78

var nums = [10, 20, 45, 78]
var newNums = nums.filter(item => item % 2 === 0)
console.log(newNums)//[ 10, 20, 78 ]

filter/map/reduce

var result = nums.filter(item => item % 2 === 0)
                 .map(item => item * 100)
                 .reduce((preValue, item) => preValue + item)
console.log(result) //10800

简写三: 如果一个箭头函数, 只有一行代码, 并且返回一个对象, 这个时候如何编写简写

var bar = () => ({ name: "why", age: 18 })