箭头和普通函数的区别是什么?
1.第一个区别就是写法上的区别 箭头函数省略了声明函数的关键字function 在函数和代码块之间用一个=>代替
2.箭头函数中的this始终指向箭头函数声明时所在的对象
3.普通函数中的this指向调用函数的对象
例:
<script>
function fn() {
console.log(this)
}
fn()(这种调用等同于window.fn(),省略了window,此时函数this指向window)
let obj = {
name: 'zhangsan',
fun() {
console.log(this)
}
}
obj.fun()(函数被obj调用,所以此是this指向obj实例对象)
var fn = () => {
console.log(this)
}
fn()(箭头函数中的this指向始终指向箭头函数声明时所在的对象,函数在window中声明,所以this指向window)
</script>
箭头函数的写法都有哪些?
第一种写法 当箭头函数只接受一个参数 并且返回值是这个参数的时候,当箭头函数有且仅有一个参数时可以省略()
let fn = a => a
// 上面的箭头函数等价于下面的这种写法
let fn = function(a) {
return a
}
第二种写法 当箭头函数只接受一个参数 并且返回的是一个简单的逻辑的时候
let fn = a => a+1
// 上面的箭头函数等价于下面的这种写法
let fu = function(a) {
return a + 1
}
第三种写法是当箭头函数接受多个数据 并且返回一个简单的逻辑的时候
let fn = (a, b, c) => a + b + c
// 上面的箭头函数等价于下面的这种写法
let fn = function(a, b, c) {
return a + b + c
}
箭头函数的第四种写法 如果使用箭头函数只是想单纯的返回一个对象 则需要给对象添加()
let fn = () => ({name: 'zhangsan', age: 15})
箭头的函数的第五种写法
let fn = (a, b, c) => {
console.log(a + b + c)
}
fn(1, 2, 3)