[ecmascript6] async and await

async function

async The function returns a Promise object , The state of the object depends on the return value of the function , If the function returns
Not Promise Object or return success Promise, Then this function returns Promise Object state
For success , If the function returns a failed Promise Object or throw an error , Then this function returns Promise
The object status is failed

        async function fn() {
    
            return new Promise((resolve, reject) => {
    
                resolve(' Request successful data ')
            })
        }

        const result = fn()
        
        result.then(value => {
    
            console.log(value)   //  Request successful data 
        }, error => {
    
            console.warn(error)
        })

await expression

        const p = new Promise((resolve, reject) => {
    
            resolve(' Success data ')
        })

        // await  To put async Function , Followed by a Promise object 
        async function fn() {
    
            // await The result returned is after Promise The successful value of the object （ Pay attention to one. Promise Object has two properties , One is state , The other is the value ）
            //  If later Promise The state of the object is failed , An error will be thrown 
            let result = await p
            console.log(result)  //  Success data 
        }
        fn()

        const p1 = new Promise((resolve, reject) => {
    
            reject(' Failure information ')
        })

        // await  To put async Function , Followed by a Promise object 
        async function fn1() {
    
            try {
    
                //  If later Promise The state of the object is failed , An error will be thrown , Need to use try...catch Capture 
                let result = await p1
            } catch(e) {
    
                console.log(e)  //  Failure information 
            }
        }
        fn1()

async And await Combined with reading the contents of the file

        const fs = require('fs')
        
        function readFile1() {
    
            return new Promise((resolve, reject) => {
    
                fs.readFile('./file1.md', (err, data) => {
    
                    if(err) reject(err)
                    resolve(data)
                })
            })
        }
        
        function readFile2() {
    
            return new Promise((resolve, reject) => {
    
                fs.readFile('./file2.md', (err, data) => {
    
                    if(err) reject(err)
                    resolve(data)
                })
            })
        }
        
        function readFile3() {
    
            return new Promise((resolve, reject) => {
    
                fs.readFile('./file3.md', (err, data) => {
    
                    if(err) reject(err)
                    resolve(data)
                })
            })
        }
        
        async function readFiles() {
    
            let fileData1 = await readFile1()
            let fileData2 = await readFile2()
            let fileData3 = await readFile3()
            console.log(fileData1.toString() + '\r\n' + fileData2.toString() + '\r\n' + fileData3.toString())
        }
        readFiles()

async And await Combined transmission Ajax request

        //  send out Ajax request , The result is Promise object 
        function sendAjax(url) {
    
            return new Promise((resolve, reject) => {
    
                // 1.  Create objects 
                const xhr = new XMLHttpRequest()
                
                // 2.  initialization 
                xhr.open('GET', url)
                
                // 3.  send out 
                xhr.send()
                
                // 4.  The binding event , Process response results 
                xhr.onreadystatechange = function() {
    
                    if(xhr.readyState === 4) {
    
                        if(xhr.status >= 200 && xhr.status < 300) {
    
                            resolve(xhr.response)
                        }else {
    
                            reject(xhr.status)
                        }
                    }
                }
            })
        }

        //  Assume that the test interface is ：https://api.apiopen.top/getJoke
        // 1.  adopt Promise then Method to test 
        sendAjax('https://api.apiopen.top/getJoke').then(value => {
    
            console.log(value)
        }, error => {
    
            console.log(error)
        })

        // 2.  adopt async await Method to test 
        async function main() {
    
            let result = await sendAjax('https://api.apiopen.top/getJoke')
            console.log(result)  // result by sendAjax return Promise The value of success , That is, the required data information 
        } 
        main()

        //  notes : vue Medium axios The return value is also a Promise object , It can be very good and async await Use a combination of