ES6 语法详解(Promise对象(重点))

2021-08-16 22:32:42 阅读：165 来源： 互联网

标签：ES6 console log err 详解 Promise reject promise

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
    </body>
    <script type="text/javascript">
        /**
         * Promise对象
         * 1. 理解:
         *     Promise对象; 代表了未来某个将要发生的事件(通常是一个异步操作)
         *     有了Promise对象,可以将异步操作以同步的流程表达出来,避免了层层嵌套的回调函数(俗称'回调地狱')
         *     ES6的Promise是一个构造函数,用来生成Promise实例
         * 2. 使用Promise的基本步骤(2步)
         */
        // 1: 创建Promise对象
        /* 
        let promise = new Promise((resolve, reject) => {
            // 初始化Promise状态为pending
            // 2:执行异步操作
            // ajax xxx query
            // 如果执行成功
            if(true){
                resolve('执行成功') //修改Promise的转台为fullfilled
            }else{
                reject('执行失败') // 修改Promise的转台为rejected
            }
        }) */
        // 2: 调用Promise的then()
        /*
        then
            第一个函数是成功返回的时候执行
            第二个函数是失败返回的时候执行
        catch
            异常的时候执行
        promise.then(res => {
            console.log(res)
        },err => {
            console.log(err)
        }).catch(err => {
            console.log(err)
        })
         */
        /**
         * promise 对象的三种状态
         * pending: 初始化状态
         * fullfilled: 成功状态
         * rejected: 失败状态
         */

        /**
         * 应用:
         *     使用Promise实现超时处理
         * 
         *     使用Promise封装处理Ajax请求
         */
        /* 
        let request = new XMLHttpRequest()
        reject.onreadystatechange = function(){}
        request.responseType = 'json'
        request.open('GET', 'http://www.baidu.com')
        request.send() 
        */

        // 上面的代码 不可以执行 只做参考
        let promise = new Promise((resolve, reject) => {
            // 使用定时器模拟异步操作
            setTimeout(() => {
                console.log("send ajax!")
                let flag = true;
                if (flag) {
                    resolve("执行成功!")
                } else {
                    reject("执行失败")
                }
            }, 1000)
        })
        
        promise.then(res => {
            console.log('第一个函数:',res)
        },err => {
            console.log('第二个函数:',err)
        }).catch(error => {
            console.log("服务器开小差了!")
        })
    </script>
</html>

作者：彼岸舞

时间：2021\08\16

内容关于：前端知识库

本文属于作者原创,未经允许,禁止转发

标签：ES6,console,log,err,详解,Promise,reject,promise
来源： https://www.cnblogs.com/flower-dance/p/15150290.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

ES6 语法详解(Promise对象(重点))