关于javascript:javascript高级程序设计学习笔记-111异步编程

5次阅读

共计 2051 个字符，预计需要花费 6 分钟才能阅读完成。

关注前端小讴，浏览更多原创技术文章

ES6 新增了正式的 Promise 援用类型，反对更优雅地定义和组织 异步逻辑
接下来的几个版本，应用 async 和await关键字定义异步函数的机制

相干代码 →

同步行为 在内存中 程序执行 处理器指令
- 每条指令都在 单个线程 中按呈现程序 执行
- 每条指令执行后，都能够推断出程序的状态，并 立刻取得 存储在零碎本地（或寄存器或零碎内存）的信息

let x = 3 // 操作系统在栈内存上调配一个存储浮点数值的空间
x = x + 4 // 针对这个值做一次数学计算，并把计算结果写回之前调配的内存中

异步行为 相似于 零碎中断
- 以后 过程内部的实体 能够触发代码执行，通常在 定时回调 中执行
- 执行线程 不晓得何时 将信息存储到零碎本地（或寄存器或零碎内存），取决于回调适合从音讯队列入列并执行

let x2 = 3 // 操作系统在栈内存上调配一个存储浮点数值的空间
setTimeout(() => {x = x + 4 // 执行线程不晓得 x 值何时会扭转，取决于回调何时从音讯队列入列并执行}, 1000)

晚期的 JS 只反对 回调函数 表明异步操作，串联多个异步操作需 深度嵌套 回调函数（回调天堂）

function double(value) {setTimeout(() => {setTimeout(() => {console.log(value * 2)
    }, 2000) // 2000 毫秒后，JS 运行时会把回调函数推到音讯队列上期待执行
  }, 1000) // 1000 毫秒后，JS 运行时会把回调函数推到音讯队列上期待执行
}
double(3) // 6(约 3000 毫秒后)，double()函数在 setTimeout 胜利调度异步操作后，立刻退出

若 setTimeout 操作返回有用的值，可给异步操作提供一个回调，把这个值传给须要它的中央

function double2(value, callback) {setTimeout(() => {callback(value * 2) // 1000 毫秒后，把回调函数推到音讯队列上
  }, 1000)
}
double2(3, (x) => console.log(`I was given: ${x}`)) // 'I was given: 6'(约 1000 毫秒后)

在回调模型中做异步操作的失败解决（胜利回调 & 失败回调）
该办法 已不可取 ，因为必须在 初始化异步操作 时定义回调，异步函数 返回值只在短时间内存在，必须准备好将该返回值作为参数的回调 能力接管到它

function double3(value, success, failure) {setTimeout(() => {
    // 必须在初始化异步操作时定义回调
    try {if (typeof value !== 'number') {throw 'Must provide number as first argument'}
      success(value * 2)
    } catch (error) {failure(error)
    }
  }, 1000)
}
const successCallback = (x) => console.log(`Success: ${x}`)
const failureCallback = (e) => console.log(`Failure: ${e}`)
double3(3, successCallback, failureCallback) // 'Success: 6'(约 1000 毫秒后)
double3('3', successCallback, failureCallback) // 'Failure: Must provide number as first argument'(约 1000 毫秒后)

若 异步返回值依赖另一个异步返回值 ，则须要 嵌套回调 （ 回调天堂，不具备扩展性，代码难以保护）

function double4(value, success, failure) {setTimeout(() => {
    try {if (typeof value !== 'number') {throw 'Must provide number as first argument'}
      success(value * 2)
    } catch (error) {failure(error)
    }
  }, 1000)
}
const successCallback2 = (x) => {double4(x, (y) => console.log(`Success: ${y}`)) // 异步返回值依赖另一个异步返回值，嵌套回调产生“回调天堂”}
const failureCallback2 = (e) => console.log(`Failure: ${e}`)
double4(3, successCallback2, failureCallback2) // 'Success: 12'(约 2000 毫秒后)