Typescript类型
程序员文章站
2022-07-03 20:50:36
...
// 1. 基本类型:number string boolean
let ab: number;
ab = 10;
ab = 11;
// 2. 字面量方法进行声明,则不可再改变 很少使用
let abc: 10;
// abc=11; //报错
// 可以用 | 来连接多个类型 (联合类型)
let abcd: "male" | "female";
abcd = "male";
abcd = "female";
// abcd = "dontknown"; //报错,因为不在其声明的范围内
let ac: boolean | string;
ac = true;
ac = "test";
// 3. any 任意类型 相当于对该变量关闭了类型检查 不建议使用
let ad: any; // 显式any
// let ad; // 若不对其进行类型声明,则TS解析器自动将其判定为 any 类型 隐式any
ad = 1;
ad = "testAny";
ad = true;
// 4. unknown 未知类型 实际就是一个类型安全的any,其不能随意赋值
let e: unknown;
e = 2;
e = "TestUnknown";
e = false;
// ad的类型是 any ,它可以赋值给任意变量
// e的类型是unknown ,他赋值给其他任意变量就会报 类型错误
let ae: string;
ae = "string";
ae = ad;
// ae = e; //报错 unknown 不能随意分配给其他
// 如何不报错?
// ① 对其类型进行检测
if (typeof e === "string") {
ae = e;
}
// ② 类型断言 两种写法
ae = e as string;
ae = <string>e;
// 5.void 一般用于函数的返回值中
function fn(): void {
// return undefined;
}
// 6.nerver 表示永远不会返回结果 用的比较少 一般用于报错 如 throw
function fn1(): never {
throw new Error("报错了!"); //由于报错了,因此没有返回值
}
// 7. object
let o: object; //不常用的方式
o = {};
o = function () {};
// {} 用来指定 对象中可以包含哪些属性,且初始化的时候,这些属性必须被满足
// 语法: {属性名:属性值,性名:属性值,.....}
let o1: { name: string };
o1 = { name: "孙悟空" };
// o1 = { name: "孙悟空", age: 18 }; //报错,属性不能临时添加
// 对象的可选属性 在属性名后加一个 "?" 可选属性
let o2: { name: string; age?: number };
o2 = { name: "沙悟净" };
o2 = { name: "沙悟净", age: 18 };
// 但添加的属性个数不确定时,怎么更好的书写? 对象有不确定个的属性
// [propName:string]:any 表示任意类型的属性
// propName:string 字符串类型的属性名
// :any 属性的类型是任意的 常用方式
let o3: { name: string; [propName: string]: any };
o3 = { name: "猪八戒", age: 18, gender: "男", company: "hand" };
// 8.函数
// 设置函数结构的类型声明
// 语法:(形参:类型,形参:类型,...)=>返回值类型
let f1: (a: number, b: number) => string;
f1 = function (n1, n2): string {
return (n1 + n2).toString();
};
// 9.数组 array
// 数组类型声明的两种方式
// :类型[] :Array<类型>
let a1: string[];
a1 = ["a", "b", "c", "d"];
// a1 = ["a", "b", "c", "d", 1, 2]; //报错
let a2: Array<number>;
a2 = [1, 3, 2, 4, 6];
// 10.元组 tuple
// 含义:固定长度的数组,不可多也不可少
let t1: [string, string, number];
t1 = ["hello", "ts", 123];
// 11.枚举 enum
enum Gender {
male,
female,
}
let e1: { name: string; gender: Gender };
e1 = {
name: "孙悟空",
gender: Gender.male,
};
console.log(e1.gender === Gender.male);
// & 和 |
// & 同时, | 或
let testand: { name: string } & { age: Number };
testand = { name: "yzk", age: 20 };
// 类型别名
type myType = string;
type myType1 = 1 | 2 | 3 | 4 | 5;
let k: myType1;
k = 1;
k = 2;
k = 4;
// k = 6; //报错
下一篇: CSS3自定义滚动条样式