JavaScript箭头函数的使用
箭头函数arrowfunction
◼ 箭头函数是ES6之后增加的一种编写函数的方法,并且它比函数表达式要更加简洁:
箭头函数不会绑定this、arguments属性;
箭头函数不能作为构造函数来使用(不能和new一起来使用,会抛出错误);
◼ 箭头函数如何编写呢?
(): 函数的参数
{}: 函数的执行体
num.forEach((item,index,arr)=>{})
```JavaScript
// 箭头函数完整写法
var foo3 = (name,age)=>{
console.log("箭头函数的函数体")
console.log(name,age)
}
```
箭头函数的编写优化
◼ 优化一: 如果只有一个参数()可以省略
// 优化一 如果箭头函数只有一个参数箭头函数小括号可以省略
names.forEach(item=>{
console.log(item)
})
// 拿到nums所有的偶数
var newNums = nums.filter(item=>{
return item%2 === 0
})
◼ 优化二: 如果函数执行体中只有一行代码, 那么可以省略大括号
并且这行代码的返回值会作为整个函数的返回值
names.forEach(item=>console.log(item))
var newNums = nums.filter(item => item % 2 === 0)
◼ 优化三: 如果函数执行体只有返回一个对象, 那么需要给这个对象加上()
var arrFun = () => ({name:"acb",age:19})
console.log(arrFun())
ES6箭头函数this使用
◼ 之前的代码在ES6之前是我们最常用的方式,从ES6开始,我们会使用箭头函数:
为什么在setTimeout的回调函数中可以直接使用this呢?
因为箭头函数并不绑定this对象,那么this引用就会从上层作用域中找到对应的this
var obj = {
name:"obj",
foo:()=>{
var bar = ()=>{
console.log(("bar",this))//指向window
}
return bar
}
}
var fn = obj.foo()
var obj = {
name:"obj",
foo:function(){
var bar = ()=>{
console.log(("bar",this))//指向obj
}
return bar
}
}
var fn = obj.foo()