TypeScript基础-类型

184 阅读2分钟

typescript安装

 npm install -g typescrip

对ts文件进行解析

 tsc hello.ts //(文件名)

基本类型

基本类型:

boolean number string void undefined symbol null

将js变换为静态语言,可以指定变量类型

//声明变量a,指定类型为number
let a: number;
a = "hello";  //此行代码会报错
let b: string;
b = 123;

image.png 虽然ts会报错,但是依然会进行编译。

声明完变量直接进行负值: let a: number = 123;

如果变量的声明和赋值量进行类型检测

image.png

类型声明可以用在变量和返回值身上

function sum(a:number,b:number){
  return a + b;
}
sum(123,'123'); //类型报错
sum(123,456,789); //报错,应该2个参数,传了3个

应用在返回值上:

function sum(a: number, b: number): number {
  return a + "b";  //不能将类型string分配给number
}
sum(123, 1); 

| 或者的意思,在几个范围内

let c:boolean | string;
c = 'hello';
c = true;

any: 表示任意类型,一个变量设置为any后相当于关闭了TS的类型检测,也就是说一个变量设置为any后,变量可以赋值为任意类型的值

声明变量如果不指定类型,ts解析器会自动判断变量类型为any(隐式的any)

unknow:表示未知类型

let a :unknown;
a = 10;
a = true;

未知类型尽量用unknow,unknow类型的变量不能直接复制给其它变量

类型断言:可以用来告诉解析器变量的实际类型

let e: unknown;

let s: string;
e = "hello";
s = <string>e; //不进行类型断言会报错 
s = e as string;//这种方式也可以

void/never 在函数中指定返回值类型

function fn(): boolean {
  return true;
}
//void 用来表示空,表示没有返回值
function fn(): void {
  return 123; //报错
}
//表示永远不会返回结果
function fn(): never { //报错
  
}

object

let b: { name: string };
b = {}; //报错
b ={name:123}; //报错
b = {name:'123'}
//属性后面加?表示可选,传不传都可以
let b: { name: string; age?: number };
//只要求规定属性
//[propName:string]:any 表示任意类型的任意属性
let c: { name: string,[propName:string]:any };

限制函数的参数以及返回值

语法:

(形参:类型,形参:类型...)=>返回值类型

let d: (a: number, b: number) => number;
d = function (n1, n2) {
  return n1 + n2;
};
d('123',1232); //报错

array: 两种声明方式

let e:string[];
e = ['1',1] //报错,只能输入字符串
let f:Array<string>
f = ['12',12]//报错,只能输入字符串

元组:固定长度的数组

image.png

enum:枚举

enum Gender {
  male,
  female
}

let i: { name: string; gender: Gender };
i = {
  name: "猪八戒",
  gender: Gender.male
};

类型别名

type myType = 1|2|3|4;
let m:myType;
m=3
m=6 //报错