当前位置: 首页 > news >正文

TypeScript教程(二)基础语法与基础类型

一、基础语法

TypeScript由以下几个部分组成

1.模块

2.函数

3.变量

4.语句和表达式

5.注释

示例:

Runoob.ts 文件代码:

const hello : string = "Hello World!"
console.log(hello)

以上代码首先通过 tsc 命令编译:

tsc Runoob.ts

Runoob.js 文件代码: 

var hello = "Hello World!";
console.log(hello);

最后我们使用 node 命令来执行该 js 代码。

$ node Runoob.js
Hello World

tsc 常用编译参数如下表所示:

序号编译参数说明
1.

--help

显示帮助信息

2.

--module

载入扩展模块

3.

--target

设置 ECMA 版本

4.

--declaration

额外生成一个 .d.ts 扩展名的文件。

tsc ts-hw.ts --declaration

以上命令会生成 ts-hw.d.ts、ts-hw.js 两个文件。

5.

--removeComments

删除文件的注释

6.

--out

编译多个文件并合并到一个输出的文件

7.

--sourcemap

生成一个 sourcemap (.map) 文件。

sourcemap 是一个存储源代码与编译代码对应位置映射的信息文件。

8.

--module noImplicitAny

在表达式和声明上有隐含的 any 类型时报错

9.

--watch

在监视模式下运行编译器。会监视输出文件,在它们改变时重新编译。

TypeScript 保留关键字:

breakascatchswitch
caseifthrowelse
varnumberstringget
moduletypeinstanceoftypeof
publicprivateenumexport
finallyforwhilevoid
nullsuperthisnew
inreturntruefalse
anyextendsstaticlet
packageimplementsinterfacefunction
dotryyieldconst
continue

空白和换行:

TypeScript会忽略程序中出现的空格,制表符和换行符

空格,制表符通常用来缩进代码,使代码易于阅读和理解

TypeScript区分大小写字符

分号是可选的

单行指令都是一段语句,可以使用分号或不使用,建议使用

TypeScript与面向对象

面向对象是一种对现实世界理解和抽象的方法

TypeScript是一种面向对象的编程语言

面向对象主要有两个概念:对象和块

        对象:对象是类的一个实例,有状态和行为

        类:类是一个模板,描述的是一类对象的行为和状态

        方法:方法是类的操作的实现步骤

示例:

TypeScript面向对象编程

class Site { name():void { console.log("Runoob") } 
} 
var obj = new Site(); 
obj.name();

以上示例定义了一个类Site,该类有一个方法name(),该方法在终端上输出字符串Runoob

new关键字创建类的对象,该对象调用方法name(),

编译后生成的JavaScript

var Site = /** @class */ (function () {function Site() {}Site.prototype.name = function () {console.log("Runoob");};return Site;
}());
var obj = new Site();
obj.name();

二、基础类型

数据类型关键字描述
任意类型any声明为 any 的变量可以赋予任意类型的值。
数字类型number

双精度 64 位浮点值。它可以用来表示整数和分数。

let binaryLiteral: number = 0b1010; // 二进制
let octalLiteral: number = 0o744;    // 八进制
let decLiteral: number = 6;    // 十进制
let hexLiteral: number = 0xf00d;    // 十六进制
字符串类型string

