• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

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

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

先贴上源码传送门: https://github.com/flowforever/yaryin.note

记事本网址: http://yindoc.com , 井号后面写你喜欢的文件名即可。

 

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

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

文件地址: https://github.com/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的那套依赖注入也很给力。

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript之接口&amp;函数发布时间:2022-07-18
下一篇:
TypeScript安装发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap