异步编程

众所周知，JavaScript是在单线程中工作的，也就是在执行下一个脚本之前只能执行一个脚本，不能同时执行两个脚本。如果一个脚本需要很长时间，那么下面的脚本必须排队等待，这会延迟整个程序的执行。那么，如何让程序像人类一样使用多线程呢？以下是对几种异步编程方法的总结，希望能与大家分享。

回调函数事件监控发布-订阅模式承诺生成器(ES6)异步(ES7)异步编程传统解决方案：回调函数和事件监控

初始示例：假设有两个函数，f1和f2，f1是需要一定时间的函数。

函数f1(){ settimeout(function(){ console . log('先执行f1 ')}，1000)}函数F2 () {console.log('再次执行F2 ')}回调函数

因为f1是需要一定时间的函数，所以f2可以写成f1的回调函数，同步操作可以变成异步操作。f1不会阻塞程序的运行，f2也不需要空等，比如JQuery的ajax。

回调函数演示：

function f1(f2')} { settimeout(function(){ console . log('先执行f1 ')}，1000)F2()} function F2(){ console . log('再次执行F2 ')}的效果如下：

总结：回调函数易于实现和理解，但是多次回调会导致高代码耦合

事件监督

脚本的执行不取决于代码的顺序，而是取决于事件是否发生。

事件监控演示

$(文档)。ready(function(){ console . log(' DOM是ready ')})；发布-订阅模式

发布/订阅模式使用消息中心。发布者向消息中心发布消息，订阅者从消息中心订阅消息。父组件和子组件之间的值传递类似于vue。

发布-订阅模式演示

//订阅done event $ ('# app ')。on ('done '，function(data){ console . log(data)})//publish event $(' # app ')。触发(完成，哈哈)承诺

Promise实际上是一个对象，从中可以获得异步操作的消息。Promise对象有三种状态：待定、已履行和已拒绝。Promise的状态一旦改变，就完全不会改变，回调函数就变成了链式调用。

Promise封装了异步请求演示

导出默认函数getMethods (url){返回新的Promise(函数(解析，拒绝){ axios.get(url))。然后(res={ resolve(res) })。catch(err={ reject(err)})})GetMethods('/API/XXX ')。然后(res={ console.log(res)}，err={ console.log(err)})生成器

生成器函数是封装多个内部状态的状态机。执行生成器函数将返回一个助行器对象。使用这个对象的next()方法，您可以遍历生成器函数中的每个状态，直到返回语句。

形式上，生成器函数是一个普通函数，但它有两个特点。首先，函数关键字和函数名之间有一个星号；第二，表达式yield用在函数体内部，yield是暂停执行的标志。

当next()方法遇到yield表达式时，它会挂起下面的操作，并将yield之后的表达式的值作为返回对象的值属性值。

发电机演示

函数* generatorDemo(){ yield ' hello '；产量12；返回“确定”；} var demo=generator demo()demo . next()/{ value : ' hello '，done : false } demo . next()/{ value : 3，done : false } demo . next()/{ value : ' ok '，done : ture } demo . next()/{ value : undefined，done: ture } async

Async函数返回Promise对象，然后可以使用方法添加回调函数。异步函数内部的return语句返回的值将成为方法回调函数的参数。函数执行时，一旦遇到await就会返回，等待异步操作完成，然后执行函数体后面的语句。

1.Promise对象在await命令之后返回，运行结果可能会被拒绝，所以最好将await命令放在try中.捕捉代码块。

异步演示1

异步非同步(asynchronous)函数demo(){尝试{等待新诺言(函数（解析，拒绝){ //某物});} catch(err){ console。日志(err)；} }演示()。然后（数据={ console.log(数据)//})参考文献

https://开发者。谷歌。com/web/foundation/primers/promises http://E6。阮一峰。com

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。