使用TypeScript开发一个在线记事本，支持离线存储

先贴上源码传送门：? https://github测试数据/flowforever/yaryin.note

记事本网址： http://yindoc测试数据 , 井号后面写你喜欢的文件名即可。

?

最近在研究NativeScript，NativeScript使用TypeScript,于是就顺便研究了ts。

不得不提到NativeScript源码学习，感觉学习到了不少东西，顺便也从上面扣了一个依赖注入的框架下来用，实际使用感觉非常给力。

文件地址： https://github测试数据/flowforever/yaryin.note/blob/master/utils/yok.ts

除了稍微修改一下依赖，其他基本没动。

?

ts 给我的第一印象就是清爽分明，配合WebStorm逆天的自动编译，写的过程中代码哪边编译不通过提示非常详细。

先贴两段代码：

serviceBase.ts

 /*  *
 * Created by trump on 15/4/23.
   */ 
 ///  <reference path="_references.d.ts"/> 
 ///   <reference path="./_references.d.ts"/> 
import db = require( '  db/db  '  );
import Future  = require( "  fibers/future  "  );
import Fiber  = require( '  fibers  '  );

export   class   ServiceBase {

    constructor(table) {
          this .table =  table; // 这个table就是mongoose的Model
          this .$table =  Future.wrap(table); //配合node fibber 解决异步callback hell 太给力了
    }

    table;
    $table;

    getAll() : IFuture <any>  {
          return   this .$table.findFuture.bind( this  .table)({});
    }

    add(model): IFuture <any>  {
          return   this .$table.createFuture.bind( this  .table)(model);
    }

    findById(id:   string ): IFuture<any>  {
          return   this .$table.findOneFuture.bind( this  .table)({
            _id: id
        });
    }

    find(query:any): IFuture <any> {
          return   this .$table.findFuture.bind( this  .table)(query);
    }

    findOne(query:any): IFuture <any> {
          return   this .$table.findOneFuture.bind( this  .table)(query);
    }
} 

?

documentServices.ts

  1   ///   <reference path="./_references.d.ts"/> 
  2  import db = require( '  db/db  '  );
   3  
  4  import Future = require( "  fibers/future  "  );
   5  import Fiber = require( '  fibers  '  );
   6  import sb = require( '  ./servicesBase  '  );
   7  
  8  export  class   Document extends sb.ServiceBase {
   9  
 10       constructor($db) {
  11           super( $db.Document );
  12           this .db =  $db;
  13       }
  14  
 15       db;
  16  
 17      getList() : IFuture<any>  {
  18           return   this  .getAll();
  19       }
  20  
 21   }
  22  
 23  $injector.register( '  documentServices  ' , Document); // 眼尖的同学会看到这行代码，没错这边将DocumentService注入到容器里面，在接下来的controller中我们就不需要require DocumentService 这个类写一对的路径了

?

?

controller/api.ts

 ///  <reference path="_references.d.ts"/> 
import express = require( '  express  '  );

import services  = require( '  services/documentServices  '  );

  class   Controller {

    constructor($documentServices) {
          this .services =  $documentServices; // 我们这边只需要在构造函数里面指定好依赖的名称，yok框架就帮我们做好一切了
    }

    services;  //   = <services.Document>$injector.resolve('documentServices'); 

     '  get/:name  '  (req:express.Request, res:express.Response) {
        (() =>  {
              var  doc =  this  .services.findOne({
                name: req.  params  .name
            }).wait();
            res.send(doc || {});
        }).future()();
    }

      '  [post]edit  '  (req:express.Request, res:express.Response) {
        (() =>  {
              var  saved =  null  ;
              if (! req.body._id) {
                saved  =  this  .services.add({
                    name: req.body.name
                    , content: req.body.content
                }).wait();
                res.send(saved);
            }   else   {
                saved  =  this  .services.findById(req.body._id).wait();
                saved.content  =  req.body.content;
                saved.name  =  req.body.name;
                saved.save(function(){
                    res.send(saved);
                });
            }
        }).future()()
    }

    rename(req:express.Request, res:express.Response) {

    }

    remove(req, res) {

    }

}

$injector.register(  '  apiHomeController  '  , Controller);

module.exports  = $injector.resolve( '  apiHomeController  ' );

?

总体来说：

TypeScript 开发很给力，

NativeScript的那套依赖注入也很给力。

?

查看更多关于使用TypeScript开发一个在线记事本，支持离线存储的详细内容...