一、基础语法

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

Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