Angular中的元数据和装饰器怎么应用

本篇内容主要讲解“Angular中的元数据和装饰器怎么应用”，感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷，实用性强。下面就让小编来带大家学习“Angular中的元数据和装饰器怎么应用”吧!作为“为大型前端项目”而设计的前端框架，Angular 其实有许多值得参考和学习的设计，本系列主要用于研究这些设计和功能的实现原理。本文主要围绕 Angular 中随处可见的元数据，来进行介绍。装饰器是使用 Angular 进行开发时的核心概念。在 Angular 中，装饰器用于为类或属性附加元数据，来让自己知道那些类或属性的含义，以及该如何处理它们。不管是装饰器还是元数据，都不是由 Angular 提出的概念。因此，我们先来简单了解一下。元数据（Metadata）在通用的概念中，元数据是描述用户数据的数据。它总结了有关数据的基本信息，可以使查找和使用特定数据实例更加容易。例如，作者，创建日期，修改日期和文件大小是非常基本的文档元数据的示例。在用于类的场景下，元数据用于装饰类，来描述类的定义和行为，以便可以配置类的预期行为。装饰器（Decorator）装饰器是 JavaScript 的一种语言特性，是一项位于阶段 2（stage 2）的试验特性。装饰器是定义期间在类，类元素或其他 JavaScript 语法形式上调用的免费云主机域名函数。装饰器具有三个主要功能：可以用具有相同语义的匹配值替换正在修饰的值。（例如，装饰器可以将方法替换为另一种方法，将一个字段替换为另一个字段，将一个类替换为另一个类，等等）。可以将元数据与正在修饰的值相关联；可以从外部读取此元数据，并将其用于元编程和自我检查。可以通过元数据提供对正在修饰的值的访问。对于公共值，他们可以通过值名称来实现；对于私有值，它们接收访问器函数，然后可以选择共享它们。本质上，装饰器可用于对值进行元编程和向其添加功能，而无需从根本上改变其外部行为。更多的内容，可以参考 tc39/proposal-decorators 提案。我们在开发 Angular 应用时，不管是组件、指令，还是服务、模块等，都需要通过装饰器来进行定义和开发。装饰器会出现在类定义的紧前方，用来声明该类具有指定的类型，并且提供适合该类型的元数据。比如，我们可以用下列装饰器来声明 Angular 的类：@Component()、@Directive()、@Pipe()、@Injectable()、@NgModule()。使用装饰器和元数据来改变类的行为以@Component()为例，该装饰器的作用包括：将类标记为 Angular 组件。提供可配置的元数据，用来确定应在运行时如何处理、实例化和使用该组件。关于@Component()该如何使用可以参考，这里不多介绍。我们来看看这个装饰器的定义：以上便是组件装饰、组件元数据的定义，我们来看看装饰器的创建过程。装饰器的创建过程我们可以从源码中找到，组件和指令的装饰器都会通过makeDecorator()来产生：在上面的例子中，我们通过makeDecorator()产生了一个用于定义组件的Component装饰器工厂。当使用@Component()创建组件时，Angular 会根据元数据来编译组件。根据装饰器元数据编译组件Angular 会根据该装饰器元数据，来编译 Angular 组件，然后将生成的组件定义（cmp）修补到组件类型上：编译组件的过程可能是异步的（比如需要解析组件模板或其他资源的 URL）。如果编译不是立即进行的，compileComponent会将资源解析加入到全局队列中，并且将无法返回cmp，直到通过调用resolveComponentResources解决了全局队列为止。编译过程中的元数据元数据是有关类的信息，但它不是类的属性。因此，用于配置类的定义和行为的这些数据，不应该存储在该类的实例中，我们还需要在其他地方保存此数据。在 Angular 中，编译过程产生的元数据，会使用CompileMetadataResolver来进行管理和维护，这里我们主要看指令（组件）相关的逻辑：可以看到，在编译过程中，不管是组件、指令、管道，还是模块，这些类在编译过程中的元数据，都使用Map来存储。到此，相信大家对“Angular中的元数据和装饰器怎么应用”有了更深的了解，不妨来实际操作一番吧！这里是百云主机网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！