箭头函数没有它自己的 this 值,箭头函数内的 this 值继承自外围作用域,谁定义的函数this 指向谁
箭头函数要实现类似纯函数的效果,必须剔除外部状态。所以箭头函数不具备普通函数里常见的 this、arguments 等,当然也就不能用 call ()、apply ()、bind () 去改变 this 的指向
对于箭头函数来说,并没有自己的 this ,它的 this 将始终指向让它生效的对象,即它的外部调用者:
ES6 function foo() {
setTimeout(() => {
console.log('id:', this.id);
}, 100);
}
ES5 function foo() {
var _this = this;
setTimeout(function () {
console.log('id:', _this.id);
}, 100);
}
- 箭头函数转换插件
- 插件其实就是一个钩子函数,在遍历语法树的过程中,可以捕获某些特别类型的节点并进行转换
- 每个es6的语法都会对应一个插件
- 每个插件都会捕获自己的语法节点,转成对应的es5语法
- 所有的插件打成一个包,就是preset @babel/preset-env 是插件集合,包含着基本上大部分的es6语法转换插件
- 插件的格式是定死的,就是一个对象,对象里有一个visitor的访问器(设计模式:访问者模式)