[js高手之路]Node.js+jade+express+mongodb+mongoose+promise实现todolist

promise主要是用来解决异步回调问题，其实还有好几种比promise更好的方案，后面再说，这节,我们先用promise来改造下，我以前写的一篇文章[js高手之路]javascript腾讯面试题学习封装一个简易的异步队列

中的一道面试题( 页面上有一个按钮，一个ul，点击按钮的时候，每隔1秒钟向ul的后面追加一个li, 一共追加10个，li的内容从0开始计数( 0, 1, 2, ....9 ) ).

promise的小实例:

 function next1(){
     return new Promise( function( resolve, reject ){
         console.log( 'next1' );
         resolve( 'jump to next2' );
     } );
 }

 function next2(){
     return new Promise( function( resolve, reject ){
         console.log( 'next2' );
         resolve( 'jump to next3' );
     } );
 }

 next1().then( function( res ){
     console.log( res );
     return next2();
 } ).then( function( res ){
     console.log( res );
 } );

使用promise的改造方案：

 <input type="button" value="添加">
 <ul></ul>
 <script>
     var oUl = document.querySelector("ul");
     var oBtn = document.querySelector("input");
     var count = 0;
     var timer = null;
     function createDom() {
         var oLi = document.createElement("li");
         oLi.innerHTML = count++;
         oUl.appendChild(oLi);
     }
     var addDom = (function () {
         return new Promise(function (resolve, reject) {
             resolve(createDom);
         });
     })();
     oBtn.onclick = function () {
         timer = setInterval(function () {
             if (count == 10) {
                 clearInterval(timer);
             } else {
                 addDom.then(function (fn) {
                     fn();
                 });
             }
         }, 1000);
     }
 </script>

接下来，我们就用promise结合Node.js+jade+mongodb+mongoose+express来实现一个简单的todolist( 留言板 )

项目结构：

实现的效果:

public: 存放的项目的静态资源，如图片,css,js等

routers: 把不同功能模块分离出不同的路由，如index.js( 首页路由 ), add.js( 发布留言时候的路由 )

views: jade模板目录

db.js: 数据库连接模块

server.js: 启动服务器以及项目入口

server.js:

 var express = require('express');
 var app = express();
 var path = require( 'path' );
 var indexRouter = require( './routers/index.js' );
 var addRouter = require( './routers/add.js' );

 app.use( '/', indexRouter );
 app.use( '/add', addRouter );
 app.use( express.static( path.join( __dirname, 'public' ) ) );

 app.set('views', path.join(__dirname, 'views'));
 app.set('view engine', 'jade');

 app.listen( 3000 );
 console.log( 'server listening on:' + 3000 );

index.js，渲染首页，取出数据库中的所有留言数据

 var express = require('express');
 var router = express.Router();
 var Message = require('../db');

 function getAllMsg(){
     return new Promise( function( resolve, reject ){
         Message.find( {}, function( err, msgList ){
             resolve( msgList );
         } );
     } );
 }
 router.get('/', function (req, res) {
     getAllMsg().then( function( data ){
         res.render( 'index', {
             msgList : data
         } );
     } );
 });
 module.exports = router;

add.js，处理发布留言的提交流程

 var express = require( 'express' );
 var router = express.Router();
 var Message = require( '../db' );

 function addMsg( msgInfo ){
     var msgModel = new Message( msgInfo );
     msgModel.save(function(err,result){
         if( err ){
             console.log( err );
         }else{
             console.log( 'success' );
         }
     });
 }
 router.get('/', function( req, res ) {
     addMsg( {
         title : req.query.msg,
         listTime : new Date()
     } );
     res.redirect( '/' );
 });

 module.exports = router;

db.js: 数据库连接模块

 var mongoose = require('mongoose');
 mongoose.Promise = global.Promise;
 var DB_URL = 'mongodb://localhost:27017/cms';

 var db = mongoose.createConnection(DB_URL);
 db.on('connected', function (err) {
     if (err) {
         console.log(err);
     } else {
         console.log('db connected success');
     }
 });
 var Schema = mongoose.Schema;
 var msgSchema = new Schema({
     title: String, //留言信息
     listTime: Date //发布时间
 });
 var Message = db.model( 'Message', msgSchema );

 module.exports = Message;

后续的功能：

1，删除

2，编辑

3，分页

...等等