TypeScript Java / C#程序员的TypeScript

在本教程中，我们将讨论TypeScript，这是一个非常适合有C#和Java静态类型语言经验的程序员的选项。我们可以从TypeScript的类型系统中受益，它提供了改进的代码完成、更早的错误检测和更清晰的程序不同部分之间的通信。需要记住的是，TypeScript是基于JavaScript的，它与传统的面向对象编程语言有一些基本区别。通过理解这些区别，我们可以避免从C#/Java过渡到TypeScript的程序员常犯的错误。

语法

用户可以使用以下语法使用TypeScript创建变量−

let variableName: type = value;

在这个语法中，使用 let 关键字声明一个变量，后跟变量名、冒号和变量的数据类型。最后，使用等号给变量赋值。

TypeScript 的特点

下面是一些 Java/C# 程序员应该了解的 TypeScript 特点：

TypeScript 和 JavaScript 入门

在深入学习 TypeScript 之前，建议对 JavaScript 有很好的理解。这将帮助我们编写更好的 JavaScript 代码，并避免其他语言转型的程序员常见错误。此外，值得注意的是 TypeScript 使用与 JavaScript 相同的运行时，因此 JavaScript 的任何资源也可以应用到 TypeScript 程序中。

TypeScript 中的类和面向对象编程

在 TypeScript 中，类是将数据和函数组合到可重用的结构中的一种方式。然而，与 C# 和 Java 不同的是，在 TypeScript 中，类不是把代码组织起来的必要组成部分，自由函数也可以使用。

如果我们选择使用类，TypeScript 提供了许多功能，例如接口、继承和静态方法。这使得在 TypeScript 中编写面向对象的代码更容易。然而，重要的是要理解，类只是 TypeScript 工具箱中的一种工具，并且在某些情况下使用它们是可以的。

自由函数和静态类

在 TypeScript 中，我们不需要使用类似 C# 和 Java 中常用的单例或静态类构造。相反，当使用它们对问题求解有意义时，我们可以使用自由函数（与类无关的函数）和类。这使得我们在组织代码方面更灵活。

名义化实例类型系统和类型作为集合

在某些编程语言（如 C# 和 Java）中，每个值或对象都有一个由类或基本类型定义的精确类型。这被称为“名义化实例类型系统”，意味着类型在运行时存在，并通过它们的声明相关联。

然而，在 TypeScript 中，更好的方式是将类型视为共享某些公共特性的值的集合。类型不是基于明确的声明，而是基于他们的结构和与其他类型的关系。这被称为“类型作为集合”的方法。

将类型视为集合允许进行更自然的操作，例如组合或交集类型，这对于值可以同时属于多个类型的情况很有用。TypeScript 提供了几种以集合论方式处理类型的机制，使其成为编写灵活和表达力强的代码的强大工具。

TypeScript 中的结构化类型和其后果

TypeScript 中的结构化类型允许更灵活和动态的编程，因为只要对象和函数的结构相同，它们可以互换使用。这可以使代码更可重用和更容易重构。

然而，如果对象或函数的结构在没有警告的情况下发生更改，可能会导致意外的行为，从而导致错误或类型不匹配。因此，在使用结构化类型时，重要的是牢记潜在的风险和好处，并仔细关注对象和函数的结构。

示例 1

在这个示例中，我们使用对象字面语法创建了两个对象，一个是 person，另一个是 employee。person 有 name 和 age 属性，而 employee 有 name、age 和 job title 属性。

接下来，我们使用一个对象接口定义了一个名为Person的类型，它具有name和age属性。然后，我们定义了一个printPerson函数，它接受一个类型为Person的参数，并将一条消息记录到控制台。

最后，我们使用person和employee对象作为参数，调用了两次printPerson函数。由于这两个对象都具有与Person类型匹配的name和age属性，它们可以作为参数传递给printPerson函数而不会出错。

用户可以观察输出，printPerson函数正确地将person和employee对象的name和age记录到控制台中。

let person = { name: "John", age: 30 };
let employee = { name: "Mary", age: 25, jobTitle: "Software Engineer" };

type Person = { name: string; age: number };

function printPerson(person: Person) {
   console.log(` ${person.name} is$ {person.age} years old.`);
}

printPerson(person); 
printPerson(employee);

编译时，它将生成以下JavaScript代码 –

var person = { name: "John", age: 30 };
var employee = { name: "Mary", age: 25, jobTitle: "Software Engineer" };
function printPerson(person) {
   console.log("".concat(person.name, " is ").concat(person.age, " years old."));
}
printPerson(person);
printPerson(employee);

输出

以上代码将产生以下输出-

John is 30 years old.
Mary is 25 years old.

示例2

在这个示例中，我们创建了一个名为Stack的通用类，可以用来在TypeScript中实现堆栈数据结构。该类有一个类型参数T，表示将存储在堆栈中的元素的类型。

接下来，我们定义了一些可以用来操作堆栈的方法，比如push，pop和isEmpty。push方法接受一个类型为T的参数，并将其添加到堆栈的顶部。pop方法会移除并返回堆栈顶部的元素，而isEmpty方法则检查堆栈是否为空。

最后，我们创建了一个类型参数为string的Stack类的实例，并使用push方法向堆栈中添加了一些元素。然后我们调用了pop方法来从堆栈中移除元素，并将输出记录到控制台中。

用户可以观察到在输出中pop方法返回的是string类型的元素，这是传递给Stack类的类型参数。

class Stack<T> {
   private items: T[] = []; 
   push(item: T): void {
      this.items.push(item);
   } 
   pop(): T | undefined {
      return this.items.pop();
   } 
   isEmpty(): boolean {
      return this.items.length === 0;
   }
} 
const stringStack = new Stack<string>();
stringStack.push("Hello");
stringStack.push("World");
stringStack.push("!"); 
while (!stringStack.isEmpty()) {
   const item = stringStack.pop();
   console.log(item);
}

在编译时，它将生成以下的JavaScript代码 −

var Stack = /** @class */ (function () {
   function Stack() {
      this.items = [];
   }
   Stack.prototype.push = function (item) {
      this.items.push(item);
   };
   Stack.prototype.pop = function () {
      return this.items.pop();
   };
   Stack.prototype.isEmpty = function () {
      return this.items.length === 0;
   };
   return Stack;
}());
var stringStack = new Stack();
stringStack.push("Hello");
stringStack.push("World");
stringStack.push("!");
while (!stringStack.isEmpty()) {
var item = stringStack.pop();
   console.log(item);
}