鸿蒙TypeScript学习第19天【命名空间】

news2024/11/24 17:15:56

1、TypeScript 命名空间

命名空间一个最明确的目的就是解决重名问题。

假设这样一种情况,当一个班上有两个名叫小明的学生时,为了明确区分它们,我们在使用名字之外,不得不使用一些额外的信息,比如他们的姓(王小明,李小明),或者他们父母的名字等等。

命名空间定义了标识符的可见范围,一个标识符可在多个命名空间中定义,它在不同命名空间中的含义是互不相干的。这样,在一个新的命名空间中可定义任何标识符,它们不会与任何已有的标识符发生冲突,因为已有的定义都处于其他命名空间中。

TypeScript 中命名空间使用 namespace 来定义,语法格式如下:

namespace SomeNameSpaceName { 
   export interface ISomeInterfaceName {      }  
   export class SomeClassName {      }  
}复制

以上定义了一个命名空间 SomeNameSpaceName,如果我们需要在外部可以调用 SomeNameSpaceName 中的类和接口,则需要在类和接口添加 export 关键字。

要在另外一个命名空间调用语法格式为:

SomeNameSpaceName.SomeClassName;

如果一个命名空间在一个单独的 TypeScript 文件中,则应使用三斜杠 /// 引用它,语法格式如下:

/// <reference path = "SomeFileName.ts" />

以下实例演示了命名空间的使用,定义在不同文件中:qr23.cn/AKFP8k点击或复制转到。

搜狗高速浏览器截图20240326151547.png

IShape.ts 文件代码:

HarmonyOS与OpenHarmony开发文档+mau123789是v直接拿取

namespace Drawing { 
    export interface IShape { 
        draw(); 
    }
}复制

Circle.ts 文件代码:

/// <reference path = "IShape.ts" /> 
namespace Drawing { 
    export class Circle implements IShape { 
        public draw() { 
            console.log("Circle is drawn"); 
        }  
    }
}复制

Triangle.ts 文件代码:

/// <reference path = "IShape.ts" /> 
namespace Drawing { 
    export class Triangle implements IShape { 
        public draw() { 
            console.log("Triangle is drawn"); 
        } 
    } 
}复制

TestShape.ts 文件代码:

/// <reference path = "IShape.ts" />   
/// <reference path = "Circle.ts" /> 
/// <reference path = "Triangle.ts" />  
function drawAllShapes(shape:Drawing.IShape) { 
    shape.draw(); 
} 
drawAllShapes(new Drawing.Circle());
drawAllShapes(new Drawing.Triangle());复制

使用 tsc 命令编译以上代码:

tsc --out app.js TestShape.ts  

得到以下 JavaScript 代码:

JavaScript

/// <reference path = "IShape.ts" /> 
var Drawing;
(function (Drawing) {
    var Circle = /** @class */ (function () {
        function Circle() {
        }
        Circle.prototype.draw = function () {
            console.log("Circle is drawn");
        };
        return Circle;
    }());
    Drawing.Circle = Circle;
})(Drawing || (Drawing = {}));
/// <reference path = "IShape.ts" /> 
var Drawing;
(function (Drawing) {
    var Triangle = /** @class */ (function () {
        function Triangle() {
        }
        Triangle.prototype.draw = function () {
            console.log("Triangle is drawn");
        };
        return Triangle;
    }());
    Drawing.Triangle = Triangle;
})(Drawing || (Drawing = {}));
/// <reference path = "IShape.ts" />   
/// <reference path = "Circle.ts" /> 
/// <reference path = "Triangle.ts" />  
function drawAllShapes(shape) {
    shape.draw();
}
drawAllShapes(new Drawing.Circle());
drawAllShapes(new Drawing.Triangle());复制

使用 node 命令查看输出结果为:

$ node app.js
Circle is drawn
Triangle is drawn

2、嵌套命名空间

命名空间支持嵌套,即你可以将命名空间定义在另外一个命名空间里头。

namespace namespace_name1 { 
    export namespace namespace_name2 {
        export class class_name {    } 
    } 
}复制

成员的访问使用点号 . 来实现,如下实例:

Invoice.ts 文件代码:

namespace Runoob { 
   export namespace invoiceApp { 
      export class Invoice { 
         public calculateDiscount(price: number) { 
            return price * .40; 
         } 
      } 
   } 
}复制

InvoiceTest.ts 文件代码:

/// <reference path = "Invoice.ts" />
var invoice = new Runoob.invoiceApp.Invoice(); 
console.log(invoice.calculateDiscount(500));复制

