typescript 模块化

模块的概念:

把一些公共的功能单独抽离成一个文件作为一个模块。

模块里面的变量、函数、类等默认是私有的,如果我们要在外部访问模块里面的数据(变量、函数、类),需要通过export暴露模块里面的数据((变量、函数、类...)

暴露后我们通过 import 引入模块就可以使用模块里面暴露的数据

db.ts

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> {
    add(info: T): boolean {
        console.log(info, 'MysqlDb');
        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[] {
        throw new Error("Method not implemented.");
    }
}
// 定义一个操作mssql数据库的类
export class MsSqlDb<T> implements DBI<T> {
    constructor() {
        console.log('数据库建立连接');
    }
    add(info: T): boolean {
        console.log(info, 'MsSqlDb');
        return true
        throw new Error("Method not implemented.");
    }
    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: '',
                desc: ''
            }
        ]
        return list
        throw new Error("Method not implemented.");
    }
}

user.ts

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

// 操作用户表 定义一个User类和数据库表做映射
class UserClass {
    username: string | undefined;
    password: string | undefined
}

var UserModel = new MsSqlDb<UserClass>();
export {
    UserClass,
    UserModel
}

article.ts

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

// 操作用户表 定义一个User类和数据库表做映射
class ArticleClass {
    username: string | undefined;
    password: string | undefined
}

var ArticleModel = new MsSqlDb<ArticleClass>();
export {
    ArticleClass,
    ArticleModel
}

index.ts

import { UserModel, UserClass } from './module/user.js'
import { ArticleModel, ArticleClass } from './module/article.js'


// 增加数据
var u = new UserClass()
u.username = '用户名'
u.password = '密码'
UserModel.add(u)

// 获取数据
console.log(UserModel.get(1));

// 文章表
console.log(ArticleModel.get(1));

如果引入有错误,

Warning: To load an ES module, set “type“: “module“ in the package.json or use the .mjs extension.

在当前目录下 npm init 生成 package.json 文件,添加 "type": "module"

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/602262.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

深度解读《深度探索C++对象模型》之C++的临时对象(二)

目录 临时对象的生命期 特殊的情况 接下来我将持续更新“深度解读《深度探索C对象模型》”系列&#xff0c;敬请期待&#xff0c;欢迎左下角点击关注&#xff01;也可以关注公众号&#xff1a;iShare爱分享&#xff0c;或文章末尾扫描二维码&#xff0c;自动获得推文和全部的…

51单片机keil编程中遇到的问题(持续更新)

字符无法打印报错 查看特殊功能寄存器名字的时候也会报错&#xff0c;因为无法编译通过&#xff0c;导致头文件的定义内容无法查找 keil编译中 error C127: ‘xx’: invalid storage class 这种一般是在编写头文件或源文件时&#xff0c;在声明函数的结尾没有添加分号&…

C++——list和string

list与string 前言一、listlist.hList的节点类List的迭代器类list类list.h 完整实现 list.cppList的节点类List的迭代器类list类list.cpp 完整实现 二、stringstring.hstring.cpp 总结 前言 C容器的学习开始啦&#xff01; 大家先来学习list&#xff01; 紧接着string和vector…

PGP加密技术:保护信息安全的利器

随着数字化时代的到来&#xff0c;个人和企业对信息安全的需求日益增长。PGP&#xff08;Pretty Good Privacy&#xff09;加密技术作为一项强大的加密工具&#xff0c;为保护敏感数据提供了一种有效的方法。本文将探讨PGP加密技术的基本原理、应用场景以及其在现代信息安全中的…

LeetCode:盛最多水的容器

文章收录于LeetCode专栏 盛最多水的容器 给你n个非负整数a1&#xff0c;a2&#xff0c;…&#xff0c;an&#xff0c;每个数代表坐标中的一个点(i, ai) 。在坐标内画 n 条垂直线&#xff0c;垂直线i的两个端点分别为(i, ai) 和 (i, 0)。找出其中的两条线&#xff0c;使得它们与…

如何实现网页上3D模型的展示、浏览和互动?

实现网页上3D模型的展示、浏览和互动&#xff0c;可以通过以下步骤进行&#xff1a; 1、创建3D内容&#xff1a;使用3ds max、Maya、blender、C4D等3D软件制作好3D模型。 2、设计3D应用&#xff1a;把制作好的模型导出为fbx、obj、dae、gltf、glb等格式文件&#xff0c;上传到…

不盖CNAS的证书就是无效的?证书哪些信息是“非必要”?

做设备校准的企业&#xff0c;大多数都是为了拿到仪器校准证书&#xff0c;而说起校准证书&#xff0c;很多人优先就是想到CNAS&#xff0c;CNAS作为校准行业重要的核心资质&#xff0c;无论是校准机构实力的证明&#xff0c;还是满足企业年审的需要&#xff0c;基本上都是关键…

Spring Security Oauth2 JWT 添加额外信息

目录 一、问题描述 二、实现步骤 1、自定义TokenEnhancer 2、配置授权服务器 3、自定义UserDetails的User类 三、参考文档 一、问题描述 Oauth2里默认生成的JWT信息并没有用户信息&#xff0c;在认证授权后一般会返回这一部分信息&#xff0c;我对此进行了改造。 Oauth…

