TypeScript 定义不同的类型(详细示例)

还是大剑师兰特:曾是美国某知名大学计算机专业研究生,现为航空航海领域高级前端工程师;CSDN知名博主,GIS领域优质创作者,深耕openlayers、leaflet、mapbox、cesium,canvas,webgl,echarts等技术开发,欢迎加底部微信(gis-dajianshi),一起交流。

No.内容链接
1Openlayers 【入门教程】 - 【源代码+示例300+】
2Leaflet 【入门教程】 - 【源代码+图文示例 150+】
3Cesium 【入门教程】 - 【源代码+图文示例200+】
4MapboxGL【入门教程】 - 【源代码+图文示例150+】
5前端就业宝典 【面试题+详细答案 1000+】

在这里插入图片描述

文章目录

      • 1. 基本类型
      • 2. 数组
      • 3. 元组 Tuple
      • 4. 枚举 Enum
      • 5. 对象类型
      • 6. 函数类型
      • 7. 类型别名 Type Alias
      • 8. 泛型 Generics
      • 9. 类 Class
      • 10. 接口 Interface


TypeScript 是 JavaScript 的一个超集,它增加了静态类型系统和一些额外的特性来帮助开发者编写可维护、可扩展的应用程序。在 TypeScript 中,你可以使用类型注解来指定变量、函数参数或返回值的类型。

下面我将通过一系列示例来展示如何在 TypeScript 中定义不同的类型:

1. 基本类型

基本类型的定义包括 stringnumberboolean 等。

let myName: string = "Alice";
let age: number = 30;
let isStudent: boolean = false;

2. 数组

数组可以定义为包含特定类型元素的列表。

let numbers: number[] = [1, 2, 3];
let fruits: string[] = ["apple", "banana"];
let truthValues: boolean[] = [true, false];

或者使用泛型数组形式:

let numbers: Array<number> = [1, 2, 3];

3. 元组 Tuple

元组允许表示一个已知元素数量和类型的数组。

let x: [string, number];
x = ["hello", 10]; // OK
// x = [10, "hello"]; // Error

4. 枚举 Enum

枚举类型为一组相关的名称提供了一种方便的方式来定义一个数值常量集合。

enum Color {Red, Green, Blue}
let c: Color = Color.Green;

5. 对象类型

对象类型可以通过接口(interface)或者类型别名(type alias)来定义。

interface Person {name: string;age?: number; // 可选属性
}type Product = {id: number;title: string;
};let person: Person = {name: "Alice"};
let product: Product = {id: 1, title: "Book"};

6. 函数类型

函数类型可以指定参数和返回值的类型。

function greet(person: string): string {return "Hello " + person;
}// 或者
const add = (a: number, b: number): number => {return a + b;
};

7. 类型别名 Type Alias

类型别名用于给一个类型起个新名字。

type Name = string;
type NameResolver = () => string;
type NameOrResolver = Name | NameResolver;function getName(n: NameOrResolver): Name {if (typeof n === 'string') return n;else return n();
}

8. 泛型 Generics

泛型允许创建重用性高的函数和类。

function identity<T>(arg: T): T {return arg;
}let output = identity<string>("myString");

9. 类 Class

类支持面向对象编程。

class Animal {name: string;constructor(name: string) {this.name = name;}
}let animal = new Animal("Cat");
console.log(animal.name); // 输出 "Cat"

10. 接口 Interface

接口描述了对象的形状。

interface LabelledValue {label: string;value: number;
}function printLabel(labelledObj: LabelledValue) {console.log(labelledObj.label);
}let myObj = {size: 10, label: "Size 10 Object"};
printLabel(myObj); // OK

这些示例覆盖了 TypeScript 中常见的类型定义方法。你可以根据自己的需求选择合适的类型定义方式。

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

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

相关文章

Vulnhub - JANGOW: 1.0.1 靶标实战

靶场地址&#xff1a;https://www.vulnhub.com/entry/jangow-101,754/ 靶场IP&#xff1a;192.168.56.118 信息收集 使用御剑对目标进行扫描 该靶标开启了21、80两个端口&#xff0c;21端口运行服务为ftp&#xff0c;其版本为 vsftpd 3.0.3 &#xff0c;80端口运行服务为Apa…

