TS常见类型概述

基元类型

  • string、number、boolean
  • null和undefined
// 当用到null和undefined跟其他类型的联合类型时,多要进行一个非空的类型缩小方式
// 当开发者知道变量不会是null和undefined时,可以用'!'断言它非空
function fn(x) {
	return x!.toFixed
}
  • biginit、symbol
// biginit
let n:biginit = Biginit(100)
let n:bigint = 100n
// symbol
const str1:symbol = Symbol('abc')
const str2:symbol = Symbol('abc')

never类型、unknown类型

  • never类型标识永远不会被观察到的值,常用于switch case语句中的default项中,用于穷尽性检查。以防后面加了其他类型,忘了做对应的处理
  • unknown类型也代表任何值,但是比any更安全,因为对未知的unknown的任何操作都是不合法的

文字类型(常在联合类型中使用)

function fn(x:'left' | 'right') {}
function fn():0 | 1{}
function fn(x:Option | 'auto') {}

数组

// type[],type为任意合法类型
let arr:number[] = [1,2,3]
// Array<type>,type为任意合法类型
let arr: Array<number> = [1,2,3]

对象类型和接口

// obj为对象类型,其中可有可无的属性用问号。last为undefined和string的联合类型,使用时注意类型缩小
function fn(obj: {first: string, last?: string}) {}
// 定义对象的另外一种方式是接口;一般情况下接口都可以用类型别名的方式去定义
interface Point {
	x: number;
	y: number;
}

函数类型

// 参数和返回值都有类型注释
function fn(name: string):void {}

枚举(如果要用到一组命名常量之一)

TS独有,添加到JS运行时的内容

enum Direction {
	Up = 1,
	Down,
	Left,
	Right
}

联合类型

联合类型使用’|',注意在使用到这种类型的数据时,多数需要类型缩小

// 使用js本身有的方式进行类型缩小
typeof、真值缩小、等值缩小、in操作符、instanceof操作符,控制流分析
// 使用类型谓词,为了更好的控制代码的类型变化(定义一个函数,其返回值是类型谓词)
type Fish = {swim: ()=>void}
type Bird = {fly: ()=>void}
function isFish(animal: Fish | Bird): animal is Fish {
	return (animal as Fish).swim !== undefined
}
function fn(animal: Fish | Bird) {
	if(isFish(animal)) {
		animal.swim()
	}else {
		animal.fly()
	}
}

类型断言

类型断言有编译器删除,不会影响代码运行时行为
对值进行断言,在值后面加as type,或者在值的签名加<type>
类型断言只能指定更大的范围或者更小的范围,不能是交叉的情况eg: ‘abc’ as number

const dom = domcument.getElementById('main) as HTMLElement
const dom = <HTMLElement>domcument.getElementById('main)
const x = ('abc' as unknown) as number

类型别名(被反复用到的话)

type Point = {
	x: number;
	y: number;
}
type Id = number | string
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值