ts：模块导入、导出的简单使用（export、import）

一、主要内容说明

对于一个项目来说，一般不同的功能都可分为不同的模块，然后让人分工完成。举例如下：

不同功能可分为多个模块，每个模块有不同的功能，每个模块都各有它的开发人员，每个开发人员都可在不同的地方设置开发。本文中，使用的是es6模块导入方式。另外的还有commonjs模块导入方式，以及其他方式。后面根据需要再另起博文。当然导入方式虽不同，但运行原理却是相似的。

二、流程图

三、例子

我们使用import导入、export导出的用法，简单的体验一下模块的导入和导出。根据以上流程图，在控制台目录下，另外创建三个文件夹，用以代表三个不同的位置。

• 第一个文件夹，设置接口文件，我们把它当作一个终端。
• 第二个文件，表示菜园区域。
• 第三个文件，表示果园区域。

我们通过控制台，连接终端、菜园、果园，控制则菜园和果园的内容。

（一）、控制台（控制台.ts）

这里用于连接终端，然后使用终端的mes_way方法控制菜园、果园的功能输出。

源码文件1 ----- 控制台.ts

import { zhong_duan } from "./day001/zhong_duan"; // 导入接口 zhong_duan
import { Cy } from "./day002/chai_yuan"; // 导入类 Cy
import { Gy } from "./day003/guo_yuan"; // 导入类 Gy

// 定义一个函数 Message，接受 zhong_duan 类型的参数
function Message(mes: zhong_duan) {
    mes.mes_way(); // 调用 mes_way 方法
}

// 创建 Cy 和 Gy 的实例，并传入 Message 函数
Message(new Cy());
Message(new Gy());

（二）、终端（zhong_duan.ts）

终端建立一个接口类型的zhong_duan，里面创建有方法mes_way()。菜园和果园会基于这个方法，各自实现不同的功能。终端这边更像是模块的中转站，这也是为啥叫他接口文件。

源码文件2 ----- zhong_duan.ts

// 定义接口 zhong_duan，包含一个方法 mes_way
export interface zhong_duan {
    mes_way(): void; // 添加返回类型 void
}

（三）、菜园（chai_yuan.ts）

菜园模块的内容，基于终端接口的mes_way方法，设置输出内容。

源码文件3 ----- chai_yuan.ts

import { zhong_duan } from "../day001/zhong_duan"; // 导入接口 zhong_duan

// 实现接口 zhong_duan 的类 Cy
export class Cy implements zhong_duan {
    public mes_way() {
        console.log("这里是菜园！！！"); // 实现 mes_way 方法
    }
}

（四）、果园（guo_yuan.ts）

果园模块的内容，基于终端接口的mes_way方法，设置输出内容。

源码文件4 ----- guo_yuan.ts

import { zhong_duan } from "../day001/zhong_duan"; // 导入接口 zhong_duan

// 实现接口 zhong_duan 的类 Gy
export class Gy implements zhong_duan {
    public mes_way() {
        console.log("这里是果园！！！"); // 实现 mes_way 方法
    }
}

（五）、源码文件1 ----- 控制台.ts 的运行效果

四、结语

对于上边举的例子，在一个项目下，终端也可以设置多种方法，而对于果园一类的模块，也可以对终端的各种方法有不同的输出逻辑模式。我们只是最简单的设置一个方法，然后对方法简单的输出文字信息。在此基础上，项目本身是可以设置很多模块，模块又可单独设置多个应用方法的。
当然，产品项目最大的目的是为了改变我们的生活，简单、复杂语法是次要的。
除了导入自己创建的模块，也可以下载导入其他应用模块。如若想设置一个爬虫程序，则需导入相关的模块，如下：

• import superagent from "superagent"; 导入superagent用于发送HTTP请求
• import * as cheerio from "cheerio"; 导入cheerio用于解析HTML。
• import fs from "fs"; 导入fs用于文件操作

对于ts内容的代码，测试运行笔者是使用vscode工具的，则想运行ts文件，则需导入相关的环境变量，就比如要对应目录下配置下载好tsconfig.json文件，才可以正常运行ts的文件。
harmony软件开发的，ts语言是个过渡基础，后面用得多的还是arkTS。当然语言是很多内容是相通的，学好一门再换一门也很容易了。
由于笔者的能力有限，创作的内容有所不足在所难免，也敬请读者包涵和指出，万分感谢！

六、定位日期

流程图部分完成，源码调试完成未写入，明天继续。
2024-10-30；
23：48；

2024-10-31；
12:29；