typeScript

node 安装
npm查看
tsc安装
s

npm i typescript -g
tsc --init //初始化文件夹
tsc //编译目录下所有ts文件
tsc xx.ts  //编译
ts -w xx.ts //监听文件，可以随时修改

ts-node
直接运行

npm i ts-node -g
ts-node xxx.ts

第一个
helloworld

const hw:string = "helloworld";
console.log(hw);

数据类型

let num1:number = 1
let num2:number = 1.12
let num3:number = 0b12 //2进制
let num4:number = 0o0021 //8进制
let num5:number = 0x1245 //16进制
let num6:number = NaN //not a number
let b:boolean = true
let s:string = "森森"

空类型：null,undefined

• null:空值 （empty value）
• undefined:没有值 （missing value）
  或者
• null:曾赋值，但现在没有值
• undefined:未赋值
  null是关键词，不能作为变量
  undefined是标识符，可以作为变量

let s1:null = null
let s2:undefined = undefined 

void

function setName(name:string):void{}

any/unknown
any会关闭ts检查，会让ts直接用成js
unknown和any的区别：unknow不能赋值属性

//都不会报错
let a:any = "123"
a=12
a.xxx="111"
a.push("23")

//会报错
let n:unknown = "123"
n.xxx="ddd"//error,没有定义的属性无法赋值

联合类型
用户函数的参数

function setN(n:string|number):number{
    return 1;
}
setN("12")
setN(12 )

类型断言
将不确定的类型定义为确定的类型
达到在编译器层面的欺骗

let img = document.getElementById("#img");
img.src="http:xxxx" //error
//断言
let img = document.getElementById("#img") as HTMLImageElement;
img.src="http:xxxx" //ok

let img = <HTMLImageElement>document.getElementById("#img");
img.src="http:xxxx" //ok

两种写法

value as Type
<Type>value

数组

let a1:string[] = ["11","22"]
let a2:boolean[] = [true,false]
let a3:Array<number> = [1,2,3]

杂乱数组

let a1:any[] = ["11",123,[21,[121]]]
let a2:(string|number) = [11,"1231",12]

元组

let a1:[number,number]=[1,1]
let a2:[1,string,true] = [1,"2",true]

多维数组

let a1:number[][] = [[11,22],[22,33]]
let a2:Array<Array<number>> = [[],[]]

接口

interface

//extends继承
interface people {
    gender:number //男 1 女0 未知2
}
interface userInfoFace extends people {
    readonly id:number //只读，不能进行修改
    name:string
    age?:number //说明是可选属性，可赋值可不赋值
    //方法
    getName:()=>string //()是方法参数， string是返回值
    setName:(name:string)=>void
}
let zs:userInfoFace{
    name:"签到",
    getName:function ():string {
        return this.name  
    },
    setName:function (name:string):void {
        this.name = name;
    },
    gender:1
    
}
//zs.id=2 是不行的
//zs.age=21
console.log(zs.name)