箭头函数是ES6的新特性，其语法简洁，常用于简化函数定义、回调函数和Promise处理。箭头函数的一个重要特点是this的指向固定，它不会在函数内部被重新绑定，而是继承自外层作用域。
§§ --- es6/arrow.md
§§ 1000
+# 箭头函数
+
+## 一、定义
+
+箭头函数（Arrow Function）是 ES6 新增的函数，它的语法比较简洁，大大减少了 JavaScript 代码量。
+
+## 二、语法
+
+```js
+// 一个参数
+(param1) => {
+ statements
+}
+
+// 多个参数
+(param1, param2, ...) => {
+ statements
+}
+
+// 无参数
+() => {
+ statements
+}
+```
+
+## 三、用法
+
+### 1、简化函数
+
+```js
+function fn1() {
+ console.log('fn1')
+}
+
+// 简写
+const fn2 = () => {
+ console.log('fn2')
+}
+```
+
+### 2、简化回调函数
+
+```js
+// 传统写法
+[1, 2, 3].forEach(function (item) {
+ console.log(item)
+})
+
+// 简写
+[1, 2, 3].forEach(item => console.log(item))
+```
+
+### 3、this 指向
+
+ES6 中箭头函数里的 this 指向的是外围作用域，而不是指向调用者，因此 this 在箭头函数中是不会改变的。
+
+```js
+// 传统写法
+const obj = {
+ name: 'obj',
+ fn1: function () {
+ setTimeout(function () {
+ console.log(this.name) // undefined
+ }, 0)
+ },
+ fn2: function () {
+ setTimeout(() => {
+ console.log(this.name) // obj
+ }, 0)
+ }
+}
+```
+
+### 4、简化 Promise
+
+```js
+// 传统写法
+fetch('/user.json')
+ .then(function (res) {
+ return res.json()
+ })
+ .then(function (data) {
+ console.log(data)
+ })
+
+// 简写
+fetch('/user.json')
+ .then(res => res.json())
+ .then(data => console.log(data))
+```
扫一扫
649
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
