JS中箭头函数的使用

283 阅读1分钟

箭头函数的形式

例如代码1这样的函数就叫做箭头函数(arrow function)。它包含'()参数','=>箭头','{}函数的执行体'。

//代码1
let foo = (num1, num2, num3) => {
    return num + num2 + num3
}

箭头函数的简写

简写规则1,参数只有一个

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

let foo = num => {
    return num
}

简写规则2,函数的执行体只有一行代码

如果我们函数的执行体只有一行代码,我们的{}也可以省略,它会默认将这个代码的结果作为返回值

 nums.forEach(item => console.log(item)) //它返回了一个undefined
 let newNums = nums.filter(item => item % 2 === 0)

我们也可以结合着将filter map 以及reduce一起使用

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

简写规则3,箭头函数只有一行代码并且返回一个对象

let bar = () => ({name:'why',age:18})  //需要用括号将其包围起来

箭头函数没有this与arguments

箭头函数没有 this。如果访问 this,则会从外部获取。

箭头函数无法被当成构造函数创建,并且箭头函数没有原型

var bar = () => {

}
console.log(bar.prototype);  //undefined

// const b = new bar() //不能这样!!!