vscode+platformio开发小技巧

使用vscodeplatformio开发&#xff0c;具体安装配置文章很多&#xff0c;这里分享一些方便使用的小技巧&#xff0c;让使用体验在不增加学习成本的情况下更加丝滑。 1、配置依赖库 在使用vscode开发前&#xff0c;arduino环境遗留了一些库文件&#xff0c;这些第三方库可以通…

arasan CAN2.0 CAN FD user guide详解

1. 引言 1.1 概览 Arasan 的 Controller Area Network - Flexible Data (CAN-FD) 控制器 IP 实现了 CAN 2.0A、CAN 2.0B 以及高性能 CAN-FD (Flexible Data Rate) 协议。它符合非 ISO CAN-FD 由 Bosch 提出的标准以及 ISO11898-1:2015 DIS 标准。它可以集成到需要 CAN 连接性…

2024年有哪些开放式耳机值得入手?精选五大高分品牌

近几年兴起的开放式蓝牙耳机&#xff0c;具有佩戴舒适稳固、不影响使用者判断外界环境等优点&#xff0c;十分适合在户外环境下使用&#xff0c;因此受到了众多健身人士的喜爱。那么该如何挑选到一款适合自己的开放式耳机呢&#xff1f;2024年有哪些开放式耳机值得入手&#xf…

SpringCloud Alibaba 微服务(四):Sentinel

目录 前言 一、什么是Sentinel&#xff1f; Sentinel 的主要特性 Sentinel 的开源生态 二、Sentinel的核心功能 三、Sentinel 的主要优势与特性 1、丰富的流控规则 2、完善的熔断降级机制 3、实时监控和控制台 4、多数据源支持 5、扩展性强 四、Sentinel 与 Hystrix …

Axure Web端元件库:构建高效互动网页的基石

在快速迭代的互联网时代&#xff0c;Web设计与开发不仅追求视觉上的美感&#xff0c;更注重用户体验的流畅与功能的强大。Axure RP&#xff0c;作为一款专业的原型设计工具&#xff0c;凭借其强大的交互设计能力和丰富的元件库&#xff0c;成为了众多UI/UX设计师、产品经理及前…

C语言 ——— 指针笔试题(中篇)

指针加减整数和解引用的笔试题 笔试题1&#xff1a; int a[5][5]; int(*p)[4]; p a;printf("%p %d", &p[4][2] - &a[4][2], &p[4][2] - &a[4][2]);问&#xff1a;打印的结果为&#xff1f;&#xff08;分别以 %d 和 %p 的形式打印&#xff09; …

【北京迅为】《i.MX8MM嵌入式Linux开发指南》-第三篇 嵌入式Linux驱动开发篇-第六十二章 定时器按键消抖实验

i.MX8MM处理器采用了先进的14LPCFinFET工艺&#xff0c;提供更快的速度和更高的电源效率;四核Cortex-A53&#xff0c;单核Cortex-M4&#xff0c;多达五个内核 &#xff0c;主频高达1.8GHz&#xff0c;2G DDR4内存、8G EMMC存储。千兆工业级以太网、MIPI-DSI、USB HOST、WIFI/BT…

linux系统ShellCheck检查shell脚步语法正确的工具

目录 ShellCheck 安装ShellCheck 、dnf、yum 源代码编译 步骤如下&#xff1a; 示例命令&#xff1a; 方法三&#xff1a;使用其他第三方仓库、COPR 仓库 假设 ShellCheck 输出如下&#xff1a; 分析输出 修改脚本 再次运行 ShellCheck 1. Shell 脚本最佳实践 主题…

环境如何搭建部署Nacos

这里我使用的是Centos7&#xff0c; Nacos 依赖 Java环境来运行。如果您是从代码开始构建并运行Nacos&#xff0c;还需要为此配置 Maven环境&#xff0c;请确保是在以下版本环境中安装使用 ## 1、下载安装JDK wget https://download.oracle.com/java/17/latest/jdk-17_linux-x6…

