从编程小白到全栈开发：理解异步

正文

请到「今天看啥」查看全文

但是AJAX解决的问题不只在于“局部刷新”，而是在于“异步”。因为如果是采用同步方式向服务器请求数据然后更新页面的话，当发出请求后，浏览器就会进入等待状态，用户将不能在页面上进行任何操作。如果这个数据请求的过程比较长，那么页面就会产生长时间的卡死现象，这种体验肯定就非常不好。而AJAX采用了异步方式进行服务器端请求，请求发出后，其他部分还是继续该干嘛干嘛，不用等待，丝毫不受影响。

在后端的Node.js中，最典型的异步处理，可能就是对文件读写和对网络请求的异步处理了，这也是Node.js在这方面性能优良的来源。在这方面，Node.js采取了“你先去干别的吧，等我做完了再告诉你”的方式，避免阻塞等待，大大提高了任务吞吐量。

下面，我们写一些最简单的代码，来看一下在JS中是如何做异步处理的。JS中最简单的异步功能，莫过于 setTimeout 这个定时器函数了，下面我们就开始用它来编写一些异步代码示例。

一个最简单的异步示例

我们首先来写一个最简单的会异步执行的任务：

// 这是一个异步任务
function asyncTask1() {
    // 该定时器2秒钟后执行
    setTimeout(function () {
        var a = 1
        var b = 2
        var c = a + b
        console.log("async task 1 was done.", a, "+", b, "=", c)
    }, 2000)
}

// 这是另一个异步任务
function asyncTask2() {
    // 该定时器1秒钟后执行
    setTimeout(function () {
        console.log(new Date())
    }, 1000)
}

// 这是一个同步任务
function task1() {
    console.log("do something else...")
}

asyncTask1()
asyncTask2()
task1()

上面代码中，有两个异步任务函数 asyncTask1 和 asyncTask2 ，还有一个普通的同步任务 task1 。其中一个异步任务使用定时器在2秒后执行一个加法运算，另一个异步任务在1秒后打印当前日期。然后我们执行这段代码，会发现在我们的控制台上是以这样的顺序的输出信息：

do something else...
Mon Oct 16 2017 10:35:48 GMT+0800 (CST)
async task 1 was done. 1 + 2 = 3

可以看到，最先打印出的是task1里的内容。这说明了，在异步任务 asyncTask1 和 asyncTask2 执行后，其后的 task1 不会对它们进行等待，而是立即就接着执行了，这就是异步的特性。

请到「今天看啥」查看全文