TypeScript入门 | 青训营

62 阅读2分钟

TypeScript 的发展与基本语法

什么是TypeScript

TypeScript 是 JavaScript 的语法超集,它添加了静态类型

历史(一些比较关键的时间节点)

TypeScript历史.jpg

使用TypeScript的原因

JavaScript 与 TypeScipt 的不同
  • 动态类型:是在执行阶段才来决定一个类型的匹配(如:javascript)
  • 静态类型:是在执行前就进行一个类型的匹配(如:python, java)
  • 动态类型 与 静态类型 的区别关键在于:编译是发生在执行时(如javascript)还是执行前(如java)
  • 弱类型语言的主要特征是类型转换, (比如在JavaScript中你可以执行"1" + 1, 因为JS会进行类型转换,而在强类型语言中[如java中]你就不能执行该操作了)
TypeScript的好处

TypeScript的好处.jpg

TypeScript基本语法

注:TypeScript是有一定的类型推断能力的

基础类型 + 类型定义

基础数据类型.jpg

类型断言 这里着重介绍的是as这种方法, 这段引用自TypeScript官方中文文档

[ 有时候你会遇到这样的情况,你会比TypeScript更了解某个值的详细信息。 通常这会发生在你清楚地知道一个实体具有比它现有类型更确切的类型。

通过类型断言这种方式可以告诉编译器,“相信我,我知道自己在干什么”。 类型断言好比其它语言里的类型转换,但是不进行特殊的数据检查和解构。 它没有运行时的影响,只是在编译阶段起作用。 TypeScript会假设你,程序员,已经进行了必须的检查。

类型断言有两种形式。 其一是“尖括号”语法:

let someValue: any = "this is a string";
​
let strLength: number = (<string>someValue).length;

另一个为as语法:

let someValue: any = "this is a string";
​
let strLength: number = (someValue as string).length;

两种形式是等价的。 至于使用哪个大多数情况下是凭个人喜好;然而,当你在TypeScript里使用JSX时,只有 as语法断言是被允许的。]

对象类型 + 类型定义

对象类型定义时一般都会在开头加个I(大写),用来表示这是一个类型,用于和我们普通的对象和类进行一个区分

对象类型.jpg

函数类型

函数类型.jpg

数组类型

数组类型.jpg

TypeScript补充类型

TypeScript类型补充.jpg

注:文中使用的图片引用了 林皇 老师的课件,十分感谢!若有侵权,请联系我,将第一时间删除