面向JS的TypeScript

面向JS的TypeScript

说到TypeScript，就不得不从Javascript说起。我们知道JavaScript（也称为 ECMAScript）最初是一种用于浏览器的简单脚本语言。在它被发明时，它被期望用于嵌入网页中的简短代码片段 - 编写几十行以上的代码有点不寻常。因此，早期的网络浏览器执行此类代码的速度非常慢。不过，随着时间的推移，JS 变得越来越流行，Web 开发者开始使用它来创建交互式体验。

JavaScript是一种为快速使用而设计的语言，与众不同的是，每种语言都有自己的“怪癖“，而 JavaScript 的卑微起步使其拥有许多这样的”怪癖“。

• JavaScript 的相等运算符 (==) 强制转换其操作对象，导致意外行为：

  if ("" == 0) {
    // It is! But why??
  }
  if (1 < x < 3) {
    // True for any value of x!
  }

• JavaScript 还允许访问不存在的属性：

  const obj = { width: 10, height: 15 };
  // Why is this NaN? Spelling is hard!
  const area = obj.width * obj.heigth;

TypeScript：静态类型检查器

静态检查：在不运行代码的情况下检测代码中的错误。

TypeScript 能在执行前检查程序是否有错误，并根据值的种类进行检查，使其成为静态类型检查器。

比如：

const obj = { width: 10, height: 15 };
const area = obj.width * obj.heigth;

* Property 'heigth' does not exist on type '{ width: number; height: number; }'. Did you mean 'height'?Property 'heigth' does not exist on type '{ width: number; height: number; }'. Did you mean 'height'?

TypeScript是JavaScript的超集

因此JS的许多语法在TS中是合法的。由于其语法，TypeScript 不会将任何 JavaScript 代码视为错误。这意味着你可以将任何有效的 JavaScript 代码放入 TypeScript 文件中，而不必担心它的具体编写方式。

语法

let a = (4
         *')'expected.

在TS中不会将任何JS代码看成错误。因此你可以将任何有效的JS都放入TS文件中，而不必担心其具体用法。

类型化的JS超集

TS是一个类型超集，这意味着它添加了关于如何使用不同类型的值的规则。比如在一些JS中的错误不是语法错误而是“以不正确的方式使用某种值（类型）的错误”。

console.log(4 / []);

这个语法上合法的程序记录了 Infinity。但是，TypeScript 将数字除以数组视为无意义的操作，并且会触发错误：“The right-hand side of an arithmetic operation must be of type ‘any’, ‘number’, ‘bigint’ or an enum type.”(分母必须是‘any’,’number’,’bigint’,’enum type’)。

运行时的行为

TypeScript 也是一种保留了 JavaScript 运行时行为的编程语言。例如，在 JavaScript 中除以零会产生 Infinity 而不是抛出运行时异常。原则上，TypeScript 不会改变 JavaScript 代码的运行时行为。

擦除类型

一旦TS的编译器检查完代码，它就会擦除类型以生成结果的“编译”代码。这意味着一旦代码被TS编译后。生成的普通JS就没有类型信息了。