TypeScript基础

目录

TS基本指令

TS数据类型

布尔值 boolean

数值 number  

字符串 string  

数组 array   

元祖 tuple   

对象 object  

枚举类型 enum    

联合类型 

类型推论

任意类型 any

没有类型 void

永不存在的值的类型  never

不确定的变量 unknown

接口

定义接口

接口约束对象

接口约束函数

不使用接口约束的函数的定义方法

---

TS基本指令

安装ts 小黑框管理员身份安装

npm install -g typescript

生成对应js文件

tsc my.ts 

生成tsconfig.json文件

tsc --init 

tsconfig.json文件里有个 outDir 配置文件夹，可自动生成对应js文件并放入

自动刷新

打开终端，进入运行任务，tsc监视，自动监视并刷新

TS数据类型

布尔值 boolean

let isDone: boolean = false;

数值 number  

支持整数，小数，十进制，二进制，NaN

let number:number = 1 / 0b1010 / NaN

字符串 string  

支持模板字符串

let str: string = "bob" / `你好${name}` ;

数组 array   

内部数据都是一种类型的才是数组，否则就是元祖，如果数组没有定义类型，会被认为是any，或者以第一个数据来进行类型推论

const names1: Array<string> = [] 
const names2: string[] = [] // 推荐
// 定义二维数组
let multi:number[][] = [[1,2,3],[23,24,25]]  

元祖 tuple   

内部数据可以是多个数据类型的数组，基本元组的类型定义可不写（但不推荐）

let arr3:[string, number, boolean] = ['德玛西亚', 123, true]  //推荐
// 也可以省略前面的类型定义，不会报错，但过于复杂的元组待验证
let arr3 = ['德玛西亚', 123, true]

对象 object  

使用 对象类型 约束对象，也可以使用接口约束，具体方式向下找

定义类型

type aaa = {
   name: string;  
   tel?: string | number;    // 使用联合类型,?代表这是一个非必传的值
   readonly IDCard: string;  //readonly表示只读数据，第一次赋值后，无法更改
}

使用类型

let obj: aaa = {
    name: "xhang",
    IDCard: 'gfgf'
}

枚举类型 enum    

可以由枚举的值得到对应它的名字

enum Color {Red, Green, Blue}
// colors["red"]的返回值是0 ,依次类推，如果是数字的排序可以省略
// colors[0]的返回值也是red
// 当设置'blue'=4时，后面的数字会类推，但前面不变

//设置其他的排序方式，但是不能省略
enum colors { "red"="a", 'blue'="b" }  

联合类型 

一个变量设置多个数据类型，以 | 分割

 let str:string | null | undefined

类型推论

一个变量没有标记数据类型，但它第一次赋值时，类型就是赋的值的那个数据类型，而且一经赋值，无法再改变

任意类型 any

使用any类型，就不用担心类型问题，他代表任何数据类型都可以

let notSure: any = 4;

没有类型 void

表示没有任何类型。 当一个函数没有返回值时，你通常会见到其返回值类型是 void

声明一个 void 类型的变量时，只能为它赋予 undefined 和 null

永不存在的值的类型  never

举例

// 返回never的函数必须存在无法达到的终点
function error(message: string): never {
    throw new Error(message);
}
// 推断的返回值类型为never
function fail() {
    return error("Something failed");
}
// 返回never的函数必须存在无法达到的终点
function infiniteLoop(): never {
    while (true) { }
}

不确定的变量 unknown

unknow 类型只能赋值给 any 和 unknow 类型

any 类型可以赋值给任意类型

接口

定义接口

interface User {
      name: string;  
      tel?: string | number;    // 接口也使用联合类型,?代表这是一个非必传的值
      readonly IDCard: string;  //readonly表示只读数据，第一次赋值后，无法更改
}

接口约束对象

let obj:User = {
   name: "张三",
   sing: function() {  }, 
}

接口约束函数

// ()内的是参数的类型，：后的是返回值的类型
interface encypt {
    (key: string, value: string): string;
}
var sha1: encypt = function (key, value): string {
    return key + '--' + value
}
sha1('dog', 'zi')

不使用接口约束的函数的定义方法

定义函数时，不仅要设置每个参数的类型，返回值的类型也要设置

函数声明法

function add(n1: number, n2: number): number {
	return n1 + n2;
}；
console.log(add(1, 2)); //3

函数表达式法

var add = function (n1: number, n2: number): number {
	return n1 + n2;
};
console.log(add(1, 2)); //3

箭头函数

var add = (n1: number, n2: number): number => {
	return n1 + n2;
}
console.log(add(1, 2)); //3