Module 02 · Understanding Function Components with Array and DOM Manipulation函数组件、数组与 DOM 操作
Module 2 Glossary: Understanding Function Components with Array and DOM Manipulation第 2 模块术语表：函数组件、数组与 DOM 操作
Welcome! This alphabetized glossary contains many of the terms you'll find within this course. This comprehensive glossary also includes additional industry-recognized terms not used in course videos. These terms are important for you to recognize when working in the industry, participating in user groups, and participating in other certificate programs.
欢迎！本按字母顺序排列的术语表包含您在本课程中会发现的大部分术语。本全面的术语表还包括课程视频中未使用的额外行业认可术语。这些术语对于您在行业工作、参与用户组以及参与其他证书项目时识别它们非常重要。
| Term 术语 | Definition 定义 |
|---|---|
| Abstraction principle 抽象原则 | A principle that provides a way to make reusable components that encapsulate UI features. 一个提供创建封装 UI 功能的可重用组件的方法的原则。 |
| Array 数组 | A data structure in JavaScript used to store multiple values in a single variable. JavaScript 中用于在单个变量中存储多个值的数结构。 |
| Array destructuring 数组解构 | A feature that allows you to extract values from an array and assign them to individual variables. 一个允许您从数组中提取值并将它们分配给单独变量的功能。 |
| Array literal 数组字面量 | A syntax in JavaScript for creating arrays. It allows you to define an array by enclosing a comma-separated list of elements within square brackets. JavaScript 中创建数组的语法。它允许您通过将逗号分隔的元素列表放在方括号内来定义一个数组。 |
| Attributes 属性 | Provide additional information about elements. They can specify properties, styles, or behavior. 提供有关元素的其他信息。它们可以指定属性、样式或行为。 |
| Component composition 组件组合 | A combination of multiple smaller components to create complex functionality. 多个较小组件的组合以创建复杂功能。 |
| Document object model (DOM) 文档对象模型（DOM） |
An interface for web pages and documents used to represent an HTML structure as a tree-like structure. 一个用于表示 HTML 结构的网页和文档的界面，以树状结构呈现。 |
| Elements 元素 | Are the building blocks of HTML documents. HTML 文档的构建块。 |
| forEach() | A method that iterates over each element of an array and executes a callback function. 一个遍历数组中每个元素并执行回调函数的方法。 |
| Hierarchy principle 层次原则 | A principle that allows you to arrange components in a hierarchy, with parent and child components. 一个允许您按层次结构排列组件的原则，包括父组件和子组件。 |
| Higher-order component 高阶组件 | A function that allows you to add components' features, such as state management or logic, without modifying its implementation. 一个允许您添加组件功能，如状态管理或逻辑，而不修改其实现的函数。 |
| Hook 钩子 | A function that enables you to reuse code logic across components without changing component hierarchy or introducing unnecessary nesting. 一个函数，允许您在不改变组件层次结构或引入不必要的嵌套的情况下，跨组件重用代码逻辑。 |
| Initialization 初始化 | A step in which React runs the function body of the functional component, setting up the initial structure and behavior of the component. 一个步骤，React 运行函数组件的函数体，设置组件的初始结构和行为。 |
| map() | A method commonly used to iterate over each element of an array and return a new array of React elements. 一种常用的方法，用于遍历数组的每个元素并返回一个新的 React 元素数组。 |
| Mounting phase 挂载阶段 | A functional component lifecycle phase in which React initializes the functional component, preparing it for rendering on the DOM. React 初始化功能组件的生命周期阶段，为在 DOM 上渲染准备组件。 |
| Props Default 属性默认 | Is default value for props using defaultProps. This ensures that if a prop is not provided, the component will still render with the default value, enhancing predictability and robustness in component behavior. 使用 defaultProps 设置 props 的默认值。这确保了如果未提供 prop，组件仍将使用默认值进行渲染，增强了组件行为的可预测性和健壮性。 |
| Properties (props) 属性（props） | A fundamental concept in React for passing data from parent to child components. They enable communication and customization between different parts of a React application. React 中从父组件传递数据到子组件的基本概念。它们使 React 应用的不同部分之间能够进行通信和定制。 |
| Rendering Array 渲染数组 | Involves dynamically generating and displaying elements based on the contents of the array. This is commonly done using JavaScript's map() function to iterate over the array and generate React elements for each item. 涉及根据数组内容动态生成和显示元素。这通常使用 JavaScript 的 map()函数遍历数组并为每个项目生成 React 元素来完成。 |
| Reuse principle 重用原则 | A principle to reuse chunks of code, making it easier to organize and maintain. 一个原则是重用代码块，使其更容易组织和维护。 |
| Side effects 副作用 | A step that includes data fetching, subscriptions, or DOM manipulation using the 'useEffect' hook with an empty dependency array. 一个包含使用空依赖数组的 'useEffect' 钩子进行数据获取、订阅或 DOM 操作的步骤。 |
| State 状态 | The condition of a component at a specific time and it holds information that influences the object's behavior and renders it based on that information. 组件在特定时间的状态，它包含影响对象行为并据此渲染对象的信息。 |
| State management 状态管理 | Involves handling and updating the data over time, allowing components to dynamically change their appearance and behavior in response to user actions or other events. 涉及随着时间的推移处理和更新数据，允许组件根据用户操作或其他事件动态更改其外观和行为。 |
| State initialization 状态初始化 | A step in which React utilizes the 'useState' hook to declare and initialize state variables within the component. 一个步骤，其中 React 使用 useState钩子来声明和初始化组件内的状态变量。 |
| Updating phase 更新阶段 | A functional component lifecycle phase in which React responds to changes in the component's state or props by re-invoking the function body of the component. 组件生命周期阶段，React 通过重新调用组件函数体来响应组件状态或属性的变化。 |
| Unmounting phase 卸载阶段 | A functional component lifecycle phase in which React executes cleanup operations when removing a component from the DOM. 组件生命周期阶段，React 在从 DOM 中移除组件时执行清理操作。 |
| useState hook useState 钩子 | A built-in React Hook that allows functional components to manage state. It provides a way to declare state variables and update them within a functional component. When the state changes, React automatically re-renders the component to reflect the updated state. 一个内置的 React Hook，允许函数组件管理状态。它提供了一种在函数组件中声明状态变量并更新它们的方法。当状态发生变化时，React 会自动重新渲染组件以反映更新的状态。 |
| Virtual DOM 虚拟 DOM | An abstraction of the actual DOM implemented in memory and is kept in sync with the real DOM by React's reconciliation process. 实际 DOM 在内存中的抽象，并通过 React 的协调过程与真实 DOM 保持同步 |