我的NodeJS学习之路9（改善代码）

请关注专题：我的NodeJS学习之路（实践之路）

小弟初涉node领域，不足之处，还请多多指教！
欢迎Star、Fork：https://github.com/gefangshuai/ANodeBlog

今天是不幸的一天，为什么说呢，因为Github挂了！全球最大的同性交友网站挂了，让我等技术宅还怎么好好的撸代码呢？

好了，闲篇少扯，说点正事吧。今天我们来介绍程序中用到的几个强大的中间件。

async - 强大的异步功能支持

之前已经简单介绍过，请移步NodeJS异步流程控制简单介绍。为什么要将这个中间件呢，因为当你接触nodejs代码多了之后，难免会受到“回调之痛”。各种的回调嵌套真的把你给玩坏了。代码看起来就好像多层的if-else嵌套一样。

比如我们做用户注册功能，保存用户之前，要先判断一下用户名是否已经存在，大致代码如下：

var user = req.body;
var User = dbHelper.User;   
User.findOne({username: user.username}, function (err, doc) {
    if(err){
        next(err);
    }else{
        if(doc){    // 用户名已被占用
            req.flash('error', '用户名已被占用');
            res.redirect('/reg');
        }else{
            User.create(user, function (err, doc) {
                if(err){
                    next(err);
                }else{
                    req.flash('success', '注册成功，请登录!');
                    res.redirect('/login');
                }
            });
        }
    }
});

对于数据库的操作我们嵌套了两层。再进一步，加入保存成功后，自动为注册用户绑定一些数据并存到数据库，同时在跳转成功的页面进行展示呢？是不是又要多嵌套两层？这时候我们的代码已经面目全非了！

这时候改async出场了。
async将各种嵌套的异步进行有效组织，增加了代码的可维护性（虽然是为 Node.js 设计的，但是它也可以直接在浏览器中使用）。

Async 提供了大约20个函数，包括 map, reduce, filter, forEach 等等，也有常用的异步流程控制模式，并行，瀑布等等。官方文档里有详细的说明，并且有实例，这里我们介绍一下两个最常用的：parallel
、waterfall
。

parallel

并行执行多个函数，每个函数都是立即执行，不需要等待其它函数先执行。传给最终callback的数组中的数据按照tasks中声明的顺序，而不是执行完成的顺序。

async.parallel([
    function(callback){
        setTimeout(function(){
            callback(null, 'one');
        }, 200);
    },
    function(callback){
        setTimeout(function(){
            callback(null, 'two');
        }, 100);
    }
],
// optional callback
function(err, results){
    // the results array will equal ['one','two'] even though
    // the second function had a shorter timeout.
});

parallel中的函数是并行的，没有先后之分，callback中results参数的结果跟并行函数顺序有关。上例中results值为['one'， 'two']。

在本程序中，用户注册时，我们要校验用户名和邮箱是否被占用。分析一下：校验用户名和校验邮箱并有没先后循序，可以并行校验。我们只需要拿到校验后的结果，做出处理即可。示例代码如下：

async.parallel({
    username: function (callback) {
        User.findOne({username: user.username}, function (err, doc) {
            callback(null, doc);
        });
    },
    email: function (callback) {
        User.findOne({email: user.email}, function (err, doc) {
            callback(null, doc);
        });
    }
}, function (err, results) {
    if (results.username) {
        req.flash(config.constant.flash.error, '用户名已被占用');
        res.redirect('/join');
        return;
    }
    if (results.email) {
        req.flash(config.constant.flash.error, '邮箱已被占用');
        res.redirect('/join');
        return;
    }

    user.password = utils.md5(user.password, 'base64');
    User.create(user, function (err, doc) {
        webHelper.reshook(err, next, function () {
            req.flash(config.constant.flash.success, '注册成功，请登录!');
            res.redirect('/login');
        });
    });
});

waterfall

按顺序依次执行一组函数。每个函数产生的值，都将传给下一个函数。

waterfall跟parallel相反，是顺序执行一组函数。

async.waterfall([
    function(callback) {
        callback(null, 'one', 'two');
    },
    function(arg1, arg2, callback) {
      // arg1 now equals 'one' and arg2 now equals 'two'
        callback(null, 'three');
    },
    function(arg1, callback) {
        // arg1 now equals 'three'
        callback(null, 'done');
    }
], function (err, result) {
    // result now equals 'done'
});

第一个函数返回两这值one、two，由于waterfall是顺序执行的，所有等第一个函数执行完，才会继续执行第二个函数，并且one、two传递给了第二个函数，所以在第二个函数中arg1值为'one'，arg2值为'two'，然后通过callback，将three传给了第三个函数，所以第三个函数arg1值为'three'，最后将'done'传给了最后的回调函数，所以result值为'done'。

那么在我们的程序中是怎么应用的呢？比如展示用户详情页面中/u/username，我们需要展示用户的基本信息，同时将此用户的文章进行展示。前台传递到后台的参数是username，而我们只能通过userId才能查询文章，所以我们需要先通过username查询user，在通过user.id查询此用户的所有文章articles，然后将user和articles都传到前台，进行展示，代码如下：

router.get('/:username', function (req, res, next) {
    var username = req.params.username;
    var User = dbHelper.User;
    var Article = dbHelper.Article;
    async.waterfall([
        function (callback) {
            User.findOne({username: username}).exec(function (err, user) {
                callback(null, user);
            });
        },
        function (user, callback) {
            if (user) {
                Article.find({_user: user.id}).populate('_user').exec(function (err, articles) {
                    callback(null, articles, user);
                });
            } else {
                callback(null, null);
            }
        }
    ], function (err, articles, user) {
        res.render('my', {
            articles: articles,
            user: user,
            menu: 'my'
        });
    });
});

总结：async官方示例中说的很详细了，它的功能非常强大，需要我们一个个将其摸索透。最终组织出漂亮的代码出来。
官方文档：https://github.com/caolan/async#asyncjs

添加自定义的404页面

expressjs生成的代码app.js中，默认404是当作500错误进行处理的，当我们请求到404后，会给出这样一个错误页面

404

而实际上404跟500是不一样的，500是服务器端程序错误，404是很常见的一种资源不存在的错误，500能避免，但是404是不可避免的，所以我们需要有好的提示给用户一个404页面。改善方法如下：
在app.js中找到catch 404 and forward to error handler对应的方法：

app.use(function (req, res, next) {
    var err = new Error('Not Found');
    err.status = 404;
    next(err);
});

问题就出在next(err)，将err传递给下一个方法，也就是500那个。这里我们阻断它继续传递，直接渲染到前台页面：

app.use(function (req, res, next) {
    var err = new Error('Not Found');
    err.status = 404;
    res.render('404');
});

然后在views下添加一个404.hbs，定制一下就ok！效果如下：

404

你可以自己订制的更漂亮！

使用Handlebars模块化你的页面

已经有一篇详细的文章来单独说明这个知识点，请移步：http://www.jianshu.com/p/a38ec7ef339a

请关注专题：我的NodeJS学习之路（实践之路）