大数据集成平台建设方案-word原件资料

基础支撑平台主要承担系统总体架构与各个应用子系统的交互&#xff0c;第三方系统与总体架构的交互。需要满足内部业务在该平台的基础上&#xff0c;实现平台对于子系统的可扩展性。基于以上分析对基础支撑平台&#xff0c;提出了以下要求&#xff1a; (1) 基于平台的基础架构&…

短视频矩阵系统源码/saas--总后台端、商户端、代理端、源头开发

短视频矩阵系统源码/saas--总后台端、商户端、代理端、源头开发 搭建短视频矩阵系统源码的交付步骤可以概括为以下几个关键环节&#xff1a; 1. **系统需求分析**&#xff1a;明确系统需要支持的功能&#xff0c;如短视频的上传、存储、播放、分享、评论、点赞等。 2. **技术选…

MySQL —— 数据类型

一、数值类型 以上表格整理了用来表示数值类型的数据类型&#xff0c;其中&#xff0c;接下来将介绍和展示其中几个类型的使用和各种细节 1.tinyint 越界测试&#xff1a;建立一个包含tinyint类型的表格&#xff0c;插入各中数据去查看结果&#xff0c;并且尝试插入边界数据和…

数字人捕捉、建模与合成

在感知系统中&#xff0c;我们与外部合作者一起创建逼真的 3D 人类&#xff0c;其行为可以像虚拟世界中的真实人类一样。这项工作在今天有许多实际应用&#xff0c;并且对于元宇宙的未来至关重要。但是&#xff0c;在感知系统中&#xff0c;我们的目标是科学的——通过重现人类…

PS五官与服装PSD文件大全,男女证件照制作必备素材

一、素材描述 男女证件照服装和五官等PSD文件大全&#xff0c;制作证件照的必备素材合集&#xff0c;轻松制作高端大气的证件照。什么是DR5&#xff1f;DR5是Delicious Retouch 5的简称&#xff0c;这是一款非常优秀的PS人像磨皮美容插件&#xff0c;DR5的主要功能就是针对人像…

AI换脸原理(4)——人脸对齐(关键点检测)参考文献2DFAN:代码解析

注意,本文属于人脸关键点检测步骤的论文,虽然也在人脸对齐的范畴下。 1、介绍 在本文中,重点介绍了以下几项创新性的成果,旨在为人脸关键点检测领域带来新的突破。 首先,成功构建了一个卓越的2D人脸关键点检测基线模型。这一模型不仅集成了目前最优的关键点检测网络结构,…

领导想提拔你,看的从来不只是努力

谁不曾做过努力工作&#xff0c;一路升职加薪的职业规划&#xff0c;现实却给很多人泼了一盆冷水。 在大家的普遍认知里&#xff0c;北上广普遍高薪&#xff0c;月入过万就是标配。 然而在逃离北上广的热门帖子下&#xff0c;有网友发出了声音&#xff1a; “我都35了&#xff…

XSS、CSRF、SSRF漏洞原理以及防御方式_xss csrf ssrf

这里写目录标题 XSS XSS攻击原理&#xff1a;XSS的防范措施主要有三个&#xff1a;编码、过滤、校正 CSRF CSRF攻击攻击原理及过程如下&#xff1a;CSRF攻击的防范措施&#xff1a; SSRF SSRF漏洞攻击原理以及方式SSRF漏洞攻击的防范措施 XMLXSS、CSRF、SSRF的区别 XSS、CSRF的…

落地护眼灯十大品牌哪款性价比高?品牌排行榜前十名全面揭晓!

落地护眼灯十大品牌哪款性价比高&#xff1f;落地护眼灯已经逐渐成为孩子日常使用率较高的电器之一&#xff0c;它的优点非常突出&#xff0c;对于学习、工作、绘画等环境都能够提供良好的健康环境&#xff0c;同时还携带多种智能调节功能&#xff0c;例如&#xff1a;入座感应…

Android 启动提示Android 正在升级...提示源码分析

正常情况下烧录的新机会有这个提示&#xff0c;因为系统启动时候要对系统APP做DexOpt优化&#xff0c;流程如下&#xff1a; 进入performBootDexOpt函数&#xff1a; 提示框代码如下&#xff1a; 而提示框的Tile和Msg如下&#xff1a; 打印Log&#xff1a; 觉得本文对…

小项目“谈笑风生”测试报告

文章目录 一、项目介绍1.1项目背景1.2功能介绍 二、测试环境三、测试执行过程3.1功能测试3.1.1登录页面测试3.1.2注册页面测试3.1.3主页面测试 3.2界面自动化测试3.2.1登录模块测试3.2.2注册模块测试3.2.3展示各种信息模块测试3.2.34聊天消息传送模块测试 四、测试结论与建议 一…

Ubuntu软件中心不显示

装完Ubuntu后没有Software -- 更新apt sudo apt update -- 升级apt sudo apt upgrade -- 重启 sudo systemctl reboot-- 安装snap sudo apt-get install snap -- 安装软件商店 sudo snap install snap-store -- 更新软件商店 sudo snap refresh snap-store安装成功&#xff01…
最新文章