JavaScript----箭头函数

最新推荐文章于 2023-11-29 09:46:04 发布

原创最新推荐文章于 2023-11-29 09:46:04 发布 · 227 阅读

0 ·

CC 4.0 BY-SA版权

java 同时被 2 个专栏收录

93 篇文章

订阅专栏

JavaScript

7 篇文章

订阅专栏

本文详细介绍了JavaScript中箭头函数的使用方法及其与传统函数的区别，包括语法简化、this指向特性、不能作为构造函数使用等关键特性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

javascript中箭头函数类似于Java中的lambda表达式，这种函数的出现大大简化了函数的定义

传统函数：

<script type="text/javascript">
	function add(a,b){
		return a+b;
	}
	var result = add(1,1);
	console.log(result);
</script>

箭头函数：

<script type="text/javascript">
	var add = (a,b)=>{
		return a+b;
	}
	var result = add(1,1);
	console.log(result);
</script>

a、如果函数体只有一行代码，则函数大括号可以省略，如果该行代码用于返回结果，return必须忽略，如下例子：

<script type="text/javascript">
	var print = ()=>console.log("Tom");
	print();
	
	var add = (a,b)=> a+b;
	var result = add(1,1);
	console.log(result);
</script>

b、箭头函数是匿名函数，不能作为构造函数，不能使用new，如下例子：

<script type="text/javascript">
	let Student = () => {
	    console.log('箭头函数不能作为构造函数');
	}

	let student = new Student();//报错：TypeError: Student is not a constructor
</script>

c、箭头函数没有原型属性，如下例子：

<script type="text/javascript">
	var add = (a, b) => a + b;
	console.log(add.prototype); // undefined

	function print() {
		console.log("Tom");
	}
	console.log(print.prototype);
</script>

d、箭头函数不绑定arguments，而是使用...接收不定参数，如下例子：

代码1：
<script type="text/javascript">
	function print(params) {
		console.log(arguments);
	}
	print(1,2,3);
</script>

代码2：
<script type="text/javascript">
	let print=(params)=>console.log(arguments);//报错：ReferenceError: arguments is not defined
	print(1,2,3);
</script>

代码3：
<script type="text/javascript">
	let print=(...params)=>console.log(params);
	print(1,2,3);
</script>

e、箭头函数中this永远指向其上下文中的this，普通函数中this指向调用它的对象，如下代码：

<script type="text/javascript">
	var student = {
		age: 10,
		a: function() {
			console.log(this); // Object { age: 10, a: a(), b: b(), c: c() }
			console.log(this.age); // 10
		},
		b: () => {
			console.log(this); // Window
			console.log(this.age); // undefined
		},
		c: function() {
			return() => {
				console.log(this);//Object { age: 10, a: a(), b: b(), c: c() }
				console.log(this.age); //10
			}
		}
	}
	student.a();
	student.b();
	student.c()();
</script>

f、箭头函数不能当做Generator函数,不能使用yield关键字；