Typescript使用及类型介绍

安装typescript

npm i typescript -g 

编译ts文件

//单个文件编译

tsc 文件名

//所有ts文件编译

tsc 

自动进行编译

//对单一ts文件进行检查 更新时重新生成js

tsc 文件名  -w

//对文档下的所有ts文件进行检查

tsc --watch /--w

发生错误时不编译

tsc --noEmitOnError 

变量上的类型注释 

//number    数字型
let num:number=1

//string    字符串型
let str:string='nihao'

//boolean   布尔型
let bool:boolean=true

//Array     数组型   可指定数组中内容的类型
1.  let arr1:number[]=[1,2,3]
2.  let arr2:Array<string>=['a','b','c']
//元组  固定长度的数组
let arr:[string,number]=['zs',18]

// 函数型 
//直接定义
let a:(a:number,b:number)=> number
a=(n1,n2)=>{
  return n1+n2
} 
//name后的string指定接收字符串型的数据 () 后的 :string指定返回的值为字符串型
function greet(name:string):string{  
  console.log('hello'+name);
  return 'aa'
}
//调用
greet(li)

//对象型
//定义对象的类型时 通常为直接定义它包含的属性的类型  
//如下 被定义类型的属性 在赋值时一定要存在 如name,age  
//[任意名:string]:unknown  表示可增加任意名称的属性 因为属性名通常为string型而属性的值为未知
let c:{name:string ,age:number,[xx:string]:unknown}
c={name:'zs',age:18,sex:'男'}

//枚举型
enum sex{
   boy=1,
   girl=2
}
console.log(sex.boy);//值为1

//在定义类型时可 定义多个类型 用 '|'来分隔 

let  a:number | string | boolean=123

 对象型

//定义对象的类型时 通常为直接定义它包含的属性的类型  
//如下 被定义类型的属性 在赋值时一定要存在 如name,age  
//[任意名:string]:unknown  表示可增加任意名称的属性 因为属性名通常为string型而属性的值为未知
let c:{name:string ,age:number,[xx:string]:unknown}
c={name:'zs',age:18,sex:'男'}

类型断言(指定某未知类型变量(any,unknown)为xx类型)

let b:string='3'
let e:unknown ='aaa'
//正常情况下  b=e 会报错  不用any是因为 any类型 在进行类型转换时会报错
b=e as string //将e的类型指定为string

类型别名type(自定义一个类型方便复用)

type mytype=string | number | boolean
let a:mytype=1  //a:mytype===a: string | number | boolean

接口  interface (功能和类型别名类似)

创建

//定义接口
interface myinterface {
  name:string
} 
//多个 同名接口会合并为一个接口  类型别名type无法合并
interface myinterface {
  age:number
}

//上述2同名接口合并为
interface myinterface {
  name:string
  age:number
}

使用

//接口
interface myinterface {
  name:string
  age:number
}
//普通变量引用
let a:myinterface={
  name:'zs',
  age:22
}
//类引用  implements
class myinter implements myinterface{
  name='zs'
  age=22
}
//函数引用
function fn(a:myinter){
}
fn({name:'zs',age:11})

泛型

//泛型用于类型不明确时 如要调用但不知道传递来的参数是什么类型

//函数
function fn<T,X>(a:T,b:X){    //<T,X>中定义的T,X就是泛型作用是来确定传递来参数的类型

}
//自动识别
fn('zs',15)  //此时T=string  X=number
//直接定义
fn<string,number>('zs',15)  //多用于实参复杂类型不明确
//类 
class cls<T,X>{
  name:T 
  age:X
  constructor(name,age){
    this.name=name
    this.age=age
  }
}
//自动识别
let c1=new cls('zs',15)  //此时T=string  X=number
//直接定义
let c2=new cls<string,number>('zs',15)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值