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 保留关键字:

break as catch switch
case if throw else
var number string get
module type instanceof typeof
public private enum export
finally for while void
null super this new
in return true false
any extends static let
package implements interface function
do try yield const
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
void void

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

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

表示对象值缺失。

undefined undefined

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

never never

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) {}
}