美文网首页
ES6特性的两点分析

ES6特性的两点分析

作者: 风吹燕尾 | 来源:发表于2017-10-16 21:27 被阅读13次

块级作用域声明let、const

ES6中const 和let的功能,转换为ES5之后,我们会发现实质就是在块级作用改变一下变量名,使之与外层不同。
ES6转换前:

let a1 = 1;
let a2 = 6;
{
    let a1 = 2;
    let a2 = 5;
    {
        let a1 = 4;
        let a2 = 5;
    }
}
a1 = 3;

转换ES5后:

var a1 = 1;
var a2 = 6;
{
    var _a = 2;
    var _a2 = 5;
    {
        var _a3 = 4;
        var _a4 = 5;
    }
}
a1 = 3;

箭头函数

箭头函数其实主要是省了写函数的代码,同时能够直接用使外层的this而不用担心context切换的问题。以前我们一般都要在外层多写一个_this/self直向this。其实转换为ES5也是利用这种方法实现的。
ES6转换前:

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

转换ES5后:

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

相关文章

网友评论

      本文标题:ES6特性的两点分析

      本文链接:https://www.haomeiwen.com/subject/gsiluxtx.html