Day30-TypeScript(TS)的模组(Modules) Part2

今天是最後一天了，
但该讲的还是要讲完，
所以我们就接续上一篇的TypeScript(TS)的模组(Modules)吧。

那麽今天就带范例来吧，
接续上篇的范例，
要汇出成员如下，
汇出档案名称为export.ts，
程序码内容如下，

export class Employee {
    constructor(public empId: number, public empName: string) {
    }
    getInfo() {
        return ` ${this.empId} , ${this.empName} `;
    }
}
export let projectName = "HR Management";

那麽这边我样介绍三种引用成员的方式，如下。

引用方式一

第一种就是昨天的最基本的，
将要引用的成员逐一打出来做引用。

import { Employee, projectName } from "./export";

//使用
let emp = new Employee(1, "Mary");
console.log(emp.getInfo());// 1,Mary

引用方式二

第二种就是把原来的成员重新命名，
用新的命名来做使用，
重新命名的方式就是在原来的成员名称後加上as後面再接新的命名。

import { Employee as newEmployee } from "./export";

//使用
let emp = new newEmployee(1, "Mary");
console.log(emp.getInfo());// 1,Mary

引用方式三

第三种方式就是不管汇出的成员有多少，
总之全部都引用，
那就在import与from之间写上 * as all，
就会得到所有的汇出成员。

import * as all from "./export";

//使用
let emp = new all.Employee(1, "Mary");
console.log(emp.getInfo());
console.log(all.projectName);

模组预设汇出项目(Default Export)

每个模组可以选择性的汇出一个预设项目。
可以利用default关键字设定模组预设汇出项目(Default Exports)，
适用於模组中只汇出一个项目时，
且一个模组只有一个预设汇出项目。

让我们看看范例吧。
首先跟之前一样，
先建立一个档案，
汇出档案名称为export.ts，
程序码内容如下，

export default class Employee {
    constructor(public empId: number, public empName: string) {
    }
    getInfo() {
        return ` ${this.empId} , ${this.empName} `;
    }
}
export let projectName = "HR Management";

要引用预设汇出的项目成员用法也有些不同，

import Employee, { projectName } from "./export";

//使用
let emp = new Employee(1, "Mary");
console.log(emp.getInfo());// 1,Mary
console.log(projectName);// HR Management

引用预设汇出的项目成员不需要用 **{}**将名称刮起来，
直接打上名称就可以引用了。

今日结语

今天是铁人的第三十天，
希望大家都有了解并懂得使用这些TypeScript(TS)，
TS还有很多很多东西可以玩的，
我只能说读完这三十天只能算是基础吧，
最後，
就算结束了铁人赛，
大家依然还是要加油啦~
加油加油!