基础类型
- 布尔值
数字
支持二进制,八进制,十进制,十六进制- 字符串
- 数组
两种定义方式:
let list: number[] = [1, 2, 3];
let list: Array<number> = [1, 2, 3];
元组Tuple
元组与数组类似,但每一项数据类型可不同(数组需要使用any类型)枚举
为一组数值赋予友好的名字Any
声明为 any 的变量可以赋予任意类型的值Void
表示没有任何类型,当一个函数没有返回值时,就可以使用voidnull
表示对象值缺失undefined
用于初始化变量为一个为定义的值never
表示的是那些永不存在的值的类型
类型断言
- 可以用来手动指定一个值的类型
- 类型断言好比其它语言里的类型转换,但是不进行特殊的数据检查和解构。 它没有运行时的影响,只是在编译阶段起作用。
使用形式:
let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;
let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;
注意: TypeScript里使用JSX时,只有 as语法断言是被允许的。
变量声明
使用let
声明变量
使用const
声明常量
详情请看我另一篇博客:js中的const,var,let
解构
属性重命名
let { a: newName1, b: newName2 } = o;
等价于
let newName1 = o.a;
let newName2 = o.b;
接口
接口是一系列抽象方法的声明,是一些方法特征的集合,这些方法都应该是抽象的,需要由具体的类去实现,然后第三方就可以通过这组抽象方法调用,让具体的类执行具体的方法。
接口定义实例:
interface LabelledValue {
label: string;
color?: string; // 可选属性,带?符号,表示不是必须的
readonly x: number; // 只读属性,用readonly指定
}
readonly
vs const
两者都表示只读,不可修改
- 变量使用
const
- 属性使用
readonly
注意:
TypeScript具有ReadonlyArray<T>
类型,它与Array<T>
相似。
不同的是,数组创建后不能修改。
额外的属性检查
额外的属性检查只会应用于对象字面量场景
如果一个对象字面量存在任何“目标类型”不包含的属性时,你会得到一个错误。
实例代码:
interface SquareConfig {
color?: string;
width?: number;
}
function createSquare(config: SquareConfig): { color: string; area: number } {
// ...
}
let mySquare = createSquare({ colour: "red", width: 100 });
上述代码,向createSquare
传入了一个对象字面量,就会对这个对象字面量进行检查,发现目标类型里不包含colour
这个属性,就会报错。
解决方法:
一:使用类型断言
let mySquare = createSquare({ colour: "red", width: 100 } as SquareConfig);
二:添加一个字符串索引签名(最佳)
如果 SquareConfig
带有上面定义的类型的color
和width
属性,并且还会带有任意数量的其它属性,那么我们可以这样定义它:
interface SquareConfig {
color?: string;
width?: number;
[propName: string]: any; // 表示可以有任意数量和类型的属性
}
三:将对象赋值给一个变量,再传入,跳过属性检查
let squareOptions = { colour: "red", width: 100 };
let mySquare = createSquare(squareOptions);
函数类型
接口也可以用来描述函数类型
函数类型接口示例代码:
interface SearchFunc {
(source: string, subString: string): boolean;
}
使用方式:
创建一个函数类型的变量,就可以向这个变量赋值一个同类型的函数。
函数的参数名不需要与接口定义的名字匹配
如果没有指定类型,typescript
类型系统会推断出参数类型,返回值类型则通过返回值推断出。
let mySearch: SearchFunc;
mySearch = function(src: string, sub: string) {
let result = source.search(subString);
return result > -1;
}
可索引的类型
TypeScript
支持两种索引类型:字符串和数字。- 可以同时使用两种类型的索引,但是数字索引的返回值必须是字符串索引返回值类型的子类型。
索引也可以设置为只读:
interface ReadonlyStringArray {
readonly [index: number]: string;
}
let myArray: ReadonlyStringArray = ["Alice", "Bob"];
myArray[2] = "Mallory"; // error!
类类型
代码示例:该接口描述了类的公共部分,它不会帮你检查类是否具有某些私有成员。
interface ClockInterface {
currentTime: Date;
setTime(d: Date);
}
class Clock implements ClockInterface {
currentTime: Date;
setTime(d: Date) {
this.currentTime = d;
}
constructor(h: number, m: number) { }
}
类静态部分与实例部分的区别
当一个类实现了一个接口时,只对其实例部分进行类型检查。 constructor存在于类的静态部分,所以不在检查的范围内。
继承接口
- 接口可以相互继承
- 一个接口可以继承多个接口,创建出多个接口的合成接口
混合类型
一个对象可以同时具备多种类型
接口继承类
当接口继承了一个类类型时,它会继承类的成员但不包括其实现