佛山做网站seo深圳网络推广
在JavaScript中，你需要写单元测试来测试这些东西，但TypeScript可以自动检查它们。所以在某种意义上，TypeScript的类型就像轻量级的单元测试，在你每次保存（编译）代码的时候都会运行。(当然，这个比喻是简化的。你还是应该用TypeScript写测试！)
1.类型，只读属性，映射类型
类型检查,可以确保一个函数的输入和输出是正确类型
创建一个类型
type Todo = {id: numbertext: stringdone: boolean}ts检查语法：变量名 ： 类型名
首先，我们指定toggleTodo()的输入必须是Todo。我们通过在参数todo旁边添加:Todo来做到这一点。
// Parameter "todo" must match the Todo typefunction toggleTodo(todo: Todo) {// ...}
接下来，我们指定toggleTodo()的返回类型也必须是Todo。我们通过在参数列表后添加:Todo来做到这一点。
// The return value must match the Todo typefunction toggleTodo(todo: Todo): Todo {// ...}只读属性 readonly 防止属性被修改
就是在定义的类型所有属性前面加 readonly
Readonly< ... >映射类型，将一种类型转换成另一种类型
type Todo = {readonly id: numberreadonly text: stringreadonly done: boolean}上面的代码等价于：
// Readonly<...> makes each property readonlytype Todo = Readonly<{id: numbertext: stringdone: boolean}>补充：Required<...> , partial<...>
2.数组类型，字面量类型，交叉类型
数组类型
我们可以通过添加[]来指定一个数组类型。我们也可以将一个数组设置为只读的。
function completeAll(todos: readonly Todo[]): Todo[] {// ...}在TypeScript中，你可以在指定一个类型的某个属性时使用精确的值（如true或false）。这被称为字面量类型.
type CompletedTodo = Readonly<{id: numbertext: stringdone: true}>交叉类型：可以覆盖一些属性，可以减少重复代码
使用 & 符号（类型运算符）来创建两种类型的交集类型。例如：交叉类型A&B是一个具有A和B的所有属性的类型
如果第二种类型比第一种类型更具体，那么第二种类型将覆盖第一种
type A = { foo: boolean }type B = { foo: true }// This intersection type…type AandB = A & B// …is equivalent to:type AandB = { foo: true }type Todo = Readonly<{id: numbertext: stringdone: boolean}>// Override the done property of Todotype CompletedTodo = Todo & {readonly done: true}3.联合类型和可选属性
union types联合类型
使用语法A | B来创建一个联合类型，它表示一个类型是A或B。
type Place = 'home' | 'work' | { custom: string }// They all compileconst place1: Place = 'home'const place2: Place = 'work'const place3: Place = { custom: 'Gym' }const place4: Place = { custom: 'Supermarket' }type Todo = Readonly<{id: numbertext: stringdone: booleanplace: Place}>当联合类型与条件语句（如if/else）相结合时，其功能非常强大。
-
如果我们有一个联合类型的变量（比如说place）...
-
并在if/else中检查其值...
-
那么TypeScript就会对变量在if/else的每个分支的可能值进行智能处理。
可选属性
属性名称后面添加一个问号(?)来使该属性成为可选项。
type Foo = {// bar is an optional property because of "?"bar?: number
}
// These will both compile:
// bar can be present or missing
const a: Foo = {}
const b: Foo = { bar: 1 }4.泛型
基础泛型
function makeState<S>() {let state: Sfunction getState() {return state}function setState(x: S) {state = x}return { getState, setState }
}可以把 <S> 看作是你在调用该函数时必须传入的另一个东西。 但你不是传递一个值，而是传递一个类型给它
例如，当你调用makeState()时，你可以把类型数字number 作为 S传递。// It sets S as number
makeState<number>()注意: 我们称 makeState<S>() 为 "泛型函数"，因为它实际上是泛型的--你可以选择让它只包含数字或只包含字符串。如果它接受一个类型参数，你就知道它是一个通用函数
参数命名，随意，通常人们使用一个词的第一个字母来描述该类型所代表的内容
常见以下名称：
-
T(代表 “T”ype) -
E(代表 “E”lement) -
K(代表 “K”ey) -
V(代表 “V”alue)
extends:
解决办法: 当你声明 makeState(),时，你把类型参数 <S> 改为 <S extends number | Œstring>. 这是你唯一需要做的改变。
function makeState<S extends number | string>()通过这样做，当你调用makeState()时，你只能将数字、字符串或任何其他扩展了数字或字符串的类型作为S传递。
默认类型 = 类型（如：= number)如果不传参数，默认数字型）
// Set the default type of S as number
function makeState<S extends number | string = number
>()// Don’t need to use <number>
const numState = makeState()
numState.setState(1)
console.log(numState.getState())泛型就像普通的函数参数 。不同的是，普通函数参数处理的是值 ，而泛型处理的是类型参数 。
// Set the default type of T
function genericFunc<T = number>()
// T will be number inside the function
genericFunc()也可以创建一个接受多个类型参数的通用函数
function makePair<F, S>() {let pair: { first: F; second: S }function getPair() {return pair}function setPair(x: F, y: S) {pair = {first: x,second: y}}return { getPair, setPair }
}甚至可以让第二种类型（S）与第一种类型（F）相关。
// The second parameter S must be either
// boolean or whatever was specified for F
function makePair<F extends number | string,S extends boolean | F
>()
// These will work
makePair<number, boolean>()
makePair<number, number>()
makePair<string, boolean>()
makePair<string, string>()
// This will fail because the second
// parameter must extend boolean | number,
// but instead it’s string
makePair<number, string>()泛型接口和类型别名
把{ first: F, second: S } 变成一个接口或类型别名
首先把配对的类型提取到一个泛型接口（一个接受类型参数的接口）中
interface Pair<F, S> {first: Fsecond: S
}然后我们可以使用这个接口来声明类型。
function makePair<F, S>() {// Usage: Pass F for A and S for Blet pair: Pair<F, S>// ...
}或者，我们也可以把它提取到一个通用类型别名中。对于对象类型，类型别名基本上与接口相同，所以你可以使用你喜欢的任何一种。
// Extract into a generic type alias. It’s
// basically identical to using an interface
type Pair<A, B> = {first: Asecond: B
}泛型类
function makeState<S>() {let state: Sfunction getState() {return state}function setState(x: S) {state = x}return { getState, setState }
}把makeState()变成一个叫做State的泛型类
class State<S> {state: SgetState() {return this.state}setState(x: S) {this.state = x}
}
const numState = new State<number>()
numState.setState(1)
// Prints 1
console.log(numState.getState())你需要在TypeScript配置（tsconfig.json）上设置 "strictPropertyInitialization": false 以使上述代码能够编译。