资讯专栏INFORMATION COLUMN

初探 es6 promise

paraller / 3210人阅读

摘要:是单线程程序,所有代码都是单线程执行。导致的网络请求都是异步执行,异步执行可以通过回调函数实现秒钟才能打印,回调函数处理异步执行的但是推出一种新的方法对象用于表示一个异步操作的最终状态完成或失败,以及其返回的值。

javascript是单线程程序,所有代码都是单线程执行。导致javascript的网络请求都是异步执行,异步执行可以通过回调函数实现:
setTimeout(callback,1000);
function callback(){
    console.log("----callback")     
    //1秒钟才能打印,回调函数处理异步执行的
};
但是es6推出一种新的方法new Promise()==>对象用于表示一个异步操作的最终状态(完成或失败),以及其返回的值。
new Promise( function(resolve, reject) {...});resolve 表示成功的状态 reject 表示失败的状态
Promise的方法有:
1.Promise.all([]).then(e=>e).catch(e=>e) ==>数组中所有传入状态完成才执行
2.Promise.race([]).then(e=>e).catch(e=>e) ==>数组中又一个传入的状态完成就执行
3.Promise.resolve({}) ==>返回一个成功的状态
4.Promise.reject({}) ==>返回一个失败的状态
let a=new Promise((resolve,reject)=>{
    resolve(1)
    //或reject()
});
a.then(e=>{   // resolve 返回的结果
    console.log(e)  //1
}).catch(e=>{ //reject 返回的结果
    console.log(e)
});
如果我们有一个需求是需要所有3个接口的数据都返回了然后再进行操作,那么promise.all就可以解决,比如下面例子:
let b1=new Promise((resolve,reject)=>{
    resolve("b1")
});
let b2=new Promise((resolve,reject)=>{
    resolve("b2")
})
let b3=new Promise((resolve,reject)=>{
    resolve("b3")
});
let b4=Promise.resolve("成功")  //调用一个成功的状态
Promise.all([b1,b2,b3,b4]).then(value=>{
    console.log(value)   //  "b1", "b2", "b3" ]
})
let b5=Promise.reject("失败")  //调用一个失败的状态
Promise.all([b1,b5]).then(value=>{
    console.log(value)   
}).catch(e=>{
    console.log(e,"------失败")  //失败
})
如果我们有一个需求是3个接口中只要有一个完成了接口请求即执行,Promise.race([])
var promise1 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 50, "one");
});
var promise2 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 100, "two");
});
Promise.race([promise1, promise2]).then(value=>{    
  console.log(value);  //one  
}).catch(e=>{
    console.log(e)
})
//promise1或者promise2谁先执行完就执行就获取先执行的值

每天进步一点,希望大家喜欢,也希望喜欢的朋友点个赞或收藏,后续继续更新...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/93651.html

相关文章

  • Puppeteer初探--爬取并生成《ES6标准入门》PDF

    摘要:首先介绍是一个库,他提供了一组用来操纵的默认也就是无的,也可以配置为有有点类似于,但是官方团队进行维护的,前景更好。使用,相当于同时具有和的能力,应用场景会非常多。 首先介绍Puppeteer Puppeteer是一个node库,他提供了一组用来操纵Chrome的API(默认headless也就是无UI的chrome,也可以配置为有UI) 有点类似于PhantomJS,但Puppet...

    JerryWangSAP 评论0 收藏0
  • ES6初探

    摘要:可以直译为古怪到有魅力。里面基本上这些是被弱化了的,或者说是被隐藏起来了。而之前的的语法使得入门的门槛变高了。但是,于此同时,作为语言的独特魅力被削弱了。应该说,理解这些传统的语法对也很有意义。因为毕竟这些只是被隐藏,而不是被剔除。 这两天在看React的一些东西。接触到了ES6。谈谈一些粗浅的看法。 ES6其实是个简称。这东西学名叫做ECMAScript 2015,或者ES 2015...

    tianyu 评论0 收藏0
  • Promise初探

    摘要:可以根据省份城市和区对组件设置默认值。获取省份获取城市获取区出现层嵌套的回调,这就是传说中的恶魔金字塔。相比回调嵌套,层次更分明,可读性强。基本原理学习无论是在异步操作的执行之前或执行之后,用对象的方法注册回调,回调都能一致执行。 遭遇恶魔金字塔 项目需要,封装了一个省市区的地址选择器组件。 可以根据省份id、城市id和区id对组件设置默认值。逻辑是这样的: 获取省份列表,选中默认省...

    mj 评论0 收藏0
  • 初探Promise

    摘要:实例生成以后,可以用方法指定状态和状态的回调函数。语法该方法是的别名,用于指定发生错误时的回调函数。 一 前言 本文主要对ES6的Promise进行一些入门级的介绍。要想学习一个知识点,肯定是从三个方面出发,what、why、how。下面就跟着我一步步学习吧~ 二 什么是Promise 首先是what。那么什么是Promise呢? 以下是MDN对Promise的定义 The Prom...

    wall2flower 评论0 收藏0
  • 构建 Web 应用之 Service Worker 初探

    摘要:诞生之初,是单线程的。当接收到服务端的响应之后,便通过回调函数执行之后的操作。冲锋基于事件驱动。拥有拦截请求消息推送静默更新地理围栏等服务。控制时处于两种状态之一终止以节省内存监听获取和消息事件。支持的所有事件五销毁浏览器决定是否销毁。 这次体验一种新的博客风格,我们长话短说,针针见血。 showImg(https://segmentfault.com/img/remote/14600...

    voidking 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<