TypeScript为JavaScript的超集(ECMAScript6), 这个语言添加了基于类的面向对象编程。TypeScript作为JavaScript很大的一个语法糖,本质上是类似于css的less、sass,都是为了易于维护、开发,最后还是编译成JavaScript。
Types
所有类型都是any类型的子类型,其他类型被分成元类型(primitive types)和对象类型(object types)。
1. 元类型包括 number, boolean, string, null, undefined
2. 对象类型为所有类、模块、接口和字面量类型;
Basic Types简单解释一下元类型,即基本数据类型
1.类型声明
- 类型声明是TS非常重要的一个特点
- 通过类型声明可以指定TS中变量(参数、形参)的类型
- 指定类型后,当为变量赋值时,TS编译器会自动检查值是否符合类型声明,符合则赋值,否则报错
- 简而言之,类型声明给变量设置了类型,使得变量只能存储某种变量的值
2.语法
let 变量:类型; let 变量:类型 = 值; function fn(参数:类型,参数:类型):类型{ ... }
let b: any; // 所有JavaScript值 let c; // Same as c: any let a: number; // 显式类型 let d: boolean; let e: string; let f: string[] = ["hello", "world"]; //数组类型 let g: [number, string] = [3, "three"]; //元组类型 let h: string | number; //联合类型,几个不同的类型之中的一个 function k() : void{ //void是any的子类型,是undefined的超类型,与其他类型无关 alert('hi man'); }
//函数返回值类型确定后,一定要有返回值,要么声明为undefined、void或any
- 自动类型判断
- TS拥有自动类型判断机制
- 当变量的声明和赋值时同时进行的,TS编译器会自动判断变量的类型
- 所以当你的变量声明和赋值是同时进行的,可以省略掉类型声明
- 类型
类型 | 例子 | 描述 |
number | 1 -23 1.23 | 任意数字,包括整数、小数、八进制等 |
string | “hello” 'hello' `hello world` | 字符串 |
boolean | true false | 布尔类型 |
字面量 | 其本身 | 限制变量的值就是该字面量的值 |
数组 | [1,2,3] ['hello','hi] | let list: number[] = [1, 2, 3];元素类型相同 |
元祖 |
[3, "three"] |
var g: [number, string] = [3, "three"];确定类型 |
枚举enum | ||
any | ||
void | ||
null和undefined | 空和未定义 | |
never | 绝不 | |
输入断言 |
布尔
最基本的数据类型是简单的true/false值
let isDone: boolean = false;
数值
和JavaScript一样,TypeScript中的所有数字都是浮点值。这些浮点数字获得类型number
。除了十六进制和十进制文字外,TypeScript还支持ECMAScript 2015中引入的二进制和八进制文字。
let decimal: number = 6; let hex: number = 0xf00d; let binary: number = 0b1010; let octal: number = 0o744;
字符串
用JavaScript创建网页和服务器程序的另一个基本部分是使用文本数据。与其他语言一样,我们使用该类型string
来引用这些文本数据类型。就像JavaScript一样,TypeScript也使用双引号(")或单引号(')来包围字符串数据。
let color: string = "blue";
color = 'red';
还可以使用模板字符串,它可以跨越多行并具有嵌入的表达式。这些字符串被反引号/反引号(`)字符包围,并且嵌入式表达式是这种形式${ expr }
。
这相当于声明sentence
如下:
let sentence: string = "Hello, my name is " + fullName + ".\n\n" + "I'll be " + (age + 1) + " years old next month.";
数组
TypeScript与JavaScript一样,允许您处理值的数组。数组类型可以用两种方式之一来编写。在第一个中,您使用后面的[]
元素类型来表示该元素类型的数组:
let list: number[] = [1, 2, 3];
第二种方式使用通用数组类型Array<elemType>
:
1 let list: Array<number> = [1, 2, 3];
元组
元组类型允许表达一个数组,其中固定数量的元素的类型是已知的,但不一定是相同的。例如,您可能想要将值表示为一对a string
和a number
:
// Declare a tuple type let x: [string, number]; // Initialize it x = ["hello", 10]; // OK // Initialize it incorrectly x = [10, "hello"]; // Error
访问具有已知索引的元素时,将检索正确的类型:
console.log(x[0].substr(1)); // OK console.log(x[1].substr(1)); // Error, 'number' does not have 'substr'
枚举
对JavaScript中标准数据类型集的有益补充是enum
。就像在C#这样的语言中,枚举是一种给数组值赋予更多友好名称的方法。
enum Color {Red, Green, Blue}
let c: Color = Color.Green;
默认情况下,枚举开始为其成员开始编号0
。你可以通过手动设置其中一个成员的值来改变它。例如,我们可以开始前面的例子,1
而不是0
:
enum Color {Red = 1, Green, Blue}
let c: Color = Color.Green;
或者,即使手动设置枚举中的所有值:
1 enum Color {Red = 1, Green = 2, Blue = 4} 2 let c: Color = Color.Green;
枚举的一个方便功能是,您也可以从数值转到枚举中该值的名称。例如,如果我们有值2
但不确定Color
上面枚举中映射到的是什么,我们可以查找相应的名称:
1 enum Color {Red = 1, Green, Blue} 2 let colorName: string = Color[2]; 3 alert(colorName);
any
我们可能需要描述我们在编写应用程序时不知道的变量类型。这些值可能来自动态内容,例如来自用户或第三方库。在这些情况下,我们希望退出类型检查并让值通过编译时检查。为此,我们将这些标签标注为any
:
1 let notSure: any = 4; 2 notSure.ifItExists(); // okay, ifItExists might exist at runtime 3 notSure.toFixed(); // okay, toFixed exists (but the compiler doesn't check) 4 5 let prettySure: Object = 4; 6 prettySure.toFixed(); // Error: Property 'toFixed' doesn't exist on type 'Object'.
any
,如果你知道类型的某些部分,但也许不是所有的类型也很方便。例如,你可能有一个数组,但数组有不同的类型:
1 let list: any[] = [1, true, "free"]; 2 3 list[1] = 100;
void
void
有点像是相反的any
:没有任何类型。您通常可以将此视为不返回值的函数的返回类型:
1 function warnUser(): void { 2 alert("This is my warning message"); 3 }
声明类型的变量void
是没有用的,因为你只能给他们分配undefined
或null
:
let unusable: void = undefined;
空和未定义
在TypeScript,都undefined
和null
实际有自己类型的命名undefined
和null
分别。很像void
,他们对自己并不是非常有用:
1 // Not much else we can assign to these variables! 2 let u: undefined = undefined; 3 let n: null = null;