当前位置: 首页 > 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) {}
}

http://www.lryc.cn/news/124600.html

相关文章:

  • 问道管理:网上如何打新股?
  • 重磅更新,HertzBeat 集群版发布,易用友好的开源实时监控系统!
  • .NET6使用微信小程序授权登录,获取手机号
  • 游戏类APP如何提升用户的活跃度?
  • 【Sklearn】基于支持向量机算法的数据分类预测(Excel可直接替换数据)
  • 抽象类与接口
  • 第三章,矩阵,09-线性方程组解的判断与求法、矩阵方程
  • Vue-4.编译器VsCode
  • Neo4j之Aggregation基础
  • Python 函数
  • Spring(三):Spring中Bean的生命周期和作用域
  • 【AutoLayout案例03-设置底部按钮之间相同间距 Objective-C语言】
  • 代码随想录算法训练营20期|第七天|哈希表part02|454.四数相加II ● 383. 赎金信 ● 15. 三数之和 ● 18. 四数之和 ● 总结
  • NavMeshPlus 2D寻路插件
  • 【03】基础知识:typescript中的函数
  • ssm社区文化宣传网站源码和论文
  • Go语言工程实践之测试与Gin项目实践
  • 排查docker无法启动问题
  • [C++ 网络协议] 套接字和地址族、数据序列
  • AI 绘画Stable Diffusion 研究(八)sd采样方法详解
  • 线程池满了如何处理
  • Java多线程编程中的线程间通信
  • write javaBean error, fastjson version 1.2.76
  • Tomcat的部署及优化(多实例和动静分离)
  • 品牌推广革新之道:海外网红与内容营销的融合
  • 【 BERTopic应用 02/3】 分析卡塔尔世界杯推特数据
  • TypeScript教程(三)变量声明
  • 【数据结构】堆的实现,堆排序以及TOP-K问题
  • 释放马氏距离的力量:用 Python 探索多元数据分析
  • 【不限于联想Y9000P电脑关盖再打开时黑屏的解决办法】