一个字符系列,使用单引号(')或双引号(")来表示字符串类型。反引号(`)来定义多行文本和内嵌表达式。

let name: string = "Runoob";
let years: number = 5;
let words: string = `您好,今年是 ${ name } 发布 ${ years + 1} 周年`;
布尔类型boolean

表示逻辑值:true 和 false。

let flag: boolean = true;
数组类型

声明变量为数组。

// 在元素类型后面加上[]
let arr: number[] = [1, 2];// 或者使用数组泛型
let arr: Array<number> = [1, 2];
元组

元组类型用来表示已知元素数量和类型的数组,各元素的类型不必相同,对应位置的类型需要相同。

let x: [string, number];
x = ['Runoob', 1];    // 运行正常
x = [1, 'Runoob'];    // 报错
console.log(x[0]);    // 输出 Runoob
枚举enum

枚举类型用于定义数值集合。

enum Color {Red, Green, Blue};
let c: Color = Color.Blue;
console.log(c);    // 输出 2
voidvoid

用于标识方法返回值的类型,表示该方法没有返回值。

function hello(): void {alert("Hello Runoob");
}
nullnull

表示对象值缺失。

undefinedundefined

用于初始化变量为一个未定义的值

nevernever

never 是其它类型(包括 null 和 undefined)的子类型,代表从不会出现的值。

注:TypeScript和JavaScript没有整数类型

1.Any类型

任意值是TypeScript针对编程时类型不明确的变量使用的一种数据类型

1.变量的值会动态改变时,比如来自用户的输入,任意值类型可以让这些变量跳过编译器阶段的类型检查

let x: any = 1;    // 数字类型
x = 'I am who I am';    // 字符串类型
x = false;    // 布尔类型

2.改写现有代码时,任意值允许在编译时可选择地包含或移除类型检查

let arrayList: any[] = [1, false, 'fine'];
arrayList[1] = 100;

2.Null和Undefined

null

在JavaScript中null表示"什么都没有",是一个只有一个值的特殊类型,表示一个空对象的引用

用TypeScript检测null返回是object

undefined

在JavaScript中,underfined是一个没有设置值的变量

typeof一个没有值的变量会返回undefined

null和undefined是其他任何类型(包括void)的子类型,可以赋值给其他类型,

而在JavaScript中,启用严格的空校验(--strictNullChecks)特性,就可以使得null和underfined只能被赋值给void或本身对应的类型:

// 启用 --strictNullChecks
let x: number;
x = 1; // 编译正确
x = undefined;    // 编译错误
x = null;    // 编译错误

上面例子的变量x只能是number类型,如果一个类型可能出现null或undefined,可以用 | 来支持多种类型

// 启用 --strictNullChecks
let x: number | null | undefined;
x = 1; // 编译正确
x = undefined;    // 编译正确
x = null;    // 编译正确

3.never类型

never是其他类型(包括null和undefined)的子类型,代表从不会出现的值,这意味着never只能被never类型所赋值,在函数中通常表现为抛出异常或无法执行到终点(例如无限循环)

let x: never;
let y: number;// 编译错误,数字类型不能转为 never 类型
x = 123;// 运行正确,never 类型可以赋值给 never类型
x = (()=>{ throw new Error('exception')})();// 运行正确,never 类型可以赋值给 数字类型
y = (()=>{ throw new Error('exception')})();// 返回值为 never 的函数可以是抛出异常的情况
function error(message: string): never {throw new Error(message);
}// 返回值为 never 的函数可以是无法被执行到的终止点的情况
function loop(): never {while (true) {}
}

相关文章:

TypeScript教程(二)基础语法与基础类型

一、基础语法 TypeScript由以下几个部分组成 1.模块 2.函数 3.变量 4.语句和表达式 5.注释 示例&#xff1a; Runoob.ts 文件代码&#xff1a; const hello : string "Hello World!" console.log(hello) 以上代码首先通过 tsc 命令编译&#xff1a; tsc …...

问道管理:网上如何打新股?

随着资本市场的不断敞开&#xff0c;越来越多的人开始重视股票市场&#xff0c;并想经过网上打新股来取得更大的出资收益。但是&#xff0c;网上打新股的办法并不简略&#xff0c;怎样才能成功地打新股呢&#xff1f;本文将从多个角度剖析&#xff0c;协助广阔出资者处理这一问…...

重磅更新,HertzBeat 集群版发布,易用友好的开源实时监控系统!

什么是 HertzBeat? HertzBeat 赫兹跳动 是一个拥有强大自定义监控能力&#xff0c;高性能集群&#xff0c;无需 Agent 的开源实时监控告警系统。 特点 集 监控告警通知 为一体&#xff0c;支持对应用服务&#xff0c;数据库&#xff0c;操作系统&#xff0c;中间件&#xf…...

.NET6使用微信小程序授权登录,获取手机号

1.在appsettings配置你的小程序配置信息 //微信小程序信息配置"WechatConfig": {"appid": "", //小程序ID"secret": "" //小程序秘钥},2.请求接口时先获取Access_token #region 获取小程序的Access_tokenpublic object GetA…...

游戏类APP如何提升用户的活跃度?

移动游戏行业&#xff0c;追求使用率的营销能发挥强大的功效&#xff0c;可帮助减少玩家流失、追回流失的玩家、提高活跃玩家所带来的价值以及增加付费玩家贡献的收入。 一、了解玩家需求 想要提升玩家的活跃&#xff0c;首先要知道&#xff0c;玩家喜欢玩哪些平台的游戏&…...

【Sklearn】基于支持向量机算法的数据分类预测(Excel可直接替换数据)

【Sklearn】基于支持向量机算法的数据分类预测(Excel可直接替换数据) 1.模型原理1.1 数学模型1.2 模型原理2.模型参数3.文件结构4.Excel数据5.下载地址6.完整代码7.运行结果1.模型原理 支持向量机(Support Vector Machine,SVM)是一种用于分类和回归的监督学习算法,其基本…...

抽象类与接口

一&#xff0c;类 定义类 部分与ES6用法基本一致。通过class定义类名&#xff0c;并通过constructor定义构造函数&#xff0c;通过super关键字来调用父类的方法。 class Person {name: string; // 属性constructor(name: string) { // 构造函数this.name name;}eat()…...

第三章,矩阵,09-线性方程组解的判断与求法、矩阵方程

第三章&#xff0c;矩阵&#xff0c;09-线性方程组解的判断与求法、矩阵方程 定理推论1推论2推论3推论4 矩阵方程AXB解法解的存在性推论 玩转线性代数(21)线性方程组解的判断与求法的笔记&#xff0c;相关证明以及例子见原文 定理 对n元线性方程组 A x b Axb Axb&#xff0c;…...

Vue-4.编译器VsCode

准备 Vue-1.零基础学习Vue Vue-2.nodejs的介绍和安装 Vue-3.vue简介 为什么用VsCode VsCode 是Vue官网首推的编译器它是完全免费的 下载安装VsCode 下载地址 安装的时候不停地下一步直到完成即可 安装插件 安装汉化插件 要将 Visual Studio Code&#xff08;VSCode&am…...

Neo4j之Aggregation基础

在 Neo4j 中&#xff0c;聚合&#xff08;Aggregation&#xff09;是对数据进行计算、汇总和统计的过程。以下是一些使用聚合函数的常见例子&#xff0c;以及它们的解释&#xff1a; 计算节点数量&#xff1a; MATCH (p:Person) RETURN count(p) AS totalPersons;这个查询会计…...

Python 函数

Built-in Functions — Python 3.11.4 documentation...

Spring(三):Spring中Bean的生命周期和作用域

前言 在 Spring 中&#xff0c;那些组成应用程序的主体及由 Spring IOC 容器所管理的对象&#xff0c;被称之为 bean。简单地讲&#xff0c;bean 就是由 IOC 容器初始化、装配及管理的对象&#xff0c;除此之外&#xff0c;bean 就与应用程序中的其他对象没有什么区别了。而 b…...

【AutoLayout案例03-设置底部按钮之间相同间距 Objective-C语言】

一、好,咱们继续啊 1.咱们继续把autoLayout介绍一下 咱们的自动布局 给大家介绍一下 那么,自动布局呢 继续咱们给大家做的案例 做几个例子 把这几个例子做完以后 我们再给它 我们再给大家说一下,如何通过代码,来实现自动布局 虽然说,通过代码来实现自动布局,并不推荐 但…...

代码随想录算法训练营20期|第七天|哈希表part02|454.四数相加II ● 383. 赎金信 ● 15. 三数之和 ● 18. 四数之和 ● 总结

454.四数相加II 比较巧思的解法&#xff0c;先把nums1 和nums2的数两两相加&#xff0c;并存储sum和次数 再在nums3和nums4里找对应和sum和为0的数值i,j Time: N^2 Space:N^2, 最坏情况下A和B的值各不相同&#xff0c;相加产生的数字个数为 n^2 class Solution {public int fo…...

NavMeshPlus 2D寻路插件

插件地址:h8man/NavMeshPlus&#xff1a; Unity NavMesh 2D Pathfinding (github.com) 我对Unity官方是深恶痛觉,一个2D寻路至今都没想解决,这破引擎早点倒闭算了. 这插件是githun的开源项目,我本身是有写jps寻路的,但是无法解决多个单位互相阻挡的问题(可以解决但是有性能问…...

【03】基础知识:typescript中的函数

一、typescript 中定义函数的方法 函数声明法 function test1(): string {return 返回类型为string }function test2(): void {console.log(没有返回值的方法) }函数表达式/匿名函数 const test3 function(): number {return 1 }二、typescript 中 函数参数写法 1、typesc…...

ssm社区文化宣传网站源码和论文

ssm社区文化宣传网站源码和论文019 开发工具&#xff1a;idea 数据库mysql5.7 数据库链接工具&#xff1a;navcat,小海豚等 技术&#xff1a;ssm 研究或设计的目的和意义&#xff1a; (一)研究目的&#xff1a; 通过本次课题能够将所学的Java编程知识以及Mysql数据库知…...

Go语言工程实践之测试与Gin项目实践

Go 语言并发编程 及 进阶与依赖管理_软工菜鸡的博客-CSDN博客 03 测试 回归测试一般是QA(质量保证)同学手动通过终端回归一些固定的主流程场景 集成测试是对系统功能维度做测试验证,通过服务暴露的某个接口,进行自动化测试 而单元测试开发阶段&#xff0c;开发者对单独的函数…...

排查docker无法启动问题

查看Linux系统操作日志(最后200行就可以排查)&#xff1a; tail -200f /var/log/messages...

[C++ 网络协议] 套接字和地址族、数据序列

目录 1. 套接字 1.1 在Linux平台下构建套接字 1.1.1 用于接听的套接字(服务器端套接字) 1.1.2 用于发送请求的套接字(客户端套接字) 1.2 在Windows平台下构建套接字 1.2.1 Winsock的初始化 1.2.2 用于接听的套接字(服务器端套接字) 1.2.3 用于发送请求的套接字(客户端套…...

国防科技大学计算机基础课程笔记02信息编码

1.机内码和国标码 国标码就是我们非常熟悉的这个GB2312,但是因为都是16进制&#xff0c;因此这个了16进制的数据既可以翻译成为这个机器码&#xff0c;也可以翻译成为这个国标码&#xff0c;所以这个时候很容易会出现这个歧义的情况&#xff1b; 因此&#xff0c;我们的这个国…...

在鸿蒙HarmonyOS 5中实现抖音风格的点赞功能

下面我将详细介绍如何使用HarmonyOS SDK在HarmonyOS 5中实现类似抖音的点赞功能&#xff0c;包括动画效果、数据同步和交互优化。 1. 基础点赞功能实现 1.1 创建数据模型 // VideoModel.ets export class VideoModel {id: string "";title: string ""…...

WordPress插件:AI多语言写作与智能配图、免费AI模型、SEO文章生成

厌倦手动写WordPress文章&#xff1f;AI自动生成&#xff0c;效率提升10倍&#xff01; 支持多语言、自动配图、定时发布&#xff0c;让内容创作更轻松&#xff01; AI内容生成 → 不想每天写文章&#xff1f;AI一键生成高质量内容&#xff01;多语言支持 → 跨境电商必备&am…...

mysql已经安装,但是通过rpm -q 没有找mysql相关的已安装包

文章目录 现象&#xff1a;mysql已经安装&#xff0c;但是通过rpm -q 没有找mysql相关的已安装包遇到 rpm 命令找不到已经安装的 MySQL 包时&#xff0c;可能是因为以下几个原因&#xff1a;1.MySQL 不是通过 RPM 包安装的2.RPM 数据库损坏3.使用了不同的包名或路径4.使用其他包…...

听写流程自动化实践,轻量级教育辅助

随着智能教育工具的发展&#xff0c;越来越多的传统学习方式正在被数字化、自动化所优化。听写作为语文、英语等学科中重要的基础训练形式&#xff0c;也迎来了更高效的解决方案。 这是一款轻量但功能强大的听写辅助工具。它是基于本地词库与可选在线语音引擎构建&#xff0c;…...

【JVM】Java虚拟机(二)——垃圾回收

目录 一、如何判断对象可以回收 &#xff08;一&#xff09;引用计数法 &#xff08;二&#xff09;可达性分析算法 二、垃圾回收算法 &#xff08;一&#xff09;标记清除 &#xff08;二&#xff09;标记整理 &#xff08;三&#xff09;复制 &#xff08;四&#xff…...

Spring AI Chat Memory 实战指南:Local 与 JDBC 存储集成

一个面向 Java 开发者的 Sring-Ai 示例工程项目&#xff0c;该项目是一个 Spring AI 快速入门的样例工程项目&#xff0c;旨在通过一些小的案例展示 Spring AI 框架的核心功能和使用方法。 项目采用模块化设计&#xff0c;每个模块都专注于特定的功能领域&#xff0c;便于学习和…...

在 Spring Boot 中使用 JSP

jsp&#xff1f; 好多年没用了。重新整一下 还费了点时间&#xff0c;记录一下。 项目结构&#xff1a; pom: <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://ww…...

uniapp 小程序 学习(一)

利用Hbuilder 创建项目 运行到内置浏览器看效果 下载微信小程序 安装到Hbuilder 下载地址 &#xff1a;开发者工具默认安装 设置服务端口号 在Hbuilder中设置微信小程序 配置 找到运行设置&#xff0c;将微信开发者工具放入到Hbuilder中&#xff0c; 打开后出现 如下 bug 解…...

Docker拉取MySQL后数据库连接失败的解决方案

在使用Docker部署MySQL时&#xff0c;拉取并启动容器后&#xff0c;有时可能会遇到数据库连接失败的问题。这种问题可能由多种原因导致&#xff0c;包括配置错误、网络设置问题、权限问题等。本文将分析可能的原因&#xff0c;并提供解决方案。 一、确认MySQL容器的运行状态 …...