前端开发中如何实现异步编程

异步编程其实很常见，特别是在出线Node.js之后，异步编程更是让很多开发者受益。那么回到最初的地方，传统的前端开发中如何实现异步编程呢？下面列举了js实现异步编程的四种方式。

方法一：使用回调函数

比如有两个方法f1()和f2()，f1()方法耗时较多，这时可以使用回调函数实现异步：

function f1(callback){

    setTimeout(function () {

        // f1的任务代码

        callback();

    }, 1000);

}

f1(f2);

因为在js中存在函数提升的规则，所以callback()方法会先于f1的任务代码执行。也可以使用其他方法，总之回调函数的使用模式就是将耗时操作推迟执行，从而不会阻塞整个程序的执行

方法二：事件监听

可以定义一个事件，并为这个事件设定处理函数。这样只有当这个时间发生的情况下，对应的处理函数才会被执行。

比如最传统的addEventListener()方法，通过侦听某个元素的事件，执行之间的响应方法，就是事件侦听的异步模式。实现这种模式的jquery代码如下：

f1.on('done', f2);

function f1(){

    setTimeout(function () {

        // f1的任务代码

        f1.trigger('done');

    }, 1000);

}

首先侦听f1()的done事件，监听到该事件就出发f2()方法。这样在f1()中执行触发done方法，即可完成f1()和f2()的异步执行。

方法三：事件的发布/订阅

这个模式在NodeJS以及其他JS框架中都有实现，是一个非常常用的异步编程方式。具体的原理及实现方法可以参考我之前的博客：http://blog.youkuaiyun.com/fareise/article/details/52198877《 Node中EventEmitter以及如何实现JavaScript中的订阅/发布模式》，里面有比较详细的解析。

方法四：Promise模式

ES6中提供了原生的Promise对象，这个模式最开始只是一个构想，后来由一些框架库实现。Promise对象代表了未来才会知道结果的事件。

Promise的基本思路就是，将需要异步执行的事件储存起来，然后根据异步事件之行后的结果状态执行下一步的操作。具体的Promise对象的原理和ES6中的使用方法将在下一篇文章中更加深入的进行介绍。