ES6---箭头函数

最新推荐文章于 2022-04-29 19:56:20 发布

辣条小哥哥

最新推荐文章于 2022-04-29 19:56:20 发布

阅读量186

点赞数

分类专栏： javaScript 文章标签： javascript

本文链接：https://blog.csdn.net/weixin_44090040/article/details/109537122

版权

javaScript 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

1.箭头函数与function定义函数的写法：

//function
function fn(a, b){
	return a + b;
}
//arrow function
var foo = (a, b)=>{ return a + b };

2.this的指向：
使用function定义的函数，this的指向随着调用环境的变化而变化的，而箭头函数中的this指向是固定不变的，一直指向的是定义函数的环境。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		
	</body>
	<script>
		function foo(){
			console.log(this);
		}
		var obj = { 
			name: "辣条小哥哥" ,
			aa: foo ,
		};
		foo() // Window 
		obj.aa() // obj  { name: "辣条小哥哥" , aa: foo ,};
	</script>
</html>

使用function定义的函数中this指向是随着调用环境的变化而变化的

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		
	</body>
	<script>
		var foo = () => {
			console.log(this);
		}
		var obj = { 
			name: "辣条小哥哥" ,
			aa: foo ,
		};
		foo() // Window 
		obj.aa() // Window
	</script>
</html>