TypeScript 完全支持 ES6 的 `class`，并在此基础上引入了更多强大的静态类型功能。 TypeScript 提供了三个访问修饰符来控制类成员（属性和方法）的可见性，这增强了类的封装性。 - **`public`** (默认): 成员在任何地方都可以被访问。 - **`protected`**: 成员只能在**类自身及其子类**中被访问。 - **`private`**:...

字面量类型 (Literal Types) 允许我们将一个变量的类型指定为某个具体的“字面量”值，而不仅仅是 `string` 或 `number`。这是一种非常精确的类型约束。 这是最常见的字面量类型，它将一个变量的可能值限制为几个特定的字符串之一。通常与类型别名（`type`）和联合类型（`|`）结合使用。 ```typescript // 定义一个字符串字面量类型 type...

TypeScript 的核心优势在于其静态类型系统。然而，我们开发的绝大多数项目都依赖于没有使用 TypeScript 编写的第三方 JavaScript 库（如 jQuery, Lodash 等）。为了让 TypeScript 编译器理解这些库的类型信息，从而提供代码补全、类型检查和智能提示，**声明文件**应运而生。 声明文件（通常以 `. ts`...

在 TypeScript 中，接口（`interface`）是定义代码“契约”或“形状”的核心工具。它用于描述对象应该包含哪些属性和方法，而不关心其具体的实现。这使得我们能够编写出更加灵活且结构清晰的代码。 TypeScript 的接口主要用于**描述对象的形状（Shape）**。它定义了一个对象**必须包含哪些属性，以及这些属性的类型**。 ```typescript interface...

JavaScript 的原始数据类型包括：`boolean`、`number`、`string`、`null`、`undefined`、`symbol` 和 `bigint`。TypeScript 为这些类型都提供了相应的类型注解。 使用 `boolean` 定义布尔值类型。 ```typescript let isDone: boolean = false; let isVisible:...

TypeScript 的核心是其类型系统，它为 JavaScript 带来了静态类型检查的能力。 TypeScript 是**静态类型**和**弱类型**的。 静态类型 (Static Typing) 意味着变量、函数参数和返回值的类型在**编译时**就已经确定。这与 JavaScript 在**运行时**才进行类型检查的动态类型机制形成鲜明对比。这种类型具有如下好处： 1. ...

下面我们通过讲解一下使用 React 实现购物车项目，进一步讲解 React Context、React Reducer 的一些知识。 最终效果如下： <Image src={image_image} alt="alt text" /> 我们在 `reducer/CartReducer. jsx` 中封装 Cart 的一些逻辑，具体实现和 `useState` 差不多：...

下面我们通过讲解一下使用 React 实现 翻牌游戏的小项目，进一步讲解 React Effect 的一些知识。 最终效果如下： <Image src={image_image} alt="alt text" /> 这个游戏的组件设计也很简单，只有 Card、Board 和用来装 Score 这些东西的 Header。 下面我们直接讨论游戏的流程引起的状态变化。首先先设计如下的状态：...

在 HTML 中，像 `<input>`, `<textarea>`, 和 `<select>` 这样的表单元素通常会自己维护其内部状态，并根据用户的输入自动更新： ```html <input type="text" name="username" /> ``` 当我们在这个输入框里打字时，是 DOM 节点本身在保存和显示这个值。 但是，React...

下面我们通过讲解一下使用 React 实现 CV 渲染的小项目，进一步讲解 React State 的一些知识。 最终效果如下（非常简陋的 CSS. ）： <Image src={image_image} alt="alt text" /> 首先我们对 CV 进行组件划分，这很简单：我们设计 GeneralInfoForm、PraticalForm、EducationForm...