深入理解TypeScript|青训营笔记

170 阅读2分钟

为什么会有TypeScript?

JavaScript 只是一个脚本语言,并非设计用于开发大型 Web 应用,JavaScript 没有提供类和模块的概念,而 TypeScript 扩展了 JavaScript 实现了这些特性。TypeScript 主要特点包括:

  • TypeScript 是微软推出的开源语言,使用 Apache 授权协议
  • TypeScript 是 JavaScript 的超集.
  • TypeScript 增加了可选类型、类和模块
  • TypeScript 可编译成可读的、标准的 JavaScript
  • TypeScript 支持开发大规模 JavaScript 应用
  • TypeScript 设计用于开发大型应用,并保证编译后的 JavaScript 代码兼容性
  • TypeScript 扩展了 JavaScript 的语法,因此已有的 JavaScript 代码可直接与 TypeScript 一起运行无需更改
  • TypeScript 文件扩展名是 ts,而 TypeScript 编译器会编译成 js 文件
  • TypeScript 语法与 JScript .NET 相同
  • TypeScript 易学易于理解

JavaScript 与 TypeScript 的区别

TypeScript 是 JavaScript 的超集,扩展了 JavaScript 的语法,因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改,TypeScript 通过类型注解提供编译时的静态类型检查。TypeScript 可处理已有的 JavaScript 代码,并只对其中的 TypeScript 代码进行编译。

TypeScript优势

解决痛点

TypeScript的设计解决了JavaScript的“痛点”:弱类型和没有命名空间;这导致程序很难模块化,不适合开发大型程序。

语法提示

编写程序时,编辑器将提供精准的语法提示,以帮助大家更方便地实践面向对象的编程。

容易上手

TypeScript的一个设计亮点,是它并没有抛弃JavaScript的语法另起炉灶,而是做成了JavaScript的超集,任何合法的JavaScript的语句在TypeScript下都是合法的,且沿用了JavaScript的使用习惯和惯例,可以说学习成本很低。

TS基础类型

  1. boolean、number、string
  2. undefined、null
  3. any、unknown、void
  4. never
  5. 数组类型
  6. 元组类型 tuple

函数类型

  • 定义:TS定义函数类型时要定义输入参数类型和输出类型
  • 输入参数:参数支持可选参数和默认参数
  • 输出参数:输出可以自动推断,没有返回值时,默认为void类型
  • 函数重载:名称相同但参数不同,可以通过重载支持多种类型

interface

定义:接口是为了定义对象类型

特点:

  • 可选属性: ?
  • 只读属性: readonly
  • 可以描述函数类型
  • 可以描述自定义属性

总结:接口非常灵活duck typing

定义:写法和JS差不多,增加了一些定义

特点: 增加了 public、private、protected 修饰符 -抽象类:

  • 只能被继承,不能被实例化 -作为基类,抽象方法必须被子类实现
  • interface约束类,使用implements关键字