ES8

作者: 李大泽 | 来源:发表于2017-08-01 16:02 被阅读81次

    ECMAScript 2017(ES8)于 2017 年六月底由 TC39 正式发布,可以在这里浏览完整的版本;

    下面列出一些ES8新增部分特性,方便大家学习。

    异步函数

    希望异步执行的代码,只需要在代码前面添加指定的关键字即可

    // 异步函数就是在普通函数前面添加 async
    // 需要异步执行的代码前面添加 await 关键字
    async function test() {
        console.log('start');
    
        let y = await 20;
        console.log(y);
    
        let z = await 30;
        console.log(z);
    
        console.log('end');
    }
    console.log(111);
    test();
    console.log(222);
    
    // 执行顺序如下
    // 111  start  222  20  30  end
    

    await后面即可直接跟上普通value,也可以跟上Promise对象

    // 返回Promise对象,2秒后执行resolve
    function resolveAfter2Second(x) {
        return new Promise(resolve => {
            setTimeout(() => {
                resolve(x)
            }, 2000);
        });
    }
    
    // 使用async和await实现异步方法
    async function add1(x) {
        let a = resolveAfter2Second(20);
        let b = resolveAfter2Second(30);
        return x + await a + await b;
    }
    
    // 间隔2秒后打印60
    add1(10).then(v => {
        console.log(v);
    });
    
    // 将await的位置移到变量创建时
    async function add2(x) {
        let a = await resolveAfter2Second(20);
        let b = await resolveAfter2Second(30);
        return x + a + b;
    }
    // 间隔4秒后打印60
    add2(10).then(v => {
        console.log(v);
    });
    

    当await后面是普通的value时候,将自定将后面的值转为Promise的resolve,并执行

    如果后面是Promise的reject时,将throw异常

    async function test() {
        try {
            var y = await Promise.reject('error message');
        } catch(err) {
            console.log(err); // error message
        }
    }
    test();
    

    Object新增方法

    获取一个对象的所有key

    • keys()
    let obj = {
        name: 'xiaoming',
        age: 19,
        gender: 'M'
    };
    let arr = ['iPad', 'iPhone', 'iPod', 'MacBook', 'Air Pods'];
    let str = 'es8';
    
    // 获取某个对象的所有key
    Object.keys(obj); // ["name", "age", "gender"]
    Object.keys(arr); // ["0", "1", "2", "3", "4"]
    Object.keys(str); // ["0", "1", "2"]
    

    获取一个对象的所有value

    • values()
    // 获取某个对象的所有value
    Object.values(obj); // ["xiaoming", 19, "M"]
    Object.values(arr); // ["iPad", "iPhone", "iPod", "MacBook", "Air Pods"]
    Object.values(str); // ["e", "c", "8"]
    

    返回一个给定对象自身可遍历属性 [key, value] 的数组

    • entires()
    Object.entires(obj); // [["name", "xiaoming"], ["age", 19], ["gender", "M"]]
    Object.entires(arr); // [["0", "iPad"], ["1", "iPhone"], ["2", "iPod"], ["3", "MacBook"], ["4", "Air Pods"]]
    Object.entires(str); // [["0", "e"], ["1", "s"], ["2", "8"]]
    

    返回指定对象所有自身属性的描述对象

    • getOwnPropertyDescriptors
    // es7 和 es8 为只读属性,而不是方法
    let p = {
        get es7() { return 'es7'; },
        get es8() { return 'es8'; }
    };
    
    // 获取属性的描述对象
    Object.getOwnPropertyDescriptors(p);
    

    String新增方法

    填补字符串的首部和尾部,为了使得到的结果字符串的长度能达到给定的长度

    • padStart()
    • padEnd()
    let str = 'es8';
    
    // 字符串长度设置为5,不足10位前面拼接空格
    str.padStart(5); // '  es8'
    
    // 字符串长度设置为2,如果目标长度小于当前长度,则不作任何处理
    str.padStart(2); // 'es8'
    
    // 不足位数拼接指定内容
    str.padStart(5, '-'); // '--es8'
    str.padStart(10, 'ha'); // 'hahahahes8'
    
    // 字符串长度设置为5,不足10位后面拼接空格
    str.padEnd(5); // 'es8   '
    
    // 不足位数拼接指定内容
    str.padEnd(10, 'ha'); // 'es8hahahah'
    

    在函数形参和实参末尾允许添加逗号

    function test(a, b, c, ) {
        console.log(a, b, c);
    }
    test(1, 2, 3, );
    

    欢迎各位补充纠错。

    相关文章

      网友评论

        本文标题:ES8

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