美文网首页
day02-vuejs-Promise(补充)

day02-vuejs-Promise(补充)

作者: 东邪_黄药师 | 来源:发表于2019-02-18 23:53 被阅读7次
      1. Promise 是一个 构造函数,既然是构造函数, 那么,我们就可以 new Promise() 得到一个 Promise 的实例;
      1. 在 Promise 上,有两个函数,分别叫做 resolve(成功之后的回调函数) 和 reject(失败之后的回调函数)
      1. 在 Promise 构造函数的 Prototype 属性上,有一个 .then() 方法,也就说,只要是 Promise 构造函数创建的实例,都可以访问到 .then() 方法
      1. Promise 表示一个 异步操作;每当我们 new 一个 Promise 的实例,这个实例,就表示一个具体的异步操作;
      1. 既然 Promise 创建的实例,是一个异步操作,那么,这个 异步操作的结果,只能有两种状态:
        5.1 状态1: 异步执行成功了,需要在内部调用 成功的回调函数 resolve 把结果返回给调用者;
        5.2 状态2: 异步执行失败了,需要在内部调用 失败的回调函数 reject 把结果返回给调用者;
        5.3 由于 Promise 的实例,是一个异步操作,所以,内部拿到 操作的结果后,无法使用 return 把操作的结果返回给调用者; 这时候,只能使用回调函数的形式,来把 成功 或 失败的结果,返回给调用者;
      1. 我们可以在 new 出来的 Promise 实例上,调用 .then() 方法,【预先】 为 这个 Promise 异步操作,指定 成功(resolve) 和 失败(reject) 回调函数;
     var promise = new Promise()
    

    注意:这里 new 出来的 promise, 只是代表 【形式上】的一个异步操作; (什么是形式上的异步操作:就是说,我们只知道它是一个异步操作,但是做什么具体的异步事情,目前还不清楚)

     var promise = new Promise(function(){
      // 这个 function 内部写的就是具体的异步操作!!!
    }) 
    

    这是一个具体的异步操作,其中,使用 function 指定一个具体的异步操作

    例子:读取files文件夹里的.txt文件(222):

    Promise实例只要被创建就会立即执行里面的异步方法:

    
    const fs = require('fs')
    var promise = new Promise(function () {
      fs.readFile('./files/2.txt', 'utf-8', (err, dataStr) => {
        if (err) throw err
        console.log(dataStr)
      })
    }) 
    

    // 每当 new 一个 Promise 实例的时候,就会立即 执行这个 异步操作中的代码
    // 也就是说,new 的时候,除了能够得到 一个 promise 实例之外,还会立即调用 我们为 Promise 构造函数传递的那个 function,执行这个 function 中的 异步操作代码;

    • 不立即执行的方式(函数包裹起来):
      方法:
    function getFileByPath(fpath) {
      return new Promise(function (resolve, reject) {
        fs.readFile(fpath, 'utf-8', (err, dataStr) => {
    
          if (err) return reject(err)
          resolve(dataStr)
    
        })
      })
    }
    

    调用:通过.then指定成功和失败的回调

     getFileByPath('./files/2.txt')
      .then(function (data) {
        console.log(data + '-------')
      }, function (err) {
        console.log(err.message)
      }) 
    

    Promise-捕获异常的两种方式:
    1.当 我们有这样的需求: 哪怕前面的 Promise 执行失败了,但是,不要影响后续 promise 的正常执行,此时,我们可以单独为 每个 promise,通过 .then 指定一下失败的回调;

      .then(function (data) {
        console.log(data)
    
        // 读取文件2
        return getFileByPath('./files/2.txt')
      }, function (err) {
        console.log('这是失败的结果:' + err.message)
        // return 一个 新的 Promise
        return getFileByPath('./files/2.txt')
      })
      .then(function (data) {
        console.log(data)
    
        return getFileByPath('./files/3.txt')
      })
      .then(function (data) {
        console.log(data)
      }).then(function (data) {
        console.log(data)
      }) 
    

    如果 ,前面的 Promise 执行失败,我们不想让后续的Promise 操作被终止,可以为 每个 promise 指定 失败的回调

    • 2 有时候,我们有这样的需求,个上面的需求刚好相反:如果 后续的Promise 执行,依赖于 前面 Promise 执行的结果,如果前面的失败了,则后面的就没有继续执行下去的意义了,此时,我们想要实现,一旦有报错,则立即终止所有 Promise的执行;
    getFileByPath('./files/1.txt')
      .then(function (data) {
        console.log(data)
    
        // 读取文件2
        return getFileByPath('./files/22.txt')
      })
      .then(function (data) {
        console.log(data)
    
        return getFileByPath('./files/3.txt')
      })
      .then(function (data) {
        console.log(data)
      })
      .catch(function (err) { 
        // catch 的作用: 如果前面有任何的 Promise 执行失败,则立即终止所有 promise 的执行,
       // 并 马上进入 catch 去处理 Promise中 抛出的异常;
        console.log('这是自己的处理方式:' + err.message)
      })
    

    catch 的作用: 如果前面有任何的 Promise 执行失败,则立即终止所有 promise 的执行, 并 马上进入 catch 去处理 Promise中 抛出的异常.

    相关文章

      网友评论

          本文标题:day02-vuejs-Promise(补充)

          本文链接:https://www.haomeiwen.com/subject/jifzeqtx.html