javascript异步编程学习及实例

Posted 2021-11-30 kidsitcn

所谓异步就是指给定了一串函数调用a,b,c,d，各个函数的执行完结返回过程并不顺序为a->b->c->d（这属于传统的同步编程模式），a,b,c,d调用返回的时机并不确定。

对于js代码来说，这种异步编程尤其重要并大量存在，很大的原因是js为单线程模式，其中包含了ui刷新和响应。想像一下，如果我们写了一段js代码，他会发起ajax请求，如果为同步模式，就意味着这时js单线程一直等待这个ajax完成，这期间是不能响应任何用户交互的，这种体验是不可接受的。现在随着服务端js-nodejs的兴起，其超强的异步模式更为nodejs相较于php,java等成熟后端语言的卖点。

实现异步编程模式可以有以下方式：

1. 回调callback,

看以下nodejs代码：

// 遍历目录，找出最大的一个文件
// nodejs的readdir为一个典型的异步调用过程，函数调用马上返回，但是结果却等到目录扫描完成后，调用回调函数来通知应用去处理

const fs = require(‘fs‘);
const path = require(‘path‘);

function findLargest(dir, callback) {
    fs.readdir(dir, function (err, files) {
        if (err) return callback(err); // [1]
        let count = files.length; // [2]
        let errored = false;
        let stats = [];
        files.forEach( file => {
            fs.stat(path.join(dir, file), (err, stat) => {
                if (errored) return; // [1]
                if (err) {
                    errored = true;
                    return callback(err);
                }
                stats.push(stat); // [2]

                if (--count === 0) {
                    let largest = stats
                        .filter(function (stat) { return stat.isFile(); })
                        .reduce(function (prev, next) {
                            if (prev.size > next.size) return prev;
                            return next;
                        });
                    callback(null, files[stats.indexOf(largest)]);
                    console.log(‘readdir finished!‘)
                }
            });
        });
    });
    console.log(‘before readdir callback called!‘)
}

findLargest(‘./‘, function (err, filename) {
    if (err) return console.error(err);
    console.log(‘largest file was:‘, filename);
});
// 其执行log如下
before readdir callback called!
largest file was: halls-test.js
readdir finished!

我们看看通过node --inspect-brk 调试的过程:

$ node --inspect-brk maxfile.js
Debugger listening on ws://127.0.0.1:9229/ed354fe8-fdfc-466b-b0ea-fcc7fccb4b36
For help, see: https://nodejs.org/en/docs/inspector
Debugger attached.
before readdir callback called!
largest file was: halls-test.js
readdir finished!
Waiting for the debugger to disconnect...