专栏首页智慧协同我的NodeJS学习之路9(改善代码)

我的NodeJS学习之路9(改善代码)

小弟初涉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'
});

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

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

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

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • NodeJS异步流程控制简单介绍

    但是在nodejs中,大家都知道,各种的回调。简单的查询数据库都是异步的。你可能会这么写:

    飞奔去旅行
  • MacOS没有管理员账号的解决办法

    重启电脑,启动时按住command+s,进入单一用户模式 输入 mount -uw /,然后回车 输入 rm /var/db/.AppleSetupDone...

    飞奔去旅行
  • 如何编写一个jQuery插件

    看来 jQuery 你已经用得很爽了,想学习如何自己编写插件。非常好,这篇文档正适合你。用插件和方法来扩展 jQuery 非常强大,把最聪明的功能封装到插件中可...

    飞奔去旅行
  • 11 Python 基础: 知识巩固,实现一个简易学生管理系统

    首先,我们定义了一个LoginModule类,此为登录模块,主要功能就是定义账号属性【用户名,密码】,然后定义一个登录login方法实现验证用户名和密码是否正确...

    小Gy
  • PyQt中布局管理

    布局管理是GUI编程中的一个重要方面。布局管理是一种如何在应用窗口上放置组件的一种方法。我们可以通过两种基础方式来管理布局。我们可以使用绝对定位和布局类。使用布...

    小飞侠xp
  • Python GUI教程三:布局

    摘要:这篇文章是Python GUI教程系列的第三篇,将介绍Qt编程中的布局概念及其在Python环境下的实现

    py3study
  • Python常用库 - logging日志库

    logging 使用非常简单,使用 basicConfig() 方法就能满足基本的使用需要;如果方法没有传入参数,会根据默认的配置创建Logger 对象,默...

    小菠萝测试笔记
  • HttpModule介绍

    Http 请求处理流程 和 Http Handler 介绍 这两篇文章里,我们首先了解了Http请求在服务器端的处理流程,随后我们知道Http请求最终会由实现了...

    张子阳
  • python之利用魔术方法实现自己定义的二维向量

    绝命生
  • 深入理解ES6之—对象

    在js中比较两个值时,你可能会用相等运算符==或者严格相等运算符 ===。为了避免在比较时发生强制类型转换,许多开发者更倾向于使用后者。

    寻找石头鱼

扫码关注云+社区

领取腾讯云代金券