博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
13、ES6的promise
阅读量:6638 次
发布时间:2019-06-25

本文共 2018 字,大约阅读时间需要 6 分钟。

hot3.png

promise是为了解决回调的嵌套,回调的交叉调用问题。

promise有3个状态:pending 初始化、resolve 成功、reject 失败。

例子1:简单使用promise。

//resolve,reject 这2个参数也是函数    let promise = new Promise((resolve,reject) => {        console.log("1111");        //这里发送ajax请求后台数据,使用setTimeout模拟。2秒后数据返回。        setTimeout(() => {            let data = {username:"zhangsan",age:34};//模拟后台返回的数据            //resolve(data);//成功,调用resolve方法。            reject(data);//失败,调用reject方法。        },2000)    });    console.log("2222");    promise.then((data) => {//成功执行的函数        console.log(`成功了${data.username}`);    },(data) => { //失败执行的函数        console.log(`失败了${data.age}`);    })

上面的代码需要注意几个问题:

  1. 程序先执行new Promise()里面的代码,所以先打印"1111"然后打印“2222”。也就是new Promise()里传递的那个匿名函数不是异步执行的。
  2. 使用setTimeout模拟从后台异步请求回来数据。
  3. 当调用resolve()方法时,表示成功。将执行promise.then()方法第1个回调函数。
  4. 当调用reject()方法时,表示失败。将执行promise.then()方法第2个回调函数。

上面就是promise的作用。把成功、失败的回调逻辑。拿出来放在then()方法中。

例子2:Promise的链式调用。

function getMovie(url){        let promise = new Promise((resolve,reject) => {            setTimeout(() => {                let data = {username:"zhangsan",age:34};//模拟后台返回的数据                resolve(data);//成功,调用resolve方法。                //reject(data);//失败,调用reject方法。            },2000)        });        return promise;    }        function getComment(url) {        let promise = new Promise((resolve,reject) => {            setTimeout(() => {                let data = {username:"zhangsan",age:34};//模拟后台返回的数据                resolve(data);//成功,调用resolve方法。                //reject(data);//失败,调用reject方法。            },2000)        });        return promise;            }    getMovie("https://localhost:8080/movies/31")        .then((date) => {            //成功的处理逻辑,成功之后,获取电影的评论            return getComment("https://localhost:8080/31/comment")        },(date) => {            //失败逻辑        })        .then((date) => {            //成功的处理逻辑        },(date) => {            //失败逻辑        })

注意上面,获取电影、电影评论的时候返回promise。然后在调用getMovie的成功回调中。返回了promise。这样就可以一直then()方法链式回调下去

 

 

 

 

 

 

转载于:https://my.oschina.net/kunBlog/blog/1635250

你可能感兴趣的文章
选择技术方向都要考虑哪些因素
查看>>
自定义Android注解Part1:注解变量
查看>>
一款实用的前端截图工具
查看>>
我是如何入门机器学习的呢
查看>>
机器学习实战_人工神经网络
查看>>
Laravel核心解读 -- 扩展用户认证系统
查看>>
关于MySQL的知识点与面试常见问题都在这里
查看>>
CSS module 入门
查看>>
浅谈软件工程师的代码素养
查看>>
docker+jenkins+golang持续集成实践[转载自我的博客]
查看>>
Python 面向对象
查看>>
Vue路由使用总结
查看>>
Spring Boot入门(8)文件上传和数据预览
查看>>
js面试题
查看>>
Java多态
查看>>
js设计模式 --- 策略设计模式
查看>>
编写小而美函数的艺术
查看>>
art_template模板引擎渲染数据的小方法
查看>>
nodejs笔记-模块机制
查看>>
DuiC 性能测试报告 20180203
查看>>