经验总结

  1. 首页 > 生活 > >

JavaScript的异步编程之Promise( 二 )

生活百科

  • 后面的then方法就是在为上一个then返回的Promise注册回调
  • 前面的then方法中的回调函数的返回值回作为后面then方法回调的参数
  • 如果回调中返回的是Promise, 那后面的then方法的回调会等待他的结束
    • 捕获异常onRejected 回调会在Promise执行异常或者抛出的异常时触发 ，  捕获异常有两种方式 ， 第一种, then(成功处理的回调函数, 异常处理的回调函数) 在then方法中传递两个回调函数 ， 第二种用.catch 方法去捕获异常 ， catch方法其实就是then方法的别名 ， 相当于then方法第一个参数传undefined
    // then(成功处理的回调函数, 异常处理的回调函数)ajax('/json1.json').then(ret => {console.log(err)}, err => {console.log(err)})// catchajax('/json1.json').then(ret => {console.log(err)}).catch(err => {console.log(err)})// catchajax('/json1.json').then(ret => {console.log(err)}).then(undefined,err => {console.log(err)})这两种方式还是有很大的差异 ， catch 其实是在给上一个then返回的Promise 捕获异常 ， 但是如果是同一个链条下的Promise的错误会向下传递直到有catch方法捕获 ， 而then方法传递两个回调函数的捕获异常的方式只会捕获谁上一个Promise的错误
    ajax('/json1.json').then(ret => {console.log(ret)}).then(undefined, err => {console.log(err)}).then(ret => {console.log(ret)}).then(ret => {console.log(ret)})// catch 捕获异常ajax('/json1.json').then(ret => {console.log(ret)}).catch(err => {// 这里能捕获之前的所有Promise的异常})// 传递then 第二个参数捕获异常ajax('/json1.json').then(ret => {console.log(ret)}).then(undefined, err => {console.log(err)throw new Error('故意的异常')}, (err) => {// 这里能捕获故意的错误}).then(ret => {console.log(ret)}).then(ret => {console.log(ret)}).catch(err => {// 这个时候已经捕获不到异常了 ， 因为上一个故意的异常已经被捕获了 ， 根据then方法会返回一个Promise所以捕获异常之后会返回一个成功的Promise})还可以全局捕获异常,这种全局方式捕获异常是不推荐使用的 ， 应该在代码块中明确的去捕获对应的异常
    // 浏览器环境中window.addEventListener('unhandledrejection', event => {console.log(event.reason, event.promise)// reason 失败原因 ， // promise 失败的Promiseevent.preventDefault()}, false)// nodejs中process.on('unhandledRejection', (reason, promise) => {console.log(reason, promise)// reason 失败原因 ， // promise 失败的Promise})如果需要无论成功和错误都需要执行则可以用finally来实现
    ajax('/json1.json').then(ret => {console.log('成功执行这个')}).catch(err => {console.log("失败执行这个")}).finally(function() {console.log("成功和失败都会执行这个")});Promise 静态方法Promise.resolve快速的一个值转化为一个Promise对象, 这种方式和 new Promise 返回一个值是等价的
    Promise.resolve({data: "hahah"})new Promise((resolve) => {resolve({data: "hahah"})})如果传入的是一个Promise对象会原封不动的把这个对象返回
    function ajax (url) {return new Promise((resove, reject) => {var xhr = new XMLHttpRequest()xhr.open('GET', url)// 新方法可以直接接受一个j对象xhr.responseType = 'json'xhr.onload = function () {if (this.status === 200) {resove(this.response)} else {reject(new Error(this.statusText))}}xhr.send()})}let promise1 = ajax('/url')let promise2 = Promise.resolve(promise1)console.log(promise1 === promise2) // true

    经验总结扩展阅读


    上一篇：恋爱后，仍然会假装单身的星座

    下一篇：世界上鼻子最长的猴子叫什么