使用 tsc 命令编译以上代码:

tsc --out app.js InvoiceTest.ts

得到以下 JavaScript 代码:

JavaScript

var Runoob;
(function (Runoob) {
    var invoiceApp;
    (function (invoiceApp) {
        var Invoice = /** @class */ (function () {
            function Invoice() {
            }
            Invoice.prototype.calculateDiscount = function (price) {
                return price * .40;
            };
            return Invoice;
        }());
        invoiceApp.Invoice = Invoice;
    })(invoiceApp = Runoob.invoiceApp || (Runoob.invoiceApp = {}));
})(Runoob || (Runoob = {}));
/// <reference path = "Invoice.ts" />
var invoice = new Runoob.invoiceApp.Invoice();
console.log(invoice.calculateDiscount(500));复制

使用 node 命令查看输出结果为:

$ node app.js
200

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

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

相关文章

.netcore+vue新生分班系统的设计与实现

.netcore vue新生分班系统的设计与实现说明文档 运行前附加数据库.mdf&#xff08;或sql生成数据库&#xff09; 主要技术&#xff1a; 基于.net core架构和mysql数据库vue 东北石油大学新生分班系统的设计与实现 功能模块&#xff1a; 登录 注册学生 忘记密码 系统首顶 个…

【电控笔记3.5】三相逆变器

基础 大小调变指标ma 频率调变指标mf 载波频率:pwm频率

PHP校验15位和18位身份证号

第十八位数字的计算方法为&#xff1a; 1.将前面的身份证号码17位数分别乘以不同的系数。从第一位到第十七位的系数分 别为&#xff1a;7 9 10 5 8 4 2 1 6 3 7 9 10 5 8 4 2 2.将这17位数字和系数相乘的结果相加。 3.用加出来和除以11&#xff0c;看余数是多少&#xff1f; 4…

遇事不决 量子力学?

文章目录 引入量子力学产生的必然性量子力学名称的由来粒子&#xff1f;波&#xff1f;波粒二象性测不准原理 &#xff08;不确定原理&#xff09;叠加态原理 量子纠缠态叠加量子纠缠量子纠缠实验 逻辑判断&#xff0c;量子力学到底完善吗观测量子纠缠&#xff1f;那我们宏观世…

AUS Global 与皇家贝蒂斯俱乐部在对战皇家马德里的比赛日举办现场体验活动

AUS Global 最近前往西班牙庆祝与皇家贝蒂斯的赞助合作&#xff0c;并获得了难忘的比赛日体验&#xff0c;包括在贵宾室中观看皇家贝蒂斯对阵皇家马德里的精彩比赛。 活动开始时&#xff0c;AUS Global 受邀来到皇家贝蒂斯主场贝尼托-比利亚马林体育场的独家 Showbox 贵宾室。…

vue3 源码解析(7)— diff 算法源码的实现

前言 vue3 采用的 diff 算法名为快速 diff 算法&#xff0c;整个 diff 的过程分为以下5个阶段完成。 处理前置节点处理后置节点处理仅有新增节点处理仅有删除节点处理其他情况&#xff08;新增 / 卸载 / 移动&#xff09; 这里我们先定义新旧两个节点列表&#xff0c;接下来…

4款免费又好用的AI工具!很难相信!

人工智能&#xff08;AI&#xff09;已经成为我们生活和工作中不可或缺的一部分。但是&#xff0c;一提到AI工具&#xff0c;你可能首先会想到的是高昂的价格和复杂的操作。 今天&#xff0c;君君就要打破这一刻板印象&#xff0c;带你认识4个AI工具&#xff0c;它们不仅功能强…

《QT实用小工具·二十七》各种炫酷的样式表

1、概述 源码放在文章末尾 该项目实现了各种炫酷的样式表&#xff0c;如单选、多选、按钮、日历、表格、下拉框、滚轮等&#xff0c;下面是项目demo演示&#xff1a; 项目部分代码如下&#xff1a; #include "frmmain.h" #include "ui_frmmain.h" #inc…

数仓建模—数据架构

数仓—数据架构 为了在企业决策中使用数据,数据必须经过整个数据平台的各个阶段。整个过程是什么样子的,从开始到结束?原始形式的数据是如何转化为可导致商业决策的见解的?这些问题可以通过数据架构来回答。 数据架构是指记录组织所有数据资产的模型、规则和标准。它映射…

Zephyr Windows开发环境搭建

