高频面试—“箭头函数和普通函数的区别”

Posted 2021-09-08 小hu同学

在面试的时候，面试官有时候会问这个样一个问题？
面试官：“你说一下，箭头函数和普通函数有什么区别”

那现在我们就来讨论一下这个问题？

普通函数

const fun = function(){
	return 100;
 }
 console.log(fun())
//在控制台打印的结果就是     100

箭头函数

//多个参数
const fun = (x,y) =>{return 100}

//一个参数
const fun = x => 100

//无参数
const fun =() => 100

 console.log(fun())

箭头函数
( ) 定义参数，如果只有一个参数，可以不写括号；
{ } 中写函数体，如果函数体中只有返回值，可以不写return

箭头函数和普通函数的区别？

//普通函数
let obj = {
 name:'小hu同学',
 age:18,
 seyname(){
 	//这个this 指向的是这个seyname对象
	console.log(this)

 	setTimeout(function(){
 		console.log("我是" + this.name)
 		//当前的this  是指向的是Windows全局对象
 		console.log(this)
 	},500)
   }
}
obj.seyname()

打印结果
我是 后面就没有了
this 指向的是window

//箭头函数  

let obj = {
 name:'小hu同学',
 age:18,
 seyname(){
 	setTimeout(() =>{
 		console.log("我是" + this.name)
 		console.log(this)
 	},500)
   }
}
obj.seyname()

可以看到打印结果
已经能打印出来了，this指向的也是这个对象

箭头函数和普通函数的区别说明：
1、this指向不同
1.1普通函数 —— 谁调用这个函数 ，this就指向谁
1.2箭头函数 —— 在哪里定义函数，this指向谁