TS标识符-基本数据类型-联合类型

林夕HT
134 阅读12分钟

JavaScript缺点

  1. 类型不安全: JavaScript 是一种弱类型语言，这意味着变量的类型可以在运行时改变。这可能导致类型错误，而这些错误可能在运行时才被发现，增加了调试的难度和代码的不稳定性。
  2. 缺乏类型检查: JavaScript 缺乏静态类型检查，这意味着在编译时不会捕获许多常见的错误，如拼写错误、参数数量不匹配等。这些错误只能在运行时才能被发现。
  3. 难以维护的大型项目: JavaScript 在大型项目中的可维护性相对较差，因为缺乏类型检查和类型安全性会导致难以预测的行为，使得代码更容易出错。
  4. 全局命名空间污染: JavaScript 中缺乏模块系统，导致在大型应用中很容易发生全局命名空间污染，即不同模块或库之间可能会发生变量名冲突。
  5. 回调地狱: JavaScript 中常见的异步编程模式是回调函数，这可能导致代码变得混乱和难以理解，尤其是在处理多个异步操作时，会形成所谓的“回调地狱”。
  6. 难以调试: JavaScript 中的错误信息通常比较晦涩难懂，尤其是在大型应用中，当错误发生时定位问题的源头可能会很困难。
  7. 性能问题: JavaScript 是一种解释性语言，相比于编译型语言，执行效率可能较低。此外，由于动态类型和垃圾回收机制，JavaScript 有时可能会遇到性能问题。
  8. 标准库限制: JavaScript 的标准库相对较小，缺乏一些常见的功能，开发者通常需要依赖第三方库来填补这些空白，这可能会导致依赖管理和版本控制的问题。
  9. 隐式类型转换: JavaScript 中存在隐式类型转换，有时候会导致意想不到的行为。比如，在进行加法运算时，如果其中一个操作数是字符串，那么 JavaScript 会尝试将另一个操作数转换成字符串，而不是报错。
  10. 缺乏整合开发环境（IDE）支持: 尽管现代的集成开发环境（IDE）对 JavaScript 的支持已经相当不错，但是与像 Java 或 C# 这样的静态类型语言相比，IDE 对 TypeScript 的支持可能会更加丰富和准确。
  11. 浏览器兼容性问题: 尽管 JavaScript 是 Web 开发的核心语言，但不同浏览器对 JavaScript 的支持程度不尽相同，有时会导致跨浏览器兼容性问题，需要开发者进行额外的工作来解决。
  12. 异步编程的复杂性: JavaScript 中广泛使用的异步编程模式，如回调函数、Promise 和 async/await，虽然可以有效处理异步操作，但也增加了代码的复杂性和理解难度，特别是对于初学者来说可能会感到困惑。
  13. 内存泄漏: JavaScript 中的垃圾回收机制通常可以有效管理内存，但是在某些情况下，开发者可能会不小心创建内存泄漏，导致不再使用的对象仍然占用内存，这可能会影响应用程序的性能和稳定性。

TypeScript弥补了JavaScript的什么缺点

  1. 静态类型检查: TypeScript 允许开发者在编写代码时定义变量的类型，并在编译时进行静态类型检查。这意味着许多常见的错误可以在编译时被捕获，从而提高了代码的质量和稳定性。
  2. 提高了大型项目的可维护性: 通过提供类型检查和类型安全性，TypeScript 使得在大型项目中更容易进行重构和维护。开发者可以更轻松地理解代码的含义，减少了潜在的错误。
  3. 增强了开发者工具的功能: TypeScript 支持强大的开发者工具，如代码自动补全、重构和导航等，这些工具可以帮助开发者更高效地编写和维护代码。
  4. 更严格的语法检查: TypeScript 引入了更严格的语法检查，可以帮助开发者避免一些常见的错误和陷阱。例如，TypeScript 在比较两个不同类型的变量时会发出警告，这有助于开发者避免一些隐含的错误。
  5. 模块化系统的支持: TypeScript 支持 ECMAScript6 中的模块化系统，使得在大型项目中更容易管理代码结构和依赖关系，避免了全局命名空间污染的问题。
  6. 更好的错误提示和调试支持: TypeScript 在编译时会生成详细的错误信息，帮助开发者更轻松地定位和解决问题。此外，TypeScript 与现代的开发者工具集成良好，提供了更好的调试支持。
  7. 更严格的语法检查: TypeScript 引入了更严格的语法检査，可以帮助开发者避免一些常见的错误和陷阱。例如，TypeScript 在比较两个不同类型的变量时会发出警告，这有助于开发者避免一些隐含的错误。
  8. 增强了工程化和重构支持: TypeScript 的类型系统使得工程化和重构更加容易。开发者可以使用TypeScript 提供的类型信息来进行代码重构，而不必担心意外地破坏代码的行为，从而提高了开发效率和代码质量，
  9. 更好的 IDE 支持: TypeScript 的类型系统使得 IDE 能够提供更准确和更强大的代码提示和补全功能。开发者可以更轻松地浏览代码，查找定义和引用，以及进行重构操作，从而提高了开发效率

