新学 TypeScript 的 Java 程序员

对于习惯于使用其他静态类型语言（如 C#和 Java）的程序员来说，TypeScript 是一个流行的选择。TypeScript 的类型系统提供了许多相同的好处，例如更好的代码完成、更早的错误检测以及程序各部分之间更清晰的通信。虽然 TypeScript 为这些开发人员提供了许多熟悉的特性，但值得回顾一下 JavaScript（以及TypeScript）与传统 OOP 语言的区别。理解这些差异将有助于您编写更好的 JavaScript 代码，并避免程序员直接从 C#/Java 转到 TypeScript 可能会遇到的常见陷阱。

需要熟悉 JavaScript

如果您已经熟悉 JavaScript，但主要是 Java 或 C#程序员，那么这个介绍性页面可以帮助解释您，可能避免受到的一些常见误解和陷阱。TypeScript 模型类型的一些方式与 Java 和 C#有很大的不同，在学习 TypeScript 时记住这些很重要。

如果您是 Java 或 C#程序员，但是对 JavaScript 是新手，我们建议您先学习一点 JavaScript，而不需要编写，以了解 JavaScript 的运行时行为。因为 TypeScript 不会改变代码的运行方式，所以您仍然需要了解 JavaScript 的工作原理，才能编写真正有作用的代码！

必须记住，TypeScript 使用与 JavaScript 相同的运行时，因此有关如何完成特定运行时行为（将字符串转换为数字、显示警报、将文件写入磁盘等）的任何资源始终适用于 TypeScript 程序。不要局限于 TypeScript 特定的资源！

重新思考 Class 类

C#和 Java 是我们可以称之为强制性 OOP 语言。在这些语言中，Class 类是代码组织的基本单元，也是运行时所有数据和行为的基本容器。强制将所有功能和数据保存在类中对于某些问题来说是一个很好的域模型，但并非每个域都需要这样表示。

自由函数和数据

在 JavaScript 中，函数可以存在于任何地方，数据可以自由传递，而不必在预定义的class或者struct中。这种灵活性非常强大。“自由”函数（与 Class 类无关的函数）在处理数据时没有隐含的 OOP 层次结构，这往往是用 JavaScript 编写程序的首选模型。

静态类

此外，C#和 Java 中的某些构造（如 singleton 和静态类）在TypeScript中是不必要的。

TypeScript中的 OOP

也就是说，如果您愿意，您仍然可以使用类！有些问题非常适合用传统的 OOP 层次结构来解决，TypeScript 对 JavaScript 类的支持将使这些模型更加强大。TypeScript 支持许多常见模式，例如实现接口、继承和静态方法。

重新思考 Types

TypeScript 对 Type 的理解实际上与C#或Java完全不同。让我们探讨一些差异。

Type 系统

在 C#或 Java 中，任何给定的值或对象都有一个精确的类型——null、primitive 或已知的 class 类型。我们可以调用value.GetType()、value.getClass()这样的方法，在运行时查询确切的类型。这种类型的定义将驻留在一个具有某种名称的类中，除非存在显式继承关系或通用实现的接口，否则我们不能使用两个形状相似的类来代替彼此。

这些方面描述了一个具体化的、名义化的类型系统。我们在代码中编写的类型是在运行时出现的，并且这些类型是通过它们的声明而不是它们的结构来关联的。

Types 作为 Sets

在C#或Java中，考虑运行时类型及其编译时声明之间的一对一对应是有意义的。在 TypeScript 中，最好将类型视为一组共享相同内容的值。因为类型只是集合，所以一个特定的值可以同时属于多个集合。一旦您开始将类型视为集合，某些操作就会变得非常自然。例如，在 C#中，传递一个string或者int的值很难，因为没有一个类型表示这种值。

在 TypeScript 中，一旦您意识到每个类型都只是一个集合，这就变得非常自然了。如何描述属于string集或number集的值？它只是属于这些集合的并集：string|number。

TypeScript 提供了许多以集合论方式处理类型的机制，如果将类型视为集合，您会发现它们更直观。

删除的结构类型

在 TypeScript 中，对象不是单一的精确类型。例如，如果我们构造一个满足接口的对象，我们可以在需要该接口的地方使用该对象，即使两者之间没有声明关系。

interface Pointlike {
  x: number;
  y: number;
}
interface Named {
  name: string;
}
 
function logPoint(point: Pointlike) {
  console.log("x = " + point.x + ", y = " + point.y);
}
 
function logName(x: Named) {
  console.log("Hello, " + x.name);
}
 
const obj = {
  x: 0,
  y: 0,
  name: "Origin",
};
 
logPoint(obj);
logName(obj);

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com