ES8

ES8_第1张图片

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)