# [Arrow functions](https://babeljs.cn/docs/plugins/transform-es2015-arrow-functions)
就是我們平常說的箭頭函數,可以使用 `babel-plugin-ransform-es2015-arrow-functions` 進行語法轉換。
```
npm install --save-dev babel-plugin-transform-es2015-arrow-functions
```
## .babelrc 配置
```json
{
"plugins": ["transform-es2015-arrow-functions"]
}
```
## 使用
### 空箭頭函數
in
```js
var a = () => {};
```
out
```js
var a = function a() {};
```
### 返回值
in
```js
var a = (b) => b;
```
out
```js
var a = function a(b) {
return b;
};
```
### 循環中使用
in
```js
const double = [1,2,3].map((num) => num * 2);
```
out
```js
var double = [1, 2, 3].map(function (num) {
return num * 2;
});
```
### 構造函數中
普通的構造函數長這樣:
```js
function A() {
this.a = 'a';
this.fun = function () {
setTimeout(function () {
console.log(this.a);
}, 1000);
};
}
var a = new A();
a.fun(); // undefined
```
使用箭頭函數后:
in
```js
function A() {
this.a = 'a'
this.fun = function () {
setTimeout(() => {
console.log(this.a);
}, 1000)
}
}
let a = new A()
a.fun() // a
```
out
```js
function A() {
this.a = 'a';
this.fun = function () {
var _this = this;
setTimeout(function () {
console.log(_this.a);
}, 1000);
};
}
var a = new A();
a.fun(); // a
```