总的来说，TypeScript 通过引入静态类型系统、增强代码可读性和可维护性、加强语法检查等方式，弥补了 JavaScript 在类型安全性、代码质量和开发效率等方面的一些缺点，使得开发者能够更加轻松地编写高质量的应用程序。

Typescript特点

  1. 静态类型系统: TypeScript 引入了静态类型系统，允许开发者在编写代码时明确地指定变量的类型，从而提供了更好的类型安全性和错误检查。
  2. 类型推断: TypeScript 可以根据上下文自动推断变量的类型，使得开发者可以在不显式指定类型的请况下编写类型安全的代码。
  3. 支持最新的ECMAScript 标准 : TypeScript 支持最新的 ECMAScript 标准，包括 ECMAScript3.2015+的新特性，如箭头函数、解构赋值、类和模块等。
  4. 可选的强制类型检查: TypeScript 的类型检查是可选的，这意味着开发者可以选择在代码中启用或禁用类型检查，从而灵活地平衡类型安全性和灵活性之间的权衡。
  5. 更好的 IDE 支持: TypeScript 的类型系统可以提供更准确和更强大的IDE 支持，包括代码自动补全、重构、导航和错误检查等功能。
  6. 增强的面向对象编程支持: TypeScript 提供了类、接口、模块等面向对象编程的语法和特性，使得开发者可以更轻松地组织和管理代码。

Typescript的运行环境搭建->运行Typescript代码

方法一

  1. 安装 Node.js: TypeScript 是通过 Node.js 运行的，因此首先需要安装 Node.js。你可以从Node.js 的官方网站 nodejs.org/ 上下载并安装适合你操作系统的版本
  2. 安装 TypeScript: 一旦安装了 Node.js，你可以使用 npm(Node.js 包管理器)来安装Typescript。在命令行中运行以下命令:
npm install -g typescript

这将全局安装 TypeScript，使得你可以在任何地方使用tsc命令编译 TypeScript 代码。

  1. 创建 Typescript 项目: 在你的项目目录中创建一个新的文件夹，并在其中创建 TypeScript 文件。例如，你可以创建一个名为app.ts的文件，并在其中编写 TypeScript 代码。

  2. 编写 TypeScript 代码: 使用你喜欢的文本编辑器编写 TypeScript 代码。例如，你可以在app.ts中编写以下代码:

function sayHello(name: string) {
    console.log("Hello, " + name);
}

let userName = "linxi";
sayHello(userName);

5.编译 Typescript 代码: 在命令行中进入到项目目录，并运行以下命令来编译 TypeScript 代码

tsc app.ts

6.运行 Typescript 代码: 一旦 TypeScript 代码编译成了 JavaScript，你就可以像运行普通的JavaScript 代码一样运行它。例如，你可以在命令行中运行以下命令来执行app.js文件:

node app.js

方法二

安装ts-node

npm install ts-node -g

另外ts-node需要依赖 tslib 和 @types/node 两个包:

npm install tslib @types/node -g

现在，我们可以直接通过 ts-node 来运行TypeScript的代码:

ts-node app.ts

定义Typescript的变量总结

// 定义变量并显式指定类型
let name: string = "linxi";
const age: number = 30;
var isStudent: boolean = true;

// 定义变量并使用类型推断
let firstName = "linxi"; // TypeScript 根据赋值类型自动推断为 string 类型
const numberOfStudents = 50; // TypeScript 根据赋值类型自动推断为 number 类型
var isTeacher = false; // TypeScript 根据赋值类型自动推断为 boolean 类型

// 定义原始类型变量
let num: number = 10; // 数字类型
let str: string = "Hello"; // 字符串类型
let bool: boolean = true; // 布尔类型
let n: null = null; // null 类型
let u: undefined = undefined; // undefined 类型

// 定义引用类型变量
let obj: object = { name: "Alice", age: 30 }; // 对象类型
let arr: number[] = [1, 2, 3]; // 数组类型
let arr2: Array<string> = ["a", "b", "c"]; // 数组类型 使用了泛型
let arr3: any[] = ["a", "b", "c"]; // 数组类型 数组元素任意值
let arr4: string[] = ["a", "b", "c"]; // 数组类型 数组元素字符串
let arr5: number[] = [123,432, 234]; // 数组类型 数组元素数字类型

