首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

TypeScript学习笔记(超全)

一.TS是什么?

TypeScript 是 JaveScript 类型的超集,它可以编译成纯 JavaScript,TypeScript 可以在任何浏览器、任何计算机和任何操作系统上运行,并且是开源的。

二.TS和JS的异同

TypeScript 支持与 Javascript 几乎相同的数据类型,此外还提供了使用的枚举类型,TypeScript 支持的类型包括:布尔值、数字、字符串、数组、元组、枚举、Any、Void、Null、 Undefined、Nerver、Object、类型断言。

三.如何将TS编译为JS

四.如何简化执行TS代码

五.TS的类型注解

类型注解

作用:相当于强类型语言中的类型声明,可以对变量起到约束作用。由我们来告诉TS变量是什么类型。

语法:(变量/函数):typeName

类型推断

作用:TS会自动的尝试去分析变量的类型。

注意:如果TS能够自动分析变量的类型,我们就什么也不用做。反之,如果TS无法分析变量的类型的话,我们则需要使用类型注解。

写TS就是希望每一个变量和属性的类型都是固定的。想让类型固定有两种方式:类型推断和类型注解。能推断就推断,推断不出来的我们来告诉它。

1.字面量

这里的color的值只能是red,blue,black中的一个,num的值也只能是1,2,3里面的一个,type的值可以是number类型或者string类型

2.any

3.unknown

any和unknown的区别:

any在编译阶段跳过类型检查(适用于已有代码的改写),unknown只是不确定数据类型,但是要想使用数值的方法,必须确定数据类型(比any更加安全)

如何处理unknown:

1.if判断:

2.类型断言:或者

4.void

void类型的值多用于函数,表示函数没有返回值,例:

5.never

never表示函数永远不会有返回结果,多用于抛出错误

6.object

(1)

很少用

(2)

表示必须包含name的属性,且不能包含除name以外的其他属性

(3)

在属性名后加?表示这个属性可选

(4)

表示这个对象里面可以添加其他任意属性,XXX可以自定义名字

7.array

表示希望e为数组,且e中全部存的为字符串

或者

表示希望f为数组,且f中全部存的为数字,其中第二种方法里面可以自定义校验

8.tuple

表示h里面只能存两个值,且都是string类型

9.enum

先定义枚举

类型别名:

语法:type 类型名称 = { name: string, age: number }

或者是联合类型相结合

六.TS的配置文件

1.在终端中执行tsc -w表示监视所有的ts文件,若文件发生变动,则会自动生成新的js文件

2.创建tsconfig.json文件,它是ts编译器,ts编译器可以根据它的信息对代码进行编译

七.接口:interface

语法:interface 类型名称 { name: string }

用法:用于定义通用类型的集合。

可选属性

给属性加了问号之后就表示这个属性可传可不传

只读属性

如果一个interface接口中的数据是只读的,不想被人修改,那么我们可以在接口的属性前面加一个 “readonly” 关键字即可。

额外属性检查

函数类型的接口

与type(类型别名)的区别:

interface只能用于代表对象或函数,而类型别名type可以代表其他类型的值,例如:

typecript通用性规范:如果能用接口表述一些类型时,尽量用接口,实在没办法再用类型别名

八.类:class

1.类成员的访问修饰符

什么是访问修饰符?

指的就是可以在类的成员前通过关键字来设置当前成员的访问权限.

权限有三种:

public:公开的,默认

private:私有的,只能在当前类中进行访问

protected:受保护的,只能在当前类或者子类中进行访问

(1)public在公开修饰符里,下面三种情况color都可以访问

(2)private私有的:只能在当前类中使用

(3)protected:protected和private类似,但是,protected成员在派生类中可以访问

2.类的只读属性和类中构造函数参数简写

(1)只读属性:只能访问不能修改(一样在前面加readonly)

(2)类中构造函数参数简写

3.类的成员存取器

普通给类成员赋值:

但是发现名字无法限制,于是我们采用另一种方法:类成员存取器,它的作用是可以将类中接收到的属性值进行限制,具体如下:

4.类类型接口

TypeScript能够用它来明确的强制一个类去符合某种契约

实现(implements)是面向对象中的一个重要概念。一般来讲,一个类只能继承自另一个类,有时候不同类之间可以有一些共有的特性,这时候就可以把特性提取成接口(interfaces),用 implements 关键字来实现。这个特性大大提高了面向对象的灵活性,例:

这个案例里面 车和门都有报警功能,所以将这个公共的功能抽离出来封装为一个接口

需要这个功能的类比如Car Door Baoma 等去实现这个接口 implements即可

要注意的是在接口里面是方法的签名,在类里面进行方法体的实现

这个打印只有两个属性;warning这个方法是绑定在构造函数Baoma的原型对象prototype上面的,可以在浏览器里面查看

5.接口继承接口

//接口继承接口(支持多继承)

6.接口继承类

------------END-----------

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20210225A02ZLP00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券