ES6语法的Babel解析

• let
• const
• 箭头函数

let

分析

1. 开启严格模式，严格模式下使用未声明的变量会报错
2. 在块中换一个变量和块外界区分
3. 在块中先使用，后定义，可以打到TDZ的效果

"use strict"
var foo = 123
{
    _foo = 'abc'
    var = _foo
}

const

分析

1. 开启严格模式
2. 解析的时候，如果检测到const声明的变量又赋值，直接替换成错误函数并执行

"use strict"

function _readOnlyError(name) { throw new Error('...'); }
var foo = 0;
foo = (_readOnlyError('a'), 1) // 直接执行抛出异常

箭头函数

对下面的代码进行解析

var obj = {
    prop: 1,
    func: function() {
        var _this = this
        var innerFunc = () => {
            this.prop = 1
        }
        var innerFunc1 = function() {
            this.prop = 1
        }
    }
}

Babel解析之后:

var obj = {
    prop: 1,
    func: function func() {
        var _this2 = this
        // 调用的时候实际用的是func的this
        var innerFunc = function innerFunc() {
            _this2.prop = 1;
        }
        var innerFunc1 = function innerFunc1() {
            this.prop = 1;
        }
    }
}