不同类型游戏安全风险对抗概览(下)| FPS以及小游戏等外挂问题,一文读懂!

FPS 游戏安全问题 由于射击类游戏本身需要大量数值计算&#xff0c;游戏方会将部分计算存放于本地客户端&#xff0c;而这为外挂攻击者提供了攻击的温床。可以说&#xff0c;射击类游戏是所有游戏中被外挂攻击最为频繁的游戏类型。 根据网易易盾游戏安全部门检测数据显示&#…

AWS-负载均衡-创建一个对外的HTTPS ALB

目录 介绍 功能差异 适用场景 性能比较 补充 基本组成部分 创建流程 介绍 Elastic Load Balancing 支持三种类型的负载均衡器&#xff1a;Application Load Balancer、Network Load Balancer 和 Classic Load Balancer。这里用ALB( Application Load Balancer)说明。 功…

聊聊ChatGLM-6B部署与微调的深入理解

前言 ChatGLM的部署&#xff0c;主要是两个步骤&#xff1a; 在Github上下载chatglm的库文件在Hugging Face上下载模型参数与配置文件 ChatGLM包 从Github上看ChatGLM项目文件的结构来看&#xff0c;仅仅是包含三种部署方式的py代码与微调的py代码 而相关的实现细节&#…

黑马JavaWeb后端案例开发(包含所有知识点!!!)

目录 1.准备工作 环境搭建 开发规范 REST&#xff08;REpresentation State Transfer&#xff09;,表述性状态转换&#xff0c;它是一种软件架构风格 注意事项 统一响应结果 2.部门管理功能 查询部门 删除部门 新增部门 RequestMapping 3.员工管理功能 分页查询 批…

Android 10.0 Launcher 启动流程

在前面SystemUI启动流程中说到&#xff0c;在SystemServer中会去启动各种系统服务&#xff0c;这里的launcher也是启动的其中一个服务ActivityManagerService去启动的。在android10之前&#xff0c;系统四大组件的启动都是在ActivityManagerService中&#xff0c;在android10中…

最短路问题中的朴素版Dijkstra算法

最短路问题的朴素版Dijkstra算法 题目 最短路问题需要用到下面的算法&#xff08;n代表点的数量&#xff0c;m代表边的数量&#xff09; 朴素版和堆优化版的Dijkstra算法的区别是&#xff0c;朴素版比较适合稠密图&#xff0c;堆优化版适合稀疏图&#xff0c;稠密图代表它的边…

python | TypeError: list indices must be integers or slices, not tuple

python | TypeError: list indices must be integers or slices, not tuple 在Python编程中&#xff0c;TypeError: list indices must be integers or slices, not tuple 是一个常见的错误。此错误通常发生在尝试使用非整数&#xff08;如元组&#xff09;作为列表索引时。本…

RK3568笔记四十九:W25Q64驱动开发(硬件SPI1)

若该文为原创文章&#xff0c;转载请注明原文出处。 一、SPI介绍 串行外设接口 (Serial Peripheral interface) 简称 SPI&#xff0c;是一种高速的&#xff0c;全双工&#xff0c;同步的通信总线&#xff0c;并 且在芯片的管脚上只占用四根线&#xff0c;节约了芯片的管脚。 …

Python写UI自动化--playwright(在UI元素上悬停)

要在UI元素上执行鼠标悬停&#xff08;hover&#xff09;动作&#xff0c;可以使用page.hover()方法。这个方法使鼠标指针移动到指定的元素上&#xff0c;就像用户将鼠标悬停在该元素上一样。这对于触发那些依赖于鼠标悬停事件的行为&#xff08;如显示下拉菜单、提示框或其他动…

[极客大挑战 2019]PHP1

打开题目 游戏界面 猜测php里面有文件&#xff0c;我们可以用dirsearch 扫描一下这个服务器 执行命令 dirsearch -u http://2999dfd5-1d43-4a81-a088-9e41c9dccab4.node4.buuoj.cn/ -e php > test.log 最后在log文件中找到一个 200 www.zip 浏览器输入payload下载下来 …