• Node.js学习笔记----day05 (Promise详情)


    认真学习,认真记录,每天都要有进步呀!!!
    加油叭!!!


    一、回调函数

    回调的含义:异步任务里面又嵌套了异步
    如图:
    在这里插入图片描述
    没有使用回调之前读取文件,没有办法保证每次执行顺序都是
    a--->b--->c

    在这里插入图片描述

    使用回调可以使文件读取顺序是 a--->b--->c

    在这里插入图片描述

    二、Promise(解决回调嵌套的问题)

    Promise是一个构造函数
    Promise一旦被创建,就开始执行里面的代码
    Promise承诺本身不是异步,但是它里面的代码往往封装一个异步任务

    在这里插入图片描述

    在这里插入图片描述
    在这里插入图片描述

    这里调用的resolve()实际上就是then方法传递的那个function

    使用reject相当于调用了then方法的第二个参数
    在这里插入图片描述

    PromiseAPI代码图示:

    在这里插入图片描述
    用Promise解决如上案例中回调嵌套问题,读取文件顺序依然还是
    a--->b--->c

    var fs = require('fs')
    var p1 = new Promise(function (resolve, reject) {
      fs.readFile('./data/a.txt', 'utf8', function (err, data) {
        if (err) {
          reject(err)
        } else {
          resolve(data)
        }
      })
    })
    var p2 = new Promise(function (resolve, reject) {
      fs.readFile('./data/b.txt', 'utf8', function (err, data) {
        if (err) {
          reject(err)
        } else {
          resolve(data)
        }
      })
    })
    var p3 = new Promise(function (resolve, reject) {
      fs.readFile('./data/c.txt', 'utf8', function (err, data) {
        if (err) {
          reject(err)
        } else {
          resolve(data)
        }
      })
    })
    p1
      .then(function (data) {
        console.log(data)
        // 当 p1 读取成功的时候
        // 当前函数中 return 的结果就可以在后面的 then 中 function 接收到
        // 当你 return 123 后面就接收到 123
        //      return 'hello' 后面就接收到 'hello'
        //      没有 return 后面收到的就是 undefined
        // 上面那些 return 的数据没什么用
        // 真正有用的是:我们可以 return 一个 Promise 对象
        // 当 return 一个 Promise 对象的时候,后续的 then 中的 方法的第一个参数会作为 p2 的 resolve
        // 
        return p2
      }, function (err) {
        console.log('读取文件失败了', err)
      })
      .then(function (data) {
        console.log(data)
        return p3
      })
      .then(function (data) {
        console.log(data)
        console.log('end')
      })
    

    封装Promise版本的readFile

    var fs = require('fs')
    
    function pReadFile(filePath) {
      return new Promise(function (resolve, reject) {
        fs.readFile(filePath, 'utf8', function (err, data) {
          if (err) {
            reject(err)
          } else {
            resolve(data)
          }
        })
      })
    }
    pReadFile('./data/a.txt')
      .then(function (data) {
        console.log(data)
        return pReadFile('./data/b.txt')
      })
      .then(function (data) {
        console.log(data)
        return pReadFile('./data/c.txt')
      })
      .then(function (data) {
        console.log(data)
      })
    
  • 相关阅读:
    Vue+element UI实现“回到顶部”按钮组件
    JS判断字符串长度的5个方法(区分中文和英文)
    从vue源码看Vue.set()和this.$set()
    mac下git安装与使用
    JS数组reduce()方法详解及高级技巧
    vue中router.go、router.push和router.replace的区别
    上传及更新代码到github(以及如何在vscode上提交自己的代码)
    VSCode打开多个项目文件夹的解决方法
    get请求和post请求的区别
    android 进程的优先级
  • 原文地址:https://www.cnblogs.com/Chinatsu/p/13823189.html
Copyright © 2020-2023  润新知