一 TypeScript基本概念定义:TypeScript核心原则之一是对值所具有的结构进行类型检查。
二 元组与数组区别:
在所有的数据类型里,Array
是唯一的泛型类型,也是唯一有两种不同的写法:Array<T>
和T[]
。
元组的长度是固定已知的。因此使用场景也非常明确,适合用在有固定的标准/参数/配置的地方,比如经纬度坐标、屏幕分辨率等。
Typescript
支持通过&
、|
操作符对类型声明进行扩展
交叉类型(并集):用&
相连的多个类型。
1 interface A {
2 name: string,
3 age: number,
4 sayName: (name: string) => void
5 }
6 interface B {
7 name: string,
8 gender: string,
9 sayGender: (gender: string) => void
10 }
11
12 let a: A & B
13
14 // 都是合法的
15 a.age
16 a.sayName
联合类型(合集):联合类型是具有 或 关系的多个类型组合而成,只要满足其中一个类型即可,用|
相连,只能访问所有源类型的公共成员。
两者之间的区别主要体现在联合类型主要在做类型的合并,如Form4Type
、Form6Type
;而交叉类型则是求同排斥,如Form3Type
、Form5Type
。
1 interface A {
2 name: string,
3 age: number
4 }
5 interface B {
6 name: string,
7 sayGender: (gender: string) => void
8 }
9
10 let a: A | B
11
12 a.name // 可以访问
13 a.age // 不可以访问
14
15 type Form1Type = { name: string; } & { gender: number; }
16 // 等于 type Form1Type = { name: string; gender: number; }
17 type Form2Type = { name: string; } | { gender: number; }
18 // 等于 type Form2Type = { name?: string; gender?: number; }
19
20 let form1: Form1Type = { name: ‘王五‘ } // 提示缺少gender参数
21 let form2: Form2Type = { name: ‘刘六‘ } // 验证通过
22
23 type Form5Type = { name: string; } & { name?: number; gender: number; }
24 // 等于 type Form5Type = { name: never; gender: number; }
25 type Form6Type = { name: string; } | { name?: number; gender: number; }
26 // 等于 type Form6Type = { name?: string | number; gender: number; }
27
28 let form5: Form5Type = { name: ‘张三‘, gender: 1 } // 提示name的类型为never,不能进行赋值
29 let form6: Form6Type = { name: ‘张三‘, gender: 1 } // 验证通过
类型保护:
常用的类型保护有typeof
类型保护,instanceof
类型保护和自定义
类型保护
1 function BuildURL(param: string | number): any {
2 if (typeof param === ‘string‘) {
3 return param.toUpperCase()
4 }
5 }
由于使用了typeof
类型保护,所以在if的分支里可以告诉编译器放心的调用string类型的方法,编译器也会给出自动提示
四 interface与Type区别:https://juejin.cn/post/6844903749501059085#heading-11
接口是在我们的应用程序中充当契约的结构。它定义了要遵循的类的语法,这意味着实现接口的类必须实现它的所有成员。
相同点:1都可以描述一个对象或者函数 2 都允许拓展(extends)
区别: type可以而interface不可以:
1 interface User {
2 name: string
3 age: number
4 }
5
6 interface User {
7 sex: string
8 }
9
10 /*
11 User 接口为 {
12 name: string
13 age: number
14 sex: string
15 }
16 */
五 类型别名: 类型别名会给一个类型起个新名字。 类型别名有时和接口很像,但是可以作用于原始值,联合类型,元组以及其它任何你需要手写的类型。
type strType = string | number | boolean;
let str2: strType = "10";
str2 = 10;
str2 = true;
interface muchType1 {
name: string
}
interface muchType2 {
age: number
}
type muchType = muchType1 | muchType2
let obj: muchType = { name: "张三" }
let obj2: muchType = { age: 10 }
let obj4: muchType = { name: "张三", age: 10 }
强大的类型别名操作API:https://cloud.tencent.com/developer/article/1541321
强大的类型别名操作Demo:https://blog.csdn.net/weixin_33895695/article/details/91373813
typeScript中interface与type对比面试题:https://www.cnblogs.com/EnSnail/p/11233592.html
原文:https://www.cnblogs.com/terrymin/p/14608350.html