TypeScript入门 | 青训营笔记

这是我参与「第四届青训营」笔记创作活动的第8天

1、什么是 TypeScript

与 JavaScript 的区别：JavaScript是动态类型的语言，只有在执行时才会进行类型的匹配，TypeScript 是静态类型的语言，无法直接在浏览器上运行，会被编译成 JavaScript 语法再去运行。

总结以下三点：

1、TypeScript 中的数据要求带有明确的类型，JavaScript 不要求。

2、TypeScript 引入了 JavaScript 中没有的 “类” 概念。

3、TypeScript 通过类型注解提供编译时的静态类型检查。

2、TypeScript 基本语法

将 JavaScript 代码改造成 TypeScript ：

基本数据类型

在变量后面指定一个关键字表示其只能为什么类型。

对象类型

接口可以理解为一种规范，一种契约。可以约束一个对象里应该有哪些成员，这些成员都是怎么样的。

通过interface定义一个bytedancer接口，这个接口是一个对象，规则为有一个readonly jobID属性类型为number, name属性类型为string等等。

如果用readonly修饰成员，那么这个成员属性在初始化后便不可修改

函数类型

函数重载

数组类型

泛型

泛型就是在定义函数，接口或者类的时候没有指定具体类型，等到使用时才指定具体类型。极大程度的复用代码。

泛型也是一种类型，只不过不同于 string, number 等具体的类型，它是一种抽象的类型，我们不能直接定义一个变量类型为泛型

3、高级类型

联合/交叉类型

联合类型: IA | IB; 联合类型表示一个值可以是几种类型之一

交叉类型: IA & IB; 多种类型叠加到一起成为一种类型，它包含了所需的所有类型的特性

类型保护与类型守卫

类型保护是可执行运行时检查的一种表达式，用于确保该类型在一定的范围内。换句话说，类型保护可以保证一个字符串是一个字符串，尽管它的值也可以是一个数值。类型保护与特性检测并不是完全不同，其主要思想是尝试检测属性、方法或原型，以确定如何处理值。

主要有四种方式来实现类型保护：

1.类型断言：

interface Bird{
  fly:boolean
  sing:()=>{}
}
interface Dog{
  fly:boolean
  bark:()=>{}
}

function trainAnimal(animal:Bird | Dog){
  if(animal.fly){
    (animal as Bird).sing()
  }else{
    (animal as Dog).bark()
  }
}

2. in 语法：

interface Bird{
  fly:boolean
  sing:()=>{}
}
interface Dog{
  fly:boolean
  bark:()=>{}
}

function trainAnimal(animal:Bird | Dog){
  if('sing' in animal){
    animal.sing()
  }else{
    animal.bark
  }
}