1. Typescript原始数据类型:
细绳
数字
布尔值
无效的
不明确的
枚举
象征
空值通常用void表示,它可以表示变量或函数的返回值。
2. Typescript 中的任意值:
任何值(any)用于指示参数允许是任何类型。
将变量声明为任意值后,对其进行的任何操作都将返回任意值。
如果声明变量时未指定其类型,则它将被识别为任何值类型。
let a; // a是任意类型
a = 5;
a = 'a';
console.log(a);
3、Typescript的类型推导:
Typescript 将根据类型推导规则推断出类型。
let b = 1; // b是number类型
b = 2;
console.log(b);
如果定义时没有形参,那么无论以后是否有形参,都会推断出any类型typescript类数组,根本不会检查。
4、Typescript联合类型:
联合类型意味着该值可以是多种类型之一。
只能访问此联合类型中所有类型所共有的属性和技术。
const a: string | number = 1;
console.log(a.length); // 报错:Property 'length' does not exist on type 'number'
console.log(a.toString());
5. Typescript中的对象类型接口:
它可以描述类的一部分具体行为,也可以描述对象的结构形态。
接口通常具有较大的首字母,某些编程语言建议在套接字名称中添加“I”前缀。
赋值时,变量的形状必须与套接字的形状一致。
接口中可以定义可选属性、只读属性和任意属性。
interface Istate1 {
name: string;
age: number;
}
const obj1: Istate1 = {
name: "Tom",
age: 10
}
// 可选属性
interface Istate2 {
name: string;
age?: number;
}
const obj2: Istate2 = {
name: "张三",
age: 18
}
const obj3: Istate2 = {
name: "李四"
}
// 属性个数不确定的时候, any必须是任意类型
interface Istate3 {
name: string|number;
age?: number;
[propName: string]: any;
}
const obj33: Istate3 = {
name: 'Jay',
age: 20,
sex: "men",
isMary: false
}
// 只读属性
interface Istate4{
name: string;
readonly age: number;
}
const obj4: Istate4 = {
name: "Jack",
age: 55
}
obj4.age = 56; // Cannot assign to 'age' because it is a read-only property.
6. Typescript链表类型:
1)可以用“type[]”方法表示;
2)可以使用链表类库的“Array”表示法;
3) 可以使用套接字表示法。
// “类型[]”表示法
const arr1: number[] = [1, 2, 3, 4, 5];
const arr2: string[] = ["1", "2", "3"];
const arr3: any[] = [1, '2', true];
// "Array"表示法
const arr4: Array = [1, 2, 3];
const arr5: Array = ["1", "2", "3"];
const arr6: Array = [1, "2", true];
// 接口表示法
interface Istate{
name: string;
age: number;
}
interface Iarr{
[index: number]: Istate;
}
const arr7: Iarr = [
{
name: 'Bill',
age: 66
},
{
name: "Pony",
age: 51
}
];
const arr8: Istate[] = [
{
name: 'Bill',
age: 66
},
{
name: "Pony",
age: 51
}
];
const arr9: Array = [
{
name: 'Bill',
age: 66
},
{
name: "Pony",
age: 51
}
];
7. Typescript函数类型:
函数约束:有函数本身的参数约束和返回值约束;
函数本身的形参变量也有约束;
union类型的函数关系只能以重载的形式支持。
// 申明式类型的函数
function funType(name: string, age: number): number{
return age;
}
const ageNum: number = funType("Tom", 18);
// 函数参数不确定
function funType2(name: string, age: number, sex?: string): number{
return age;
}
const age2Number = funType2("Tom", 18, "男");
// 函数参数的默认值
function funType3(name="Tom", age=18): number{
return age;
}
const age3Number = funType3();
console.log(age3Number)
// 表达式类型的函数
const funType4 = function(name: string, age: number): number{
return age;
}
const funType: (name: string, age: number) => number = function(name: string, age: number): number{
return age;
}
interface IfunType6{
(name: string, age: number): number;
}
const funType6: IfunType6 = function(name: string, age: number): number{
return age;
}
// 对于联合类型的函数可以采用重载的方式
// 输入是number,输出也是number
// 输入是string,输出也是string
function getValue(value: number): number;
function getValue(value: string): string;
function getValue(value: number|string): number|string{
return value;
}
const a: number = getValue(1);
const b: string =getValue("1");
8. Typescript类型判断:
类型断言可用于自动指定值的类型。
语法:值或值作为类型。
在tsx句型(React的jsx句型的ts版本)中,必须使用前者。
类型断言不是类型转换,并且不允许对联合类型中不存在的类型进行断言。
// 类型断言 只能断言联合类型中存在的类型
function getAssert(name: string|number){
//return (name).length;
return (name as string).length;
}
9. Typescript 类型别名:
类型别名可用于为类型指定新名称。
采用关键字typescript类数组,例如“类型名称=字符串|数字”。
示例中,name表示可以设置字符串或数字类型。
Type 还可用于将值限制为仅单个字符串之一,例如:
输入事件名称=“点击”| “滚动”| “鼠标移动”
// 类型别名
//const str: string|number = "1";
type strType = string | number | boolean;
let str: strType = "1"
str = 1;
str = true;
console.log(str);
// 对于接口也可以采用类型别名
interface MuchType1{
name: string;
}
interface MuchType2{
age: number;
}
type MuchType = MuchType1 | MuchType2;
const obj1: MuchType = {
name: "Jack"
}
const obj2: MuchType = {
age: 20
}
const obj3: MuchType = {
name: "Jay",
age: 22
}
console.log(obj1);
console.log(obj2);
console.log(obj3);
// 限制字符串的选择
type sex = "男" | "女";
function getSex(s: sex): string{
return s;
}
getSex("男");
10.打字稿枚举:
枚举(enum)类型用于将值限制在一定范围内的场景。
使用关键字 enum 来定义,例如:enum days {Sun, Mon, Tue, Wed, Thu, Fri, Sat}。
枚举成员将被正式参数化为从 0 开始递增的数字,并且还将从枚举值反向映射到枚举名称。
// 使用枚举可以定义一些有名字的数字常量
enum Days{
Sun,
Mon,
Tue,
Wed,
Thu,
Fri,
Sat
}
console.log(Days.Sun); // 0
console.log(Days.Sat); // 6
console.log(Days); // {0: "Sun", 1: "Mon", 2: "Tue", 3: "Wed", 4: "Thu", 5: "Fri", 6: "Sat", Sun: 0, Mon: 1, Tue: 2, Wed: 3, Thu: 4, …}
console.log(Days[0] === "Sun"); // True
11.Typescript类的装饰器:
公共、私有和受保护。
12.打字稿泛型:
泛型是指在定义函数、接口或类时不预先指定具体类型,而是在使用时指定类型的特性。
// 函数中使用泛型
function createArr(length: number, value: T): Array{
const arr = [];
for(let i = 0; i<length; i++){
arr[i] = value;
}
return arr;
}
const strArr: string[] = createArr(8,"a");
console.log(strArr);
const numArr: number[] = createArr(6, 1);
console.log(numArr);
// 接口当中使用泛型
interface Icreate{
(name: string, value: T): Array;
}
const func: Icreate = function(name: string, value: T): Array{
return [];
}
const strArr2: number[] = func("Jack", 3);