建站模板网seo点击优化

TypeScript 学习总结

TypeScript 是一种 JavaScript 的超集，增加了静态类型检查和编译时错误检测，从而提高了代码的可维护性和可靠性。以下是 TypeScript 的基础知识总结，包括语法、运算符、数据类型、变量声明和作用域。

## 基本语法TypeScript 的基本语法与 JavaScript 相似，但增加了一些重要的功能：- **变量声明**：TypeScript 支持 `let`、`const` 和 `var` 声明变量。推荐使用 `let` 和 `const` 以确保更好的代码安全性。```typescriptlet name: string = 'Alice';const age: number = 30;

• 函数：
  函数的参数和返回值可以指定类型，从而确保函数的调用与实现的一致性。

  function greet(person: string, age: number): string {return `Hello ${person}, you are ${age} years old.`;
  }
  

• 接口：
  使用接口（interface）来定义对象的形状，提供了结构化的代码组织方式。

  interface Person {name: string;age: number;
  }const person: Person = {name: 'Bob',age: 25
  };
  

运算符

TypeScript 中的运算符大多与 JavaScript 中的运算符相同：

• 算术运算符：

  let x: number = 10;
  let y: number = 5;
  console.log(x + y); // 输出 15
  console.log(x - y); // 输出 5
  console.log(x * y); // 输出 50
  console.log(x / y); // 输出 2
  

• 比较运算符：

  let a: number = 10;
  let b: number = 20;
  console.log(a === b); // 输出 false
  console.log(a !== b); // 输出 true
  console.log(a > b);  // 输出 false
  

• 逻辑运算符：

  let isTrue: boolean = true;
  let isFalse: boolean = false;
  console.log(isTrue && isFalse); // 输出 false
  console.log(isTrue || isFalse); // 输出 true
  console.log(!isTrue); // 输出 false
  

• 赋值运算符：

  let num: number = 10;
  num += 5; // 相当于 num = num + 5
  console.log(num); // 输出 15
  

基础数据类型

TypeScript 提供了几种基础数据类型：

• number：双精度 64 位浮点值。

  let num: number = 42;
  

• string：字符系列，可以使用单引号（'）、双引号（"）或反引号（`）定义。

  let str: string = "Hello, TypeScript!";
  

• boolean：表示逻辑值：true 和 false。

  let isActive: boolean = true;
  

• enum：枚举类型用于定义数值集合。

  enum Color {Red, Green, Blue};
  let c: Color = Color.Blue;
  console.log(c);    // 输出 2
  

• void：用于标识方法返回值的类型，表示该方法没有返回值。

  function logMessage(message: string): void {console.log(message);
  }
  

• 其他数据类型：

  • null 和 undefined：表示无值或未定义。
  • any：可以是任意类型。
  • never：表示从不会出现的值，例如函数抛出异常或无限循环。

变量声明

TypeScript 支持多种变量声明方式：

• 声明变量并指定类型：

  let uname: string = "hello";
  

• 声明变量但没有初始值：

  let uname: string;
  

• 声明变量并初始化值，但不指定类型：

  let uname = "hello"; // 类型推断为 string
  

• 声明变量没有设置类型和初始值：

  let uname; // 类型为 any，默认初始值为 undefined
  

变量作用域

变量作用域指定了变量定义的位置，并决定了变量的可用性。TypeScript 中有以下几种作用域：

• 全局作用域：定义在程序结构的外部，可以在任何位置使用。

  var global_num = 12; // 全局变量
  

• 类作用域：类中的变量称为字段，可以通过类的对象访问，也可以是静态的，通过类名访问。

  class Numbers { num_val = 13;      // 实例变量static sval = 10;  // 静态变量storeNum(): void { var local_num = 14; // 局部变量} 
  } 
  

• 局部作用域：在函数或代码块内部定义的变量，仅在该作用域内可用。

  function example() {var local_num = 20; // 局部变量
  }
  

代码运行地址

您可以在 TypeScript 在线运行界面 上测试以下代码：

const hello: string = "Hello World!";
console.log(hello);

总结

通过 TypeScript 的静态类型检查、类型推断、接口、泛型等功能，我们能够编写更可靠、更易于维护的代码。理解和应用这些基础语法、运算符、数据类型和变量作用域，有助于提升代码质量和开发效率。
``