TypeScript常用类型

TypeScript简介

  1. TypeScript是JavaScript的超集。
  2. 它对JS进行了扩展,向JS中引入了类型的概念,并添加了许多新的特性。
  3. TS代码需要通过编译器编译为JS,然后再交由JS解析器执行。
  4. TS完全兼容JS,换言之,任何的JS代码都可以直接当成JS使用。
  5. 相较于JS而言,TS拥有了静态类型,更加严格的语法,更强大的功能;TS可以在代码执行前就完成代码的检查,减小了运行时异常的出现的几率;TS代码可以编译为任意版本的JS代码,可有效解决不同JS运行环境的兼容问题;同样的功能,TS的代码量要大于JS,但由于TS的代码结构更加清晰,变量类型更加明确,在后期代码的维护中TS却远远胜于JS。

类型注解
代码示例

let name:string = '张三'

注:代码中 :number 就是类型注解。类型注解约束了只能给该变量赋值该类型的值

常用类型

类型描述
number任意数字
string任意字符串
boolean布尔值true或false
字面量限制变量的值就是该字面量的值
any任意类型
unknown类型安全的any
void没有值(或undefined)
never不能是任何值
object任意的JS对象
array任意JS数组
tuple元素,TS新增类型,固定长度数组
enum枚举,TS中新增类型

原始类型
number/string/boolean/null/undefined/symbol
特点:可完全按照 JavaScript 中的名称来书写

let age: number = 18;
let username: string = '张三';
let isMerry: boolean = false;
let unique: Symbol = Symbol('shuiruohanyu');

字面量声明

let a: 10;
a = 10;

可以使用 | 来连接多个类型(联合类型)

let b: "male" | "female";
b = "male";
b = "female";

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

any
any 表示的是任意类型,一个变量设置类型为any后相当于对该变量关闭了TS的类型检测

// 使用TS时,不建议使用any类型
// let d: any;

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

let d;
d = 10;
d = 'hello';
d = true;

注意:开发中要尽量少用any,当值的类型为any时,可以对该值进行任意操作,并且不会有代码提示

unknown
表示未知类型的值

let e: unknown;
e = 10;
e = "hello";
e = true;
let s:string;
// d的类型是any,它可以赋值给任意变量
// s = d;
e = 'hello';
// unknown 实际上就是一个类型安全的any
// unknown类型的变量,不能直接赋值给其他变量
if(typeof e === "string"){
    s = e;
}

类型断言
可以用来告诉解析器变量的实际类型
语法:变量 as 类型<类型>变量

s = e as string;
s = <string>e; //不常用,了解即可

void
用来表示空,以函数为例,就表示没有返回值的函数

function fn(): void{
}

never
表示永远不会返回结果

function fn2(): never{
    throw new Error('报错了!');
}

类型别名
当一个复杂类型或者联合类型过多或者被频繁使用时,可以通过类型别名来简化该类型的使用
用法:type名称 = 具体类型

type StrArray = Array<number | string>;
let arr: StrArray = [1, 2, '3'];

以上代码中,type作为创建自定义类型的关键字

  • 类型别名可以使任意合法的变量名称
  • 推荐大驼峰的命名写法
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值