Zlog
首页归档关于
Zlog

一个探索技术、编程和构建 Web 的个人空间。

© 2026 Zlog

导航

首页归档关于

链接

/
|
·
·
·
首页/箭头函数

箭头函数

箭头函数表达式的语法比函数表达式更简洁,并且没有自己的 this、arguments、super 和 new.target。箭头函数更适用于本来应该需要匿名函数的地方,并且它们不能用作构造函数。

Z

Zephyr110

2019年12月28日·1 分钟
|
frontendfrontend-javascript

介绍

箭头函数表达式的语法比函数表达式更简洁,并且没有自己的 this、arguments、super 和 new.target。箭头函数更适用于本来应该需要匿名函数的地方,并且它们不能用作构造函数。

“

因为箭头函数没有 prototype,所以箭头函数本身没有 this。

注意事项

1. 返回对象

js
const foo = () => ({ bar: 'baz' });

由于大括号会被解释为代码块,所以利用箭头函数直接返回一个对象时,需要用小括号包裹。

2. 禁止构造函数

js
const Foo = () => {};
const foo = new Foo(); // TypeError: Foo is not a constructor

3. 对象方法

js
const foo = {
  bar: 'baz',
  baz: () => this.bar = 'foo'
}
 
foo.baz(); // foo.bar: 'baz' window.bar: 'foo'

箭头函数会继承父级作用域的 this,而对象没有作用域,此时 this 指向全局作用域(window)。

日常使用

1. 闭包

js
const add = (i = 0) => {return () => ++i};
const increase = add();
increase(); // 1
increase(); // 2

标签

frontendfrontend-javascript

评论 (0)

评论功能仅在主站可用,请访问 zephyr110.vercel.app

相关文章

OffscreenCanvas

MDN-OffscreenCanvas

2025年12月10日·7 分钟

Service Worker

Web worker 是一种在浏览器中运行的后台脚本,它可以在独立的线程中执行任务,而不会阻塞主线程的执行。Web worker 的主要作用是处理耗时的计算任务,例如图片处理、文本分析、数据处理等,以避免阻塞主线程,提高页面的响应性能

2024年5月28日·4 分钟

vue-tour二次封装

npm install vue-tour

2023年7月22日·7 分钟

← 返回文章列表