美文网首页
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(补充)

    Promise 是一个 构造函数,既然是构造函数, 那么,我们就可以 new Promise() 得到一个 Pr...

  • swift笔记:函数补充,枚举补充,属性补充,继承补充

    关键字inout 这个例子是在playground下写的 inout这个形参接收的相当于接收的是结构体变量的地址,...

  • 补充

    一脸倦容的老先生倚靠在凳子上,一手举着茶壶,一手扇着扇子,背后支着面脏得看不清本色的旗子,上面歪歪扭扭地写着“卜”...

  • 补充

    1.生命周期 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听、编译模板、将实例挂...

  • 补充

  • 补充

    让心很自然的平静下来,不再受外界的打扰,抛开生活中所有的烦恼,放下社会中的地位,将注意力让着我们的身体上,有内而外...

  • 补充

    v-html 可以识别html标签v-text 不可以识别html标签 v-once 只绑定一次v-pre ...

  • 补充

  • 补充

  • 补充

    七月二十号,我和邓候打扫卫生。她从门口进来,候的身体堵住了去厕所的路。 “让一下,我洗个手。”她发出棉花糖般柔...

网友评论

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

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