【TypeScript系列】命名空间和模块

命名空间和模块

关于术语的一点说明: 请务必注意一点,TypeScript 1.5里术语名已经发生了变化。 “内部模块”现在称做“命名空间”。 “外部模块”现在则简称为“模块”,这是为了与ECMAScript 2015里的术语保持一致,(也就是说 module X { 相当于现在推荐的写法 namespace X {)。

介绍

这篇文章将概括介绍在TypeScript里使用模块与命名空间来组织代码的方法。 我们也会谈及命名空间和模块的高级使用场景,和在使用它们的过程中常见的陷阱。

查看模块章节了解关于模块的更多信息。 查看命名空间章节了解关于命名空间的更多信息。

使用命名空间

命名空间是位于全局命名空间下的一个普通的带有名字的JavaScript对象。 这令命名空间十分容易使用。 它们可以在多文件中同时使用,并通过--outFile结合在一起。 命名空间是帮你组织Web应用不错的方式,你可以把所有依赖都放在HTML页面的<script>标签里。

但就像其它的全局命名空间污染一样,它很难去识别组件之间的依赖关系,尤其是在大型的应用中。

使用模块

像命名空间一样,模块可以包含代码和声明。 不同的是模块可以_声明_它的依赖。

模块会把依赖添加到模块加载器上(例如CommonJs / Require.js)。 对于小型的JS应用来说可能没必要,但是对于大型应用,这一点点的花费会带来长久的模块化和可维护性上的便利。 模块也提供了更好的代码重用,更强的封闭性以及更好的使用工具进行优化。

对于Node.js应用来说,模块是默认并推荐的组织代码的方式。

从ECMAScript 2015开始,模块成为了语言内置的部分,应该会被所有正常的解释引擎所支持。 因此,对于新项目来说推荐使用模块做为组织代码的方式。

命名空间和模块的陷阱

这部分我们会描述常见的命名空间和模块的使用陷阱和如何去避免它们。

对模块使用/// <reference>

一个常见的错误是使用/// <reference>引用模块文件,应该使用import。 要理解这之间的区别,我们首先应该弄清编译器是如何根据import路径(例如,import x from "...";import x = require("...")里面的...,等等)来定位模块的类型信息的。

编译器首先尝试去查找相应路径下的.ts.tsx再或者.d.ts。 如果这些文件都找不到,编译器会查找_外部模块声明_。 回想一下,它们是在.d.ts文件里声明的。

  • myModules.d.ts
// In a .d.ts file or .ts file that is not a module:
declare module "SomeModule" {export function fn(): string;
}
  • myOtherModule.ts
/// <reference path="myModules.d.ts" />
import * as m from "SomeModule";

这里的引用标签指定了外来模块的位置。 这就是一些TypeScript例子中引用node.d.ts的方法。

不必要的命名空间

如果你想把命名空间转换为模块,它可能会像下面这个文件:

  • shapes.ts
export namespace Shapes {export class Triangle { /* ... */ }export class Square { /* ... */ }
}

顶层的模块Shapes包裹了TriangleSquare。 对于使用它的人来说这是令人迷惑和讨厌的:

  • shapeConsumer.ts
import * as shapes from "./shapes";
let t = new shapes.Shapes.Triangle(); // shapes.Shapes?

TypeScript里模块的一个特点是不同的模块永远也不会在相同的作用域内使用相同的名字。 因为使用模块的人会为它们命名,所以完全没有必要把导出的符号包裹在一个命名空间里。

再次重申,不应该对模块使用命名空间,使用命名空间是为了提供逻辑分组和避免命名冲突。 模块文件本身已经是一个逻辑分组,并且它的名字是由导入这个模块的代码指定,所以没有必要为导出的对象增加额外的模块层。

下面是改进的例子:

  • shapes.ts
export class Triangle { /* ... */ }
export class Square { /* ... */ }
  • shapeConsumer.ts
import * as shapes from "./shapes";
let t = new shapes.Triangle();

模块的取舍

就像每个JS文件对应一个模块一样,TypeScript里模块文件与生成的JS文件也是一一对应的。 这会产生一种影响,根据你指定的目标模块系统的不同,你可能无法连接多个模块源文件。 例如当目标模块系统为commonjsumd时,无法使用outFile选项,但是在TypeScript 1.8以上的版本能够使用outFile当目标为amdsystem

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

系统分析师(软考)知识点整理——进程管理

操作系统 概念 操作系统是控制和管理计算机软硬件资源&#xff0c;以尽可能合理、有效的方法组织多个用户共享多种资源的程序集合 作用 通过资源管理提高计算机系统的效率改善人际界面面向用户提供友好的工作环境 特征 并发性共享性虚拟性不确定性 进程管理 概念 进程…

【办公类-22-15】周计划系列(5-6)“周计划-06 周计划打印pdf(docx删除内容转PDF)“ (2024年调整版本)

作品展示 背景需求&#xff1a; 前期用docx&#xff08;删除第一页反思部分内容&#xff09;转PDF转png&#xff08;第一页&#xff09;的方式获得上传网页用的图片。 【办公类-22-14】周计划系列&#xff08;5-5&#xff09;“周计划-05 上传周计划png&#xff08;docx转PDF…

【MLLM+轻量多模态模型】24.02.Bunny-v1.0-2B-zh: 轻量级多模态语言模型 (效果一般)

24.02 北京人工智能研究院&#xff08;BAAI&#xff09;提出以数据为中心的轻量级多模态模型 arxiv论文&#xff1a;2402.Efficient Multimodal Learning from Data-centric Perspective 代码&#xff1a;https://github.com/BAAI-DCAI/Bunny 在线运行&#xff1a;https://wis…

uniapp顶部状态栏设置(适配刘海屏)

方案一、占位 最顶部放一个高度为“var(--status-bar-height)”的div <template><view><view class"status_bar"><!-- 这里是状态栏 --></view><view> 状态栏下的文字 </view></view> </template> <…

前端调用接口地址跨越问题,nginx配置处理

在nginx配置里面添加add_header如下&#xff1a; add_header Access-Control-Allow-Origin *; #add_header Access-Control-Allow-Origin http://localhost:8080 always; add_header Access-Control-Allow-Methods GET, POST, PUT, D…

[Java、Android面试]_09_Synchronized、volatile、Lock并发

本人今年参加了很多面试&#xff0c;也有幸拿到了一些大厂的offer&#xff0c;整理了众多面试资料&#xff0c;后续还会分享众多面试资料。 整理成了面试系列&#xff0c;由于时间有限&#xff0c;每天整理一点&#xff0c;后续会陆续分享出来&#xff0c;感兴趣的朋友可关注收…

Qt拖放文件实现(Drag,Drop, MimeData )

1 背景 本文讲述了基于Qt实现文件拖放操作。拖放操作至少需要两个窗口&#xff0c;一个作为拖放源窗口&#xff0c;另一个作为拖放目标窗口。 2 实现 这里从QTreeView派生一个类TreeView&#xff0c;处理鼠标开始拖放操作及拖放事件。这个类既是拖放源窗口也是拖放目标窗口。…

自上而下的角色扮演游戏资产包幻想梦境

Fantasy Dreamland 是一個完整的資源包,包含開始製作自上而下的像素藝術遊戲所需的一切! 幻想夢境瓷磚套裝: - 超過 13,000 塊瓷磚! - 超過 500 個動畫圖塊! - 鐵匠! - 城堡! - 洞穴! - 聖誕節! (裝飾) - 城市! - 沙漠! - 沙漠房屋! - 夢想/天空! - …

【解决】使用Jekyll框架进入网页终端返回找不到.min.js或者类似Rollup模块化构建js失败问题

写在前面&#xff1a; 如果文章对你有帮助&#xff0c;记得点赞关注加收藏一波&#xff0c;利于以后需要的时候复习&#xff0c;多谢支持&#xff01; 文章目录 一、问题表现二、问题解决&#xff08;一&#xff09;检查输出目录&#xff08;二&#xff09;启动Rollup构建 三、…

PCD1000AE单通道高压线性恒流LED控制芯片

概述 PCD1000AE 是一款线性恒流 IC&#xff0c;输出电流可调&#xff0c;恒流精度高&#xff0c;应用方案简单&#xff0c;成本和阻容降压相当&#xff0c;具有过温保护功能&#xff0c;更安全&#xff0c;更可靠。 特点 输出电流可调 5mA-60mA&#xff0c; 恒流精度可以达…

【C++】vector容器初步模拟

送给大家一句话&#xff1a; 努力一点&#xff0c;漂亮—点&#xff0c;阳光一点。早晚有一天&#xff0c;你会惊艳了时光&#xff0c;既无人能替&#xff0c;又光芒万丈。 vector容器初步模拟 1 认识vector开始了解底层实现 2 开始实现成员变量构造函数 析构函数尾插迭代器插入…

【漏洞复现】福建科立迅通信指挥调度平台down_file.php sql注入漏洞

漏洞描述 福建科立迅通信调度平台 20240318 以及之前版本存在一个严重漏洞,影响了文件 api/client/down_file.php 的一个未知功能。攻击者可以通过操纵参数 uuid 发起 SQL 注入攻击。攻击者可以远程发起攻击。 免责声明 技术文章仅供参考,任何个人和组织使用网络应当遵守…

GraalVM详细安装及打包springboot、java、javafx使用教程(打包springboot2篇)

前言 在当前多元化开发环境下&#xff0c;Java作为一种广泛应用的编程语言&#xff0c;其应用部署效率与灵活性的重要性日益凸显。Spring Boot框架以其简洁的配置和强大的功能深受开发者喜爱&#xff0c;而JavaFX则为开发者提供了构建丰富桌面客户端应用的能力。然而&#xff…

基于Java中的SSM框架实现图书仓储管理系统项目【项目源码+论文说明】

基于Java中的SSM框架实现图书仓储管理系统演示 摘要 随着社会经济的迅速发展和科学技术的全面进步&#xff0c;计算机事业的飞速发展&#xff0c;以计算机与通信技术为基础的信息系统正处于蓬勃发展的时期&#xff0c;随着经济文化水平的显著提高&#xff0c;人们对生活质量及…

3.idea的import和open的区别

1.推荐open的情况&#xff1a;如果项目里面有.idea,推荐Open打开。 2.推荐import的情况&#xff1a;如果项目里面没有.idea,推荐import打开。但是新版idea改了import的地方&#xff0c;在File—>New—>Select directory with existing sources。 3.导入项目的情况&#x…

【视频图像取证篇】模糊图像增强技术之锐化类滤波场景应用小结

【视频图像取证篇】模糊图像增强技术之锐化类滤波场景应用小结 模糊图像增强技术之锐化类滤波场景应用小结—【蘇小沐】 &#xff08;一&#xff09;锐化类滤波器 模糊消除类滤波器&#xff08;Remove blur / Unsharpness&#xff09;。 通用去模糊滤波器&#xff1a;针对大…

(ROOT)KAFKA详解

生产篇 使用 /** Licensed to the Apache Software Foundation (ASF) under one or more* contributor license agreements. See the NOTICE file distributed with* this work for additional information regarding copyright ownership.* The ASF licenses this file to Y…

#Linux(环境变量)

&#xff08;一&#xff09;发行版&#xff1a;Ubuntu16.04.7 &#xff08;二&#xff09;记录&#xff1a; &#xff08;1&#xff09;查看环境变量 &#xff08;2&#xff09;修改环境变量 第一种方法&#xff1a;直接使用命令设置&#xff08;立即生效&#xff0c;只会作用…

了解交换机上的SFP和QSFP端口

在当今互联的世界中&#xff0c;可靠、高效的网络通信对于企业的蓬勃发展至关重要。为了实现顺畅的连接&#xff0c;了解能够实现该目标的技术非常重要。其中一项关键技术是交换机上的SFP和QSFP端口。本文将简要介绍这些概念&#xff0c;定义并解释交换机SFP端口和QSFP端口的优…

50道JAVA基础算法编程题【内含分析、程序答案】

【程序1】 题目&#xff1a;古典问题&#xff1a;有一对兔子&#xff0c;从出生后第3个月起每个月都生一对兔子&#xff0c;小兔子长到第三个月后每个月又生一对兔子&#xff0c;假如兔子都不死&#xff0c;问每个月的兔子总数为多少&#xff1f; 程序分析&#xff1a; 兔子的…