ES6与ES5部分对比

一、常量

    // 常量ES5写法
    // 为对象增加属性
    Object.defineProperty(window,"PI",{
        value: 3.1415926,
        wirtable: false,    
    })
     // ES6常量写法
    const PI = 3.1415926;

二、作用域

    // 作用域ES5
    var callbacks = [];
    // 变量提升
    for(var i = 0; i<= 2; i++ ){
        clallbacks[i] = function () {
            // 对变量的引用
            rerurn i*2;
        }
    }
    console.table([
        callbacks[0](),    //6
        callbacks[1](),    //6
        callbacks[2](),    //6
    ])
   
    //作用域ES6
    var callbacks1 = [];
    // 变量提升
    // 每次循环返回新的作用域
    for(let j = 0; j<= 2; j++ ){
        clallbacks1[j] = function () {
            rerurn j*2;
        }
    }
    console.table([
        callbacks1[0](),    //6
        callbacks1[1](),    //6
        callbacks1[2](),    //6
    ])
    // ES5中作用域隔开会使用立即执行函数
    ((function () {

    })())
    // ES6中作用域
    { }

三、箭头函数

    // ES5中函数
    function a() {
        
    }
    // ES6箭头函数
    ()=>{
        
    }
    
     // ES5
    {
        var evens = [1,2,3,4,5];
        var odds = evens.map(function (value) { return value+1 })
    }
    // ES6
    let evens = [1,2,3,4,5];
    let odds = evens.map(v => v+1);

• 写法简单

this绑定

   // ES5
    var factory = function () {
        this.a = 'a';
        this.b = 'b';
        this.c = {
            a: 'a+1',
            b: function () {
                  // 谁调用它
                return this.a  
            }
        }
        console.log(new factory().c.b());   //a+1
    }
    // ES6
    var factory = function () {
        this.a = 'a';
        this.b = 'b';
        this.c = {
            a: 'a+1',
            b: () => {    //定义时的对象
                return this.a
            }
        }
        console.log(new factory().c.b());   //a
    }

四、默认参数

    //ES5 默认参数
    function f(x,y,z) {
        if(y===undefined){
            y=7;
        } if(z===undefined){
            z=8;
        }
    }
    // ES6默认参数
    function f(x,y =7,z=8) {
        return x+y+z;
    }