Zephyr 如果有错误或未及时更新&#xff0c;请以官网文档为主 官网&#xff1a;https://docs.zephyrproject.org/latest/develop/getting_started/index.htm 下载安装 Chocolatey 这是一个类似于在Linux系统下 yum 和 apt 那样的包管理器 官网&#xff1a;https://chocolat…

平衡车设计——硬件篇

在本文开始之前我忍不住想吐槽一个事情&#xff0c;就在前两天晚上&#xff0c;我满意地装完平衡车&#xff0c;给他取了个名字叫瓦力&#xff08;没错&#xff0c;就是机器人总动员里的瓦力&#xff09;&#xff0c;他长这个样子。 把他放到桌子上放了一夜&#xff0c;第二天早…

【vue】Pinia-2 安装Pinia,使用store

1. 安装Pinia 在项目路径下执行npm install pinia 在package.json中查看 2. 使用store 在main.js中添加 import { createPinia } from pinia const pinia createPinia()修改createApp方法 最后示例如下&#xff08;三处修改&#xff09; import { createApp } from vue //…

Jmeter接口测试:使用教程(下)

&#x1f345; 视频学习&#xff1a;文末有免费的配套视频可观看 &#x1f345; 关注公众号&#xff1a;互联网杂货铺&#xff0c;回复1 &#xff0c;免费获取软件测试全套资料&#xff0c;资料在手&#xff0c;涨薪更快 上一篇我给大家讲了jmeter的基本介绍跟参数化和jmeter脚…

【开发者召集】BIMBase插件开发大赛火热报名中!| python开发 | python建模 | 二次开发 | 图形引擎 | 几何引擎

&#x1f4e2; 致所有热爱创新的技术大咖们&#xff1a; 让我们回顾一下&#xff0c;在之前的推文中&#xff0c;我们收集了各种各样的BIM插件命题~ 小伙伴们的热情让小编倍感振奋~ 因为&#xff0c;每一个命题都蕴藏着解决实际问题的潜力&#xff0c;每一个也都代表着创新的可…

工业级POE交换机的ACL

工业级POE交换机通常支持访问控制列表&#xff08;Access Control List&#xff0c;ACL&#xff09;功能&#xff0c;用于实施网络安全策略。ACL可以根据源IP地址、目标IP地址、传输协议、端口号等条件来过滤和控制网络流量。 通过配置ACL&#xff0c;可以实现以下功能&#xf…

Docker 磁盘占用过多问题处理过程记录

一、问题描述 突然发现服务器磁盘使用超过95%了&#xff08;截图时2.1 和 2.2 已经执行过了&#xff09; 二、问题分析与解决 2.1&#xff0c;docker 无用镜像占用磁盘 # 使用 docker images 查看服务的镜像 docker images# 可以手动删除一些很大不用的 docker rmi ***## 也…

【C语言】字符函数和字符串函数,详解,进来就会!

&#x1f525;博客主页&#x1f525;&#xff1a;【 坊钰_CSDN博客 】 欢迎各位点赞&#x1f44d;评论✍收藏⭐ 目录 1. 字符分类函数 2. 字符转换函数 3. strlen的使⽤和模拟实现 3.1 采用指针-指针方式 3.2 采用递归方式 3.3 采用计数器方式 4. strcpy的使⽤和模拟实现 …

如何在本地创建一个贪吃蛇小游戏node.js服务并实现无公网IP远程游玩

文章目录 前言1.安装Node.js环境2.创建node.js服务3. 访问node.js 服务4.内网穿透4.1 安装配置cpolar内网穿透4.2 创建隧道映射本地端口 5.固定公网地址 正文开始前给大家推荐个网站&#xff0c;前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽…

荔枝派LicheePi 4A RISCV板子支持的好玩的AI模型

荔枝派LicheePi 4A 是基于 Lichee Module 4A 核心板的 高性能 RISC-V Linux 开发板&#xff0c;以 TH1520 为主控核心&#xff08;4xC9101.85G&#xff0c; RV64GCV&#xff0c;4TOPSint8 NPU&#xff0c; 50GFLOP GPU&#xff09;&#xff0c;板载最大 16GB 64bit LPDDR4X&…

mysql查看数据库表容量大小

【推荐】单表行数超过 500 万行或者单表容量超过 2GB&#xff0c;才推荐进行分库分表。 说明&#xff1a;如果预计三年后的数据量根本达不到这个级别&#xff0c;请不要在创建表时就分库分表。 1. 查询所有数据库记录数和容量 SELECTtable_schema AS 数据库,SUM(table_rows) …