ECMASript 8新特性

ECMASript 8新特性

async 和 await

async和 await两种语法结合可以让异步代码像同步代码一样

async函数

async函数的返回值为promise对象，
promise对象的结果由async函数执行的返回值决定

//async 函数
async function fn(){
    //返回一个字符串
    //return
    //返回的结果不是一个 Promise类型的对象，返回的结果就是成功 Promise对象
    //抛出错误，返回的结果是一个失败的 Promise
    //throw new Error('出错啦!');
    //返回的结果如果是一个Promise对象
    return new Promise((resolve,reject)=>{
        //resolve('成功的数据');
        reject("失败的错误");
    })

}
const result = fn();//如果上面return返回一个成功的Promise，此处就返回成功的promise；返回失败的promise那此处就返回一个失败的promise

//调用then方法
result.then(value => {
    console.log(value);
},reason =>{
    console.warn(reason);
})

await表达式

• await必须写在 async函数中
• await右侧的表达式一般为promise对象
• await返回的是promise成功的值
• await的promise失败了.就会抛出异常，需要通过trv...catch 捕获处理

//创建promise对象
const p = new Promise((resolve, reject) => {
    resolve("成功的值")
})
//await 要放在async 函数
async function main() {
    try {
        let result = await p;
        console.log(result);
    } catch (e) {//catch语句可以得到失败语句的结果
        console.log(e);
    }
}

利用await和async读取文件

const fs = require("fs");
function readChaYangshi() {
    return new Promise((resolve, reject) => {
        fs.readFile("./resources/插秧诗.md", (err, data) => {
            //如果失败
            if (err) reject(err);//如果成功
            resolve(data);
        })
    })
}

async function main(){
    let chayang = await readChaYangshi();

    console.log(chayang.toString());
}
main();

async与await结合发送AJAX请求

//发送AJAX请求,返回的结果是 Promise对象
function sendAJAX(url) {

    return new Promise((resolve, reject) => {
        //1．创建对象
        const x = new XMLHttpRequest();
        //2．初始化
        x.open('GET', url);
        //3.发送
        x.send();
        //4．事件绑定
        x.onreadystatechange = function () {
            if (x.readyState === 4) {
                if (x.status >= 280 && x.status < 300) {
                    //成功了
                    resolve(x.response);
                } else {
                    reject(x.status);
                }

            }
        }
    })
}

//promise then方法测式
// sendAJAX("https://api.apiopen.top/getJoke").then(value=>{
//     console.log(value);
// },reason=>{ })

async function main(){
    let result = await sendAJAX("https://api.apiopen.top/getJoke");
    console.log(result);
}

Object.values和 Object.entries

对象方法的扩展

//声明对象
const blog = {
    name: "苏槿年",
    cities: ['北京', '上海', '广州','深圳'],
    xueke: ['前端', ' Java', '大数据', '运维']
};
//获取对象所有的键
//console.log(Object.keys(blog));
//获取对象所有的值
//lconsole.log(Object.values(blog));
//entries
//console.log(Object.entries(blog));
//创建Map
// const m = new Map(Object.entries(blog));
// console.log(m.get( 'cities' ));

//对象属性的描述对象
// console.log(Object.getOwnPropertyDescriptors(blog));

const obj = Object.create(null,{
    name:{
        value:'123',
        writable:true,
        configurable:true,
        enumerable:true
    }
})