const tupleArr: [string, number, { name: string }] = ["测试", 12, { name: "萨达" }];//元组类型

let func: Function = () => console.log("Hello"); // 函数类型

let anyType: any = 10; // 任意类型

// 定义函数返回 void 类型的示例
function sayHello(): void {
    console.log("Hello");
}

// 定义函数返回 never 类型的示例
function throwError(message: string): never {
    throw new Error(message);
}

function infiniteLoop(): never {
    while (true) {
        // 无限循环
    }
}

//unknown 类型
let value: unknown;
value = 10;
// 编译错误：无法直接操作 unknown 类型的值
// console.log(value + 5);

// 使用类型断言进行类型转换
if (typeof value === "number") {
    console.log(value + 5); // 可以安全地操作 number 类型的值
}
  • TypeScript 可以根据赋值类型自动推断变量的类型
  • 定义了原始类型变量(number、undefined、string、boolean、null)和引用类型变量(object、Array、Function、any)
  • 定义了函数返回void类型和never类型的函数示例。
  • unknown类型表示未知类型。与any类型不同的是，unknown类型是类型安全的。当你不知道变量的确切类型时，可以使用unknown类型。你不能直接对unknown类型的值执行任何操作，除非你首先对其进行类型检查或类型断言。
  • any类型表示任意类型，但是会关闭 TypeScript 的类型检查;而unknown类型表示未知类型，是类型安全的，你需要进行类型检查或类型断言后才能操作它们。在可能的情况下，应尽量避免使用any类型，而优先考虑使用unknown类型来提高代码的类型安全性。

常见的Typescript特有类型

  1. any:any类型表示任意类型。当你不知道变量的类型，或者你希望接受任意类型的值时，可以使用any类型。使用any类型会关闭 TypeScript 的类型检查，因此它不推荐在大型项目中滥用。
  2. unknown :unknown类型表示未知类型。与'any'类型不同的是，unknown'类型是类型安全的。当你不知道变量的确切类型时，可以使用unknown'类型。你不能直接对unknown类型的值执行任何操作，除非你首先对其进行类型检查或类型断言。
  3. never类型：never类型表示函数不会正常返回(例如，抛出异常或者进入无限循环)，或者变量永远不会被赋予任何值，它通常用于以下几种情况:

    1. 函数抛出异常：当一个函数抛出异常时，它的返回类型可以被推断为 never，因为函数永远不会正常返回。

      function throwError(message: string): never {
    throw new Error(message);
}

    2. 函数陷入无限循环：当一个函数进入无限循环时，它的返回类型也可以被推断为 never，因为函数永远不会正常返回。

      function infiniteLoop(): never {
    while (true) {
        // 无限循环
    }
}

总的来说，never 类型是 TypeScript 特有的，用于表示函数不会正常返回的情况，或者变量永远不会被赋予任何值。

  1. Tuple(元组):Tuple 允许你定义一个固定长度和类型顺序的数组，每个位置的值都有特定的类型。这对于表示固定数量和类型的值的集合非常有用。
  2. Enum(枚举):Enum 允许你创建命名的常量集合，这些常量可以作为类型和值使用。它们可以提高代码的可读性和可维护性，因为它们允许你使用易于理解的名称来代表数字或字符串值。
  3. Union Types(联合类型):Union Types 允许一个值属于多种可能的类型之一。这在需要接受多种类型输入的函数参数或变量声明时非常有用。
  4. Intersection Types(交叉类型):Intersection Types 允许你将多个类型合并为一个类型。这在需要同时具有多种类型特性的对象或函数参数时非常有用。
  5. Literal Types(字面量类型):Literal Types 允许你精确地指定变量的值，而不仅仅是其类型。这对于声明确切的值集合非常有用，从而增强了类型检查的准确性。
  6. Type Aliases(类型别名):Type Aliases 允许你为任意类型创建自定义名称，以便在代码中重复使用。这有助于减少重复代码并提高代码的可读性。
  7. Type Assertion(类型断言):Type Assertion 允许你告诉编译器某个值的确切类型。这对于处理一些特殊情况或者编译器无法推断出类型的情况非常有用，但需要小心使用以避免类型错误。
  8. Mapped Types(映射类型):Mapped Types 允许你根据现有类型创建新类型。这对于根据现有对象创建新对象，或者从接口中生成新接口非常有用。
avatar
文章
阅读
粉丝