TypeScript Basic Tutorial (9)

TypeScript

TypeScript Basic Tutorial

发布日期: 2020-03-14

更新日期: 2020-06-14

文章字数: 1.3k

阅读时长: 5 分

阅读次数:

模块

模块的的概念（官方）:

关于术语的一点说明: 请务必注意一点，TypeScript 1.5里术语名已经发生了变化。 “内部模块”现在称做“命名空间”。
“外部模块”现在则简称为“模块” 模块在其自身的作用域里执行，而不是在全局作用域里；
这意味着定义在一个模块里的变量，函数，类等等在模块外部是不可见的，除非你明确地使用export形式之一导出它们。
相反，如果想使用其它模块导出的变量，函数，类，接口等的时候，你必须要导入它们，可以使用 import形式之一。

模块的概念（自己理解）：

我们可以把一些公共的功能单独抽离成一个文件作为一个模块。
模块里面的变量函数类等默认是私有的，如果我们要在外部访问模块里面的数据（变量、函数、类），
我们需要通过export暴露模块里面的数据（变量、函数、类…）。
暴露后我们通过 import 引入模块就可以使用模块里面暴露的数据（变量、函数、类…）。

Demo01

import { getData,save } from './modules/db';
getData();
save();

var dbUrl='xxxxxx';

export function getData():any[]{
    console.log('获取数据库的数据111');
    return [
        {
            title:'121312'
        },
        {
            title:'121312'
        }
    ]
}

export function save(){
    console.log('保存数据成功');
}

Demo02

import { dbUrl,getData as get} from './modules/db';
console.log(dbUrl);
get();

var dbUrl='xxxxxx';

function getData():any[]{
    console.log('获取数据库的数据111');
    return [
        {
            title:'121312'
        },
        {
            title:'121312'
        }
    ]
}

function save(){
    console.log('保存数据成功');
}

export {dbUrl,getData,save};

Demo03

export default 默认导出
每个模块都可以有一个default导出。默认导出使用 default关键字标记；并且一个模块只能够有一个default导出。需要使用一种特殊的导入形式来导入 default导出。

import getData from './modules/db';
getData();

var dbUrl='xxxxxx';

function getData():any[]{
    console.log('获取数据库的数据111');
    return [
        {
            title:'121312'
        },
        {
            title:'121312'
        }
    ]

}

function save(){
    console.log('保存数据成功');
}

// export {getData};
export default getData;

Demo04

功能：定义一个操作数据库的库支持 Mysql Mssql MongoDb
要求1：Mysql MsSql MongoDb功能一样都有 add update delete get方法
注意：约束统一的规范、以及代码重用
解决方案：需要约束规范所以要定义接口，需要代码重用所以用到泛型

1.接口：在面向对象的编程中，接口是一种规范的定义，它定义了行为和动作的规范
2.泛型: 通俗理解：泛型就是解决类接口方法的复用性

操作用户表定义一个User类和数据表做映射

import {MsSqlDb} from './modules/db'

class User{
    username:string | undefined;
    password:string | undefined;
}

var u=new User();
u.username='张三2222';
u.password='123456';
var oMssql=new MsSqlDb<User>();
oMssql.add(u);

interface DBI<T>{
    add(info:T):boolean;
    update(info:T,id:number):boolean;
    delete(id:number):boolean;
    get(id:number):any[];
}

定义一个操作mysql数据库的类注意：要实现泛型接口这个类也应该是一个泛型类

export class MysqlDb<T> implements DBI<T>{
    constructor(){
        console.log('数据库建立连接');
    }

    add(info: T): boolean {
        console.log(info);
        return true;
    }    

    update(info: T, id: number): boolean {
        throw new Error("Method not implemented.");
    }

    delete(id: number): boolean {
        throw new Error("Method not implemented.");
    }

    get(id: number): any[] {
        var list=[
            {
                title:'xxxx',
                desc:'xxxxxxxxxx'
            },
            {
                title:'xxxx',
                desc:'xxxxxxxxxx'
            }
        ]
        return list;
    }
}

定义一个操作mssql数据库的类

export class MsSqlDb<T> implements DBI<T>{
    constructor(){
        console.log('数据库建立连接');
    }

    add(info: T): boolean {
        console.log(info);
        return true;
    }    

    update(info: T, id: number): boolean {
        throw new Error("Method not implemented.");
    }

    delete(id: number): boolean {
        throw new Error("Method not implemented.");
    }

    get(id: number): any[] {
        var list=[
            {
                title:'xxxx',
                desc:'xxxxxxxxxx'
            },
            {
                title:'xxxx',
                desc:'xxxxxxxxxx'
            }
        ]
        return list;
    }
}

Demo05

import {UserClass,UserModel} from './model/user';
import {ArticleClass,ArticleModel} from './model/article';

//增加数据
var u=new UserClass();
u.username='张三';
u.password='12345655654757';
UserModel.add(u);

//获取user表数据
var res=UserModel.get(123);
console.log(res);

//获取文章表的数据
var aRes=ArticleModel.get(1);
console.log(aRes);

model 01

import {MsSqlDb} from '../modules/db';

//定义数据库的映射
class ArticleClass{
    title:string | undefined;
    desc:string | undefined;
}

var ArticleModel=new MsSqlDb<ArticleClass>();

export {
    ArticleClass,ArticleModel
}

model 02

import {MsSqlDb} from '../modules/db';

//定义数据库的映射
class UserClass{
    username:string | undefined;
    password:string | undefined;
}

var UserModel=new MsSqlDb<UserClass>();

export {
    UserClass,UserModel
}

Module

interface DBI{
    add(info:T):boolean;
    update(info:T,id:number):boolean;
    delete(id:number):boolean;
    get(id:number):any[];
}

//定义一个操作mysql数据库的类       注意：要实现泛型接口 这个类也应该是一个泛型类
export class MysqlDb implements DBI{
    constructor(){
        console.log('数据库建立连接');
    }

    add(info: T): boolean {
        console.log(info);
        return true;
    }    

    update(info: T, id: number): boolean {
        throw new Error("Method not implemented.");
    }

    delete(id: number): boolean {
        throw new Error("Method not implemented.");
    }

    get(id: number): any[] {
        var list=[
            {
                title:'xxxx',
                desc:'xxxxxxxxxx'
            },
            {
                title:'xxxx',
                desc:'xxxxxxxxxx'
            }
        ]
        return list;
    }
}

//定义一个操作mssql数据库的类  
export class MsSqlDb implements DBI{
    constructor(){
        console.log('数据库建立连接');
    }

    add(info: T): boolean {
        console.log(info);
        return true;
    }    

    update(info: T, id: number): boolean {
        throw new Error("Method not implemented.");
    }

    delete(id: number): boolean {
        throw new Error("Method not implemented.");
    }

    get(id: number): any[] {
        var list=[
            {
                title:'xxxx',
                desc:'xxxxxxxxxx'
            },
            {
                title:'xxxx',
                desc:'xxxxxxxxxx'
            }
        ]
        return list;
    }
}