Typescript:访问装饰器声明中类的其他函数/属性
Typescript是一种开源的编程语言，它是JavaScript的超集，可以编译为纯JavaScript代码。Typescript通过添加静态类型和其他特性来增强JavaScript的功能，使得开发更加可靠和高效。
在Typescript中，装饰器是一种特殊的声明，它可以附加到类、方法、属性或参数上，以扩展它们的行为。装饰器可以在不修改原始类代码的情况下，通过在类的声明中添加元数据来修改类的行为。
要访问装饰器声明中类的其他函数/属性，可以使用装饰器工厂函数和装饰器应用顺序来实现。
首先，定义一个装饰器工厂函数，它接收参数并返回一个装饰器函数。装饰器函数接收三个参数：目标类的原型、装饰器应用的属性名称和属性描述符。在装饰器函数中，可以访问目标类的其他函数/属性，并对它们进行修改或扩展。
以下是一个示例：
function accessDecoratorFactory() {
return function(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
// 访问目标类的其他函数/属性
console.log(target);
console.log(target[propertyKey]);
// 修改或扩展目标类的其他函数/属性
// ...
// 返回修改后的属性描述符
return descriptor;
}
}
class MyClass {
@accessDecoratorFactory()
myMethod() {
// ...
}
}在上面的示例中，accessDecoratorFactory是装饰器工厂函数，它返回一个装饰器函数。@accessDecoratorFactory()将装饰器应用于myMethod方法。在装饰器函数中，可以访问MyClass类的其他函数/属性，并对它们进行修改或扩展。
需要注意的是，装饰器的应用顺序是从上到下的，即先应用的装饰器会被后应用的装饰器包裹。这意味着在装饰器函数中访问其他装饰器声明中的函数/属性时，应考虑装饰器的应用顺序。
关于Typescript的更多信息和使用方法，可以参考腾讯云的相关产品和文档：
相关·内容
我试图在一个没有包含在类中的函数中添加一个自定义的TypeScript装饰器，似乎无论我做什么编译器都会报错。
有什么想法吗？有可能吗？
浏览 0提问于2016-05-30得票数 32
回答已采纳
2回答
我正在使用angular2 2/Typescript构建一个应用程序，并试图访问作为依赖项注入的服务。在角1.x中，我可以通过控制器函数访问这个服务，所有子函数都可以访问相同的依赖项。在这里，我通过组件的构造函数注入它，如下所示：
constructor( @Inject(JRummy) rummyGame: JRummy) {
this.currentGame = new Game();
rummyGame.startGame(this.currentGame);
}
其中rummyGame是我试图注入的服务。工作正常。但是，在构造函数中访问
浏览 5提问于2016-04-30得票数 2
回答已采纳
我正在尝试用一个装饰器来扩展一个类的原型，这个装饰器使用TypeScript的experimentalDecorator支持。
export function Foo() {
return function (target) {
target.prototype.bar = 'baz';
}
};
虽然这个装饰符似乎适用，但TypeScript不能识别原型扩展。
@Foo()
class Qux {
constructor () {
this.bar; // Property 'style' doesn't exi
浏览 13提问于2016-09-01得票数 0
回答已采纳
我有一个简单的数据模型，我想用元数据对其进行注释 export class Certification {
title: string;
certificationType?: CertificationType;
validTo?: number;
description?: string;
externalIdentifier: Guid;
constructor() {
this.title = '';
this.certificationType = CertificationType.
浏览 19提问于2020-04-29得票数 0
回答已采纳
我一直在摆弄Typescript中的装饰器，我有一个简单的问题，假设我有一个名为RetainType的自定义装饰器和一个如下所示的类：
class Person {
@RetainType name: string;
@RetainType age: number;
@RetainType dateOfBirth: Date;
}
我希望能够这样写：
@RetainType class Person {
name: string;
age: number;
dateOfBirth: Date;
}
换句话说，有没有办法将装饰器应用于类中的所有属性
浏览 9提问于2016-08-18得票数 5
1回答
类装饰器(实例级)
、、、
我试图在属性上添加一个类decorator，并在instance中修改这个属性。
这在typescript中很好，但是我不想使用typescript，只使用babel，而不使用任何其他编译器。
我的猜测是，target在el函数中是class而不是instance，而在使用typescript时并非如此。
如果有人知道如何使用babel和不使用typescript来完成这项工作
带类型记录的演示：
仅限babel演示：
function el(type) {
return function descriptor(target, key,dec) {
let value = tar
浏览 6提问于2017-12-23得票数 1
回答已采纳
TypeScript中的“装饰器”是什么？为什么要使用它们？@符号的用途是什么？如果我们应用装饰器，会发生什么？
我在谷歌上也找不到清晰的想法。
浏览 10提问于2017-02-24得票数 0
回答已采纳
1回答
我正试图在我的angular服务中加载一个外部typescript类。我有一个名为anyservice的服务。我在一个文件夹中创建了一个导出类，我想在我的服务中获得一个函数，我的类代码是：
export class Functions {
testy() {
alert("I am testy");
}
}
我在我的服务中调用这个函数类，使用：
import{Functions} from '../data/f'
但在我的服务中，当我尝试使用以下命令来获取它时：
constructor(private f: Functions)
我收到错误消息：
浏览 0提问于2018-06-28得票数 0
基本上是。但很少有更多的要求。
如何使用属性装饰器而不是类装饰器向类添加新的属性/方法？
关键是-如何自动完成这一工作？支持TypeScript可以推断添加的键吗？在中，我们必须手动添加类型信息。TypeScript有可能推断它吗？
举个例子：
class HeaderComponent extends Vue {
// @Stream$ should add key teanantId$ to class?
@Stream$((store) => store.urlState.tenantId)
public tenantId: number;
浏览 2提问于2018-05-25得票数 0
像这样
enum Response {
@Descriptor("this is No")
No = 0,
@Descriptor("this is Yes")
Yes = 1,
}
如何在TypeScript中在枚举上使用装饰器，我尝试了这段代码，但它没有工作
export function Description(description:string){
return Reflect.metadata(descriptionMetadataKey, description);
}
浏览 0提问于2018-09-06得票数 14
回答已采纳
我正在使用typescript进行angular 2应用程序开发。
但当我们为组件或路由配置或其他地方编写代码时，我们使用"@“符号。
我的问题是这个符号是什么意思，为什么需要它？
浏览 271提问于2016-07-03得票数 32
1回答
有没有一种在TypeScript中进行代码编织的方法？
我想要做的是将一段代码作为我的TypeScript应用程序中每个函数的第一行，并且我不习惯手动这样做(这种手工方法既乏味又容易出错)。
浏览 1提问于2016-02-11得票数 4
回答已采纳
2回答
我想知道是否可以使用TypeScript 1.5从一个类创建一个属性装饰器？我的意思是从
function Inject(value = null) {
return function (target:Object, propertyKey:string) {
target[propertyKey] = value;
};
}
到像这样的类
class Inject{...}
如果这是可能的，我们怎么做？
感谢你的预支
浏览 1提问于2015-06-03得票数 1
2回答
我有一个构建在带有装饰器的typescript上的应用程序，用于一些方便的属性分配，并想知道如何为它们编写单元测试。
export function APIUrl() {
return function (target: any, key: string) {
let _value = target[key];
function getter() {
return _value;
}
function setter(newValue) {
浏览 0提问于2016-08-24得票数 6
回答已采纳
我想知道为什么TypeScript中的这个特性叫做Decorator
它只是一个与Annotation或Attribute不同的名字吗？还有别的原因吗？
Decorator和Annotation/Attribute的区别是什么？
浏览 5提问于2016-04-30得票数 14
回答已采纳
5回答
现在有了。
有人能提供一个简单的例子来演示实现装饰器的正确方法，并描述可能的有效装饰签名中的参数是什么意思吗？
declare type ClassDecorator = <TFunction extends Function>(target: TFunction) => TFunction | void;
declare type PropertyDecorator = (target: Object, propertyKey: string | symbol) => void;
declare type MethodDecorator = <T>(tar
浏览 5提问于2015-04-21得票数 225
回答已采纳
我最近开始在Range2中使用，但现在我一直在想，它们是否也可以在没有TypeScript注释的情况下在ES6中使用。
TypeScript语法，按照，如下所示：
@ViewChild(ItemDirective) viewChild: ItemDirective;
或者，按照
// myVideo == #my-video
@ViewChild('myVideo') myVideo: any;
现在，对应的有用于ViewChild和co的元数据类，我记得可以使用这些元数据类在普通JS中添加一些其他注释。所以我觉得应该是可行的，但我不太确定在这种情况下该怎么做。有人能弄清楚这件
浏览 2提问于2016-02-07得票数 2
回答已采纳
@tl;dr
我希望在不使用类型记录中的自组织/提供程序的情况下扩展React组件。
好吧，这是交易..。
在我工作的地方，我们曾经和Vue和普通JS一起工作.然后我们决定迁移到打字稿上.
技术我们使用：- React Typescript - Redux - Redux-Saga
问题是，在Vue，我们可以声明如下：
Vue.use(Auth)
在每个.vue文件中，我们可以在脚本标记中调用以下内容：
this.$auth
并有权使用授权方法。
我想做的是..。创建ReactComponent的扩展，其中我已经创建了大多数组件将使用的一些方法.类似于：
//检查用户是否经过身份验证，如
浏览 2提问于2019-04-29得票数 0
每个typescript装饰器都需要定义这个?这是什么意思?为什么不在typescript语言中设置这个默认值，或者开发人员每次都需要编写这个。 function classDecorator<T extends {new(...args:any[]):{}}>(constructor:T) {}
浏览 166提问于2019-09-23得票数 1
回答已采纳
在heros教程中，app.component.ts代码如下所示：
import { Component } from '@angular/core';
export class Hero {
id: number;
name: string;
}
@Component({
selector: 'my-app',
template: `
<h1>{{title}}</h1>
<h2>{{hero.name}} d
浏览 3提问于2017-04-19得票数 0
回答已采纳
1回答
我在打字稿中创建动态功能。在这些动态函数上，我想添加装饰器。实现这种情况的最佳方法是什么？这有可能吗？
想要实现这样的目标
@decorator1
@decorator2
var dynamicFunction = new Function('a', 'b', 'return a + b');
alert(dynamicFunction(2, 3));
另外，如果我要创建多个动态函数，如何在它们上添加装饰器？
例如：
var dynamicFunction:Array<Functions>;
for (i=0; i<10; i
浏览 1提问于2018-10-08得票数 3
2回答
我尝试使用vue-injector，但它使用我的Vue (2.6.10)和Typescript (3.4.5)版本编译。 我几乎看不到其他选择。 在纯粹的typescript方面，我看到了像Inversify和TSyringe这样的东西，它们看起来很好，但不能开箱即用。 这是inversify： Argument of type typeof App' is not assignable to parameter of type 'VueClass<Vue>'.
Type 'typeof App' is not assignab
浏览 99提问于2019-05-23得票数 0
1回答
Vue类组件是一种相对较新的编写单文件组件的方法。看起来是这样的：
import Vue from 'vue'
import Component from 'vue-class-component'
// The @Component decorator indicates the class is a Vue component
@Component({
// All component options are allowed in here
template: '<button @click="onClick">
浏览 1提问于2018-10-15得票数 11
回答已采纳
考虑到下面的脚本(可以在中找到)，"@“字符意味着什么？它是ecmascript 6特性吗？
有人能详细解释一下吗？
import {Component} from 'angular2/core';
export class Hero {
id: number;
name: string;
}
@Component({
selector: 'my-app',
template:`
<h1>{{title}}</h1>
<h2>{{hero.name}} details!</h2&g
浏览 8提问于2016-03-26得票数 5
回答已采纳
1回答
我在typescript/angular中以以下方式使用装饰器
export function Field({source}){
return (target, property) => {
// Some code here
}
}
然后我想这样使用它
export class MyClass {
constructor(private myService: MyService) {}
@Field({source: () => this.myFn()})
myProp: string;
private myFn() {
// an
浏览 2提问于2020-05-28得票数 0
回答已采纳
假设我有一个目标：
class Person{
id: number;
name: string;
}
以及API的Json：
{
"id": "10",
"name": "Person Name",
"email": "per@ho.com"
}
如何将JSON转换为Person对象，特别是Person类中的变量？
我试过这个：
Object.assign(Person.prototype, this.jsonList))
但我不工作
浏览 2提问于2017-05-27得票数 0
回答已采纳
在Java中，我们可以使用“类路径扫描”找到所有具有给定注释的类。
我们如何在TypeScript中做类似的事情呢？有没有办法找到所有的类都装饰了一些装饰？
浏览 2提问于2015-05-30得票数 5
回答已采纳
Typescript 3.0.1在我的类中为我的setter提供了一个编译错误，但当我运行我的JS时，它仍然可以正常工作，正如你在图片上看到的那样。
代码如下所示：
这有什么原因吗？我怎么才能让它编译的时候没有错误，因为它让我在学习Typescript时感到困惑。
浏览 0提问于2018-10-17得票数 0
因此，我试图建立对Typescript装饰器的理解，并且我一直停留在关于类装饰器的例子上。给出的例子展示了如何通过function(){}形成类装饰器。
function classDecorator<T extends {new(...args:any[]):{}}>(constructor:T){
return class extends constructor {
newProperty = "new property";
hello = "override";
浏览 2提问于2019-05-20得票数 2
在上玩装饰器时，我注意到，在第3行中，转换代码检查了Reflect.decorate函数的存在。
这个功能是关于什么的？我既没有在上也没有在上找到这一点。
浏览 0提问于2017-07-18得票数 9
回答已采纳
我刚刚在TypeScript 0.9.5中启动了一个新项目，下面的代码抛出了一个错误：
类服务声明了IService，但没有实现它。属性'getUserInfo‘定义为私有类型服务，在类型IService上定义为公共属性
module App.Interfaces {
export interface IService {
getUserInfo(): void;
}
}
module App.Services {
export class Service implements App.Interfaces.IService {
浏览 0提问于2014-01-25得票数 9
回答已采纳
我用Symfony2编写了很多使用注释的代码。在Symfony和Doctrine中，注释是可选的，您可以使用yaml、xml或纯PHP配置实体映射、路由和任何其他内容。
我可以将我的代码准备为无symfony，然后我可以创建一个将其与symfony集成的包。
然后我开始学习Angular2和TypeScript。有装饰者用来做任何事情。组件元数据的装饰器，服务的装饰器，一切。
因此，如果我想创建一个服务，用于我的应用程序，我必须将其标记为可注入。
是否可以单独添加装饰器(以某种合理方式)，以便我可以将外部类注入到Angular2的DI中。
浏览 2提问于2016-03-18得票数 1
我会非常理解角@HostBinding的概念。不幸的是，我的书很好，但这个概念并没有很清楚地解释。
请参见代码：
@Component({
selector: 'app-test-component',
templateUrl: './test-component.component.html',
styleUrls: ['./test-component.component.css']
})
export class TestComponentComponent implements OnInit {
@Input() dat
浏览 2提问于2018-11-12得票数 3
回答已采纳
3回答
我有TypeScript NestJS项目。
我需要验证传入的DTO到我的API。它可以被描述为“创建项目”，在这里我们有类型的建筑(房屋、公寓、花园)，根据这种类型，我们需要定义：
楼:楼层，包括房间
平房:房间
花园:什么都没有(这是一个“房间”)
房屋类型的例子：
{
type: HOUSE,
floors: [
{
name: "1st floor",
rooms: [
{
name: "bedroom"
}
]
}
]
浏览 5提问于2020-02-14得票数 7
1回答
从修饰类方法中检索导入字符串
、、、、
我正在尝试检索修饰@classmethod中的导入字符串，以便在管道系统中注册该字符串。但是，当我检查装饰器函数中的函数对象时，无法找到任何关于类对象或类名的信息。
代码看起来是这样的：
def import_string_decorator(**opt_kwargs):
def wrap(f):
# Here is the problem
if inspect.ismethod(f):
class_name = f.im_self.__name__
import_string = f.__module
浏览 2提问于2015-03-02得票数 0
回答已采纳
1回答
我希望强制执行typescript接口的某些成员在它们的实现中需要装饰器。
下面是我的示例界面：
export interface InjectComponentDef<TComponent> {
// TODO is it possible to make this only allow properties decorated with @Input()
inputs: Partial<TComponent>, // & { @Input() [key: string]: any } my attempt to enforce decorator,
浏览 0提问于2021-04-29得票数 1
2回答
我有一些类型记录代码，我正在做一些元编程，我需要能够访问instance.func.name，但是typescript忽略了编译后的JS中的函数名。
TypeScript：
class ClassName {
// ...
func(): ReturnType {
// ...
}
}
编译的JavaScript：
// ...
ClassName.prototype.func = function () {
// ...
};
期望的JavaScript：
ClassName.prototype.func = function func()
浏览 9提问于2015-11-11得票数 10
3回答
我对角上的指令和译码器感到很困惑。我以为任何以@作为前缀的东西都是一个装饰品，现在当我读到它说的指令时，组件就是一个指令。到底怎么回事？关于这一问题的任何澄清都将是有益的。
浏览 0提问于2019-09-09得票数 4
回答已采纳
constructor( @IStorageService storageService: IStorageService)和constructor( storageService: IStorageService)有什么区别？
github上的代码
import {TPromise} from 'vs/base/common/winjs.base';
import {Remotable, IThreadService} from 'vs/platform/thread/common/thread';
import {IStorageService, Stora
浏览 1提问于2022-07-12得票数 0
回答已采纳
我试图理解在角2中的服务中添加@Injectable()装饰的必要性。
来自文档：
为什么我们不将@Injectable()添加到HeroesComponent中呢？如果我们真的想要的话可以加进去。没有必要，因为HeroesComponent已经用@Component来修饰了。TypeScript为任何有装饰器的类生成元数据，任何装饰器都可以。
因此，基本上您只需要在没有其他装饰可用的情况下添加@Injectable()，因为如果有任何可用类型的装饰，类型记录编译器将根据在构造函数(例如.：constructor(private logger: Logger) )中传递的变量自动生成依
浏览 1提问于2016-01-04得票数 7
回答已采纳
我正在努力学习如何制作自己的装饰品。我不知道如何“调用”被包装的函数中的数据。
我正在尝试做一个非常简单的装饰器，将msg的值写到一个文本文件中。
def logging(f):
def decorator(args, **kwargs):
debug_file = "/tmp/easylog.txt"
fh = open(debug_file, 'a')
fh.write(f.message + "\n")
fh.close()
return deco
浏览 0提问于2016-02-17得票数 1
我能够理解事务处理器文件中装饰器的用法。
您可以提供完整的示例装饰器应用于.cto文件中的资源，并在其他文件中访问。
浏览 0提问于2017-11-30得票数 0
1回答
对于下面给定的语法，
import validator from "./ZipCodeValidator";
在构建/捆绑时，将对象的字典从ZipCodeValidator.ts导入到当前名称空间中的命名validator，
其中ZipCodeValidator.ts看起来像：
export class C {
@f()
@g()
method() {}
}
在构建/捆绑时运行导入语句(上面)时，是否对ZipCodeValidator.ts中的方法进行注释？
浏览 0提问于2018-05-04得票数 1
回答已采纳
1回答
我很难理解如何使用Typescript decorators。我有这样的代码：
class Address {
private street: string;
private city: string;
private state: string;
private zipCode: string;
@displayName("Street")
get streetHtml() { return this.street; }
@displayName("City")
get cityHtml()
浏览 5提问于2016-10-14得票数 0
回答已采纳
1回答
我想了解的是，什么是不同的参数的文字文字装饰。
function myDecorator(target) {
// do something with 'target' ...
}
在上面的示例中，我知道target表示装饰器附加到的函数/类，但是装饰器的其他参数是什么，它们的意思是订单，我还想获得一个指向指定这一点的正式文档的链接。
提前谢谢。
浏览 0提问于2021-02-27得票数 1
回答已采纳
问题是，我想使用一个装饰方法，它从装饰器中检索一个属性，而装饰器接收方法的参数，制作一些东西，并用这些东西的结果调用装饰方法。
下面是一个示例
export function Augment(
target: any,
propertyKey: string,
descriptor: PropertyDescriptor
) {
const method = descriptor.value;
descriptor.value = function(message: string) {
return method.call(this, {
data: m
浏览 0提问于2019-11-29得票数 0
我有一个类装饰器(fooAnnotation)和一个方法装饰器(barDecorator)。
import 'reflect-metadata';
function fooAnnotation(value: string){
console.log('fooAnnotation init...');
return (target: any): void => {
console.log('fooAnnotation called...');
Reflect.defineMetadata('fooAnnota
浏览 9提问于2019-08-29得票数 1
我正在尝试组装一个小的angular2应用程序:我不是在使用TypeScript，而是使用babel的常规ES6
我的文件看起来是这样的：
//mycomponent.js
import { Component, View } from 'angular2/angular2';
@Component({
selector: 'my-app'
})
@View({
template: '<h1>My First Angular 2 App</h1>'
})
class MyComponent {
constru
浏览 2提问于2015-11-02得票数 7
回答已采纳
我正在尝试将我的TypeScript /create应用程序从MobX 5迁移到MobX 6。在官方迁移指南( )中，他们建议如下：
删除所有装饰器并调用构造函数中的makeObservable，并显式定义使用哪个装饰器应该可以观察到哪个字段。
但他们并没有说如何使用TypeScript应用程序来实现这一目标。给出的例子总是直接使用普通的JavaScript和React.RenderDOM。
下面是一个简化示例的开头--我需要迁移的一个典型类：
@observer
export default class LoginPage extends React.Component<ILogi
浏览 2提问于2021-02-19得票数 4
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
