TypeScript入门 | 青训营笔记

62 阅读32分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天


TypeScript 特点

TypeScript 是静态语言和弱类型语言,静态语言意味着它在很多情况下需要指定类型,比如 Promise 的参数、回调函数的结果等等,弱类型语言意味它会很容易的进行数据类型转换,这点跟 JavaScript 是一样的。TypeScript 指定类型是通过 `变量:类型` 这种形式的指定的,这点跟 rust 一样的(如果要想提升自己,后期学习 rust 是一种非常不错的选择),这在一定程度上充当了注释的作用,提高了代码的可维护性

TypeScript 基本数据类型

TypeScript 的基本数据类型包含了 JavaScipt 的基本数据类型

let a: string = 'a';
let b: number = 10;
let c: boolean = false;

除了 string、number 和 boolean 等 JavaScript 中的类型,TypeScript 还有些特有的类型

enum Color {red, green, blue}; // 枚举类型
const f = (): () => void = {}; // void 类型,表示函数没有返回值
let t: [string, number] = ['a', 1]; // 元组类型
let a: any = 0; // 任意类型
function func(){
    throw new Error("")
}
let n: nerver = func(); // 异常或者根本不会有返回值的类型

TypeScript 复杂数据类型

interface People{
    name: string;
    age: number;
}

const p:People = {name: "Mark", age: 10};

这里我们定义了一个 People 类型,并用它给 p 指定类型,由于 p 的初始值是符合 People 类型的定义,没报错,接下来我们想给 p 添加 sex 变量

p.sex = '男'

由于 People 类型并为包含 sex 类型,出现了报错

如果要想给 p 添加 sex 并且不报错,我们必须修改 People 的定义,给 People 添加 `sex: string`,可这样一来创建 p 那条语句就会报错,难道我们还要修改初始化语句?其实并不需要,我们只需要在 sex 后面加 `?`,这表示可选的意思,这样两条语句都不会报错

不过新的问题又来了,由于 sex 是字符串类型,造成了它可以随意设置,我们需要限制它为男女,于是我们要再一次修改 sex 定义

接下来我们要在 People 这个类的基础上新建一个类 Student,我们需要利用 `extends` 操作符

这个 Student 拥有 People 的所有类型,但如果我们需要给 Student 设置任意类型呢?我们可以利用中扩号