带有箭头功能的typescript装饰器
带有箭头功能的TypeScript装饰器是一种特殊的装饰器，它可以在装饰器函数中使用箭头函数语法。装饰器是一种用于修改类、方法、属性或参数的行为的特殊函数。
箭头功能的TypeScript装饰器可以用于以下场景：
- 记录日志：通过在方法或类上应用装饰器，可以在方法执行前后记录日志，以便跟踪方法的调用和执行情况。
- 计时器：装饰器可以用于测量方法的执行时间，以便进行性能优化或统计分析。
- 权限控制：通过在方法或类上应用装饰器，可以实现对方法或类的访问权限控制，例如只允许特定角色或用户执行某些操作。
- 缓存：装饰器可以用于缓存方法的结果，以提高性能和减少重复计算。
- 输入验证：通过在方法或类上应用装饰器，可以对方法的输入参数进行验证，以确保输入的有效性和安全性。
腾讯云提供了一些与TypeScript装饰器相关的产品和服务：
- 云函数（Serverless Cloud Function）：腾讯云的无服务器计算服务，可以使用TypeScript编写云函数，并在函数中应用装饰器来实现各种功能。
- 云开发（Tencent Cloud Base）：腾讯云的一站式后端云服务，支持使用TypeScript编写云函数和云数据库，并在代码中应用装饰器来简化开发和提高效率。
- 云API网关（API Gateway）：腾讯云的API管理和发布服务，可以使用TypeScript编写自定义插件，并在插件中应用装饰器来扩展API网关的功能。
- 云监控（Cloud Monitor）：腾讯云的监控和告警服务，可以使用TypeScript编写自定义监控指标，并在代码中应用装饰器来收集和上报指标数据。
请注意，以上产品和服务仅为示例，实际使用时应根据具体需求选择适合的产品和服务。更多关于腾讯云的产品和服务信息，请访问腾讯云官方网站：https://cloud.tencent.com/
相关·内容
1回答
在TypeScript中，我定义了一个装饰器
function Foo(type: AnEnum) {
return <T extends { pattern: RegExp, new(...args: any[]): {} }>(constructor: T) => {
RegisterPattern(pattern) // defined elsewhere
return class extends constructor {
public type: AnEnum = type
}
浏览 6提问于2018-01-11得票数 0
回答已采纳
TypeScript中的“装饰器”是什么？为什么要使用它们？@符号的用途是什么？如果我们应用装饰器，会发生什么？
我在谷歌上也找不到清晰的想法。
浏览 10提问于2017-02-24得票数 0
回答已采纳
我正在尝试创建一个react类装饰器，它向任何react组件添加一些道具，并返回装饰器中包含当前道具和额外道具的装饰组件。
我能够找到一个常规typescript类装饰器的工作代码，可以在typescript的上找到。但是，这是针对泛型类的。它不包含任何react类型。
下面是我想用React和Typescript实现的类似功能：
@AddOtherProps
class BasicComponent extends React.Component {
static defaultProps = {
someProp: ''
};
construct
浏览 17提问于2018-08-30得票数 2
1回答
我目前正在学习Node的TypeScript。读到关于TypeORM的文章，我发现reflect-metadata包是TypeORM工作所必需的。需要这个包的原因是什么？
浏览 0提问于2018-04-02得票数 9
回答已采纳
1回答
有没有一种在TypeScript中进行代码编织的方法？
我想要做的是将一段代码作为我的TypeScript应用程序中每个函数的第一行，并且我不习惯手动这样做(这种手工方法既乏味又容易出错)。
浏览 1提问于2016-02-11得票数 4
回答已采纳
1回答
在 on AdonisJS中，Post类定义包括@column节。有人能解释一下这是怎么回事吗？我假设它是在Post类中创建多个'column‘类实例，作为成员变量，每个实例具有不同的名称和数据类型。但是这是如何工作的，“符号”是什么意思呢？
import { column, BaseModel } from '@ioc:Adonis/Lucid/Orm'
export default class Post extends BaseModel {
@column({ isPrimary: true })
public id: number
浏览 0提问于2021-08-04得票数 2
回答已采纳
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
回答已采纳
1回答
我只是好奇如何让Windows在WPF应用程序中拖放时使用高质量的光标。我所说的高质量是指：
而不是带有矩形的常规箭头。我试着使用e.Effect，但没有任何效果...我做错了什么吗？或者这只是它在WPF中的样子。
浏览 0提问于2012-03-02得票数 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回答
如何使用Angular跟随光标？
、、、、
我在Angular中创建了一个带有动画的简单应用程序()。它使用我们可以切换的状态，让眼睛看起来像我们想看的任何地方。
现在我希望能够使用纯Angular/TypeScript (而不是jQuery...)来跟踪鼠标光标，这样只要鼠标移动，眼睛就会看着光标的方向。
任何建议都将不胜感激。
浏览 2提问于2017-12-09得票数 1
我正在使用typescript进行angular 2应用程序开发。
但当我们为组件或路由配置或其他地方编写代码时，我们使用"@“符号。
我的问题是这个符号是什么意思，为什么需要它？
浏览 271提问于2016-07-03得票数 32
我使用TypeScript类在AngularJS中定义控制器：
class TrialsCtrl {
constructor(private $scope: ITrialsScope, private ResourceServices: ResourceServices) {
this.loadTrials();
}
loadTrials() {
console.log("TrialsCtrl:", this);
this.Trial.query().then((result) =>
浏览 6提问于2016-05-12得票数 1
回答已采纳
EDIT1 1:我创建了一个最小的再现存储库
代码和再现步骤可在存储库中使用。
EDIT2:当我在html文件.上嵌入转换的代码时也会发生同样的错误。
EDIT3:我找到了这个问题的主要原因。
当我使用气webpack插件时，输出文件会吐出这个错误.简单地删除插件解决了问题，但我不能访问我的主要功能的气体。
我创建了一个。希望有办法解决这个问题。
-原来的问题-
我用Clasp +打字稿+ Webpack + Babel在当地开发带有npm库的GAS。
直到我在我的项目中使用了装饰师，它才能正常工作。然而，使用修饰器(更准确地说，是类验证器)会导致后续的气体错误.
TypeError: (0
浏览 10提问于2022-03-02得票数 0
回答已采纳
1回答
我有一个简单的带有递归的typescript组件： <template>
<div :style="{ paddingLeft: depth * 20 + 'px' }">
<h1>Level {{ depth }}</h1>
<div v-if="depth < 2">
<Recursive v-for="i in 3" :key="i" :depth="depth + 1"/>
浏览 10提问于2020-07-08得票数 1
回答已采纳
我最近开始在Range2中使用，但现在我一直在想，它们是否也可以在没有TypeScript注释的情况下在ES6中使用。
TypeScript语法，按照，如下所示：
@ViewChild(ItemDirective) viewChild: ItemDirective;
或者，按照
// myVideo == #my-video
@ViewChild('myVideo') myVideo: any;
现在，对应的有用于ViewChild和co的元数据类，我记得可以使用这些元数据类在普通JS中添加一些其他注释。所以我觉得应该是可行的，但我不太确定在这种情况下该怎么做。有人能弄清楚这件
浏览 2提问于2016-02-07得票数 2
回答已采纳
1回答
files.ts
export class ServiceUrls {
static baseUrl: string = 'http://localhost:52949/V1/';
static baseImageUrl: string = 'http://localhost:52949/';
}
filess1.ts
extends interface ServiceUrls{
static baseUrl: string = 'http://localhost:52949/V1/';
static baseImageUr
浏览 8提问于2017-05-11得票数 6
因此，我尝试在lit-element中使用Typescript 但是，我不确定如何设置reflect等选项 在普通的Javascript中，你可以这样写： static get properties() { return {
test: { reflect: true }
};} 但在typescript中，您可以像这样声明属性： @property()
test : string; 但是如何添加reflect:true呢？ 如果我喜欢这样： @property()
test : {reflect: true}; 它不工作，因为它认为这是变量类型。 那么如何添加这些选项呢？
浏览 17提问于2020-08-25得票数 0
回答已采纳
毫无疑问，TypeScript非常适合于JavaScript项目，它有许多优点，其中之一是类型化变量，箭头函数也很棒：
const arFunc = ({ n, m }) => console.log(`${n + m + 1}`);
上面的代码是一个带有析构赋值的JavaScript简单箭头函数。但我无法理解它在TypeScript上的实现。这太复杂了，让我很困惑。
交互变量的赋值类型和输出结果。这是我的愿望。
浏览 0提问于2018-12-15得票数 4
回答已采纳
类型记录常说："TypeScript是JavaScript的类型化超集。“
但是，如果ECMAScript添加一些与TypeScript现有语法相冲突的新语法，TypeScript和JavaScript之间的“超集”关系就会中断。
会发生这种事吗？
例: TypesScript有参数解码器语法，如果ECMASript将来也添加参数解码器语法，但是装饰函数有不同的参数。
浏览 7提问于2022-05-25得票数 1
回答已采纳
2回答
TypeScript用$(_this)替换$(this)并破坏代码时，我遇到了问题，因为test指的是window。
$(".class").click(() => {
var test = $(this);
console.log(test);
});
编译成
$(".class").click(function () {
var test = $(_this);
console.log(test);
});
浏览 1提问于2016-05-10得票数 1
回答已采纳
我跟不上javascript中的装饰器。
我真的很想在我的React Native项目中使用它们，它会让我拥有更具可读性的代码。
但是目前(2020年)使用纯Javascript装饰器安全吗？当EcmaScript说装饰者在未来可能会有突破性的变化时，他们是什么意思？
我已经看到一些人使用装饰器，但是使用Typescript，我必须使用Typescript才能拥有一个“稳定”版本的装饰器吗？
浏览 5提问于2020-08-08得票数 0
2回答
函数上的装饰器
、、、、
我看到babel.js装饰器(在“第1阶段”中可用)在上实现规范。装饰器似乎仅限于(1)类、(2)访问器和(3)方法。在我的例子中，我想在普通的旧函数上使用装饰器，如
@chainable
function foo() { }
哪里(只是一个例子)
function chainable(fn) {
return function() {
fn.apply(this, arguments);
return this;
};
}
我看不出为什么装潢师不应该应用于函数的任何逻辑理由。我的问题是，有什么办法可以做到这一点吗？还是有什么很好的理由可以解释为什么功能不能被装饰？
事
浏览 4提问于2015-08-02得票数 57
TypeScript是ECMAScript 2015的严格超集，并且已经有了装饰器支持。这是意味着随着ECMAScript 2016装饰器的引入，TypeScript装饰器变得多余，还是意味着TypeScript必须改变其底层实现来生成ECMAScript 2016装饰器？
浏览 0提问于2017-02-06得票数 3
我尝试将@Reflect.metadata装饰器应用于TypeScript类，如第82-84行中的示例所示。
/// <reference path="node_modules/reflect-metadata/reflect-metadata.d.ts"/>
@Reflect.metadata('key', 0)
class C {
}
但是，TypeScript 1.7.2编译器在@Reflect.metadata行上生成以下错误：
错误TS1238:当作为表达式调用时无法解析类装饰器的签名。
无法调用类型缺少调用签名的表达式。
怎么了
浏览 3提问于2015-12-28得票数 6
1回答
我正在尝试将带有动态值的属性添加到带有TypeScript装饰器的类中。我使用TS文档中的以下代码：
function classDecorator<T extends {new(...args:any[]):{}}>(constructor:T) {
return class extends constructor {
newProperty = "new property";
hello = "override";
}
}
这是工作，但这些属性的值不是动态的。我们能把一个参数传递给这个函数吗？就像这
浏览 1提问于2018-03-15得票数 0
回答已采纳
在对象中的函数上使用装饰器时，出现以下错误
这是带有装饰器的对象：
export default {
Query: {
@query
containerById: async (scope, { id }, context) => {
return context.loaders.containerLoader.getContainerById.load(id);
},
}
};
我试图抑制这个错误，但我无法做到。
我能够做到的唯一方法是将下面这行代码添加到.vscode/settings.json中
"typescript.va
浏览 0提问于2021-05-23得票数 2
由于我更新到了角5和@ngtools/webpack (从1.8.0到1.9.0)，我得到了一个奇怪的错误，无法找出错误的原因，我只得到了这个错误：
ERROR in : TypeError: Cannot read property 'getTsProgram' of undefined
at AngularCompilerPlugin._getTsProgram (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-app-web-pages/node_modules/@ngtools/webpack/src/angul
浏览 0提问于2017-12-08得票数 2
回答已采纳
1回答
我正在使用lit-html模板库，ParcelJs bundler使用Typescript，编译成ES2019。有了这些，我创建了一个js库，供消费应用程序使用。这在大多数浏览器上都工作得很好，除了IE11。我得到以下错误：
SCRIPT1002: Syntax error
这就是：
export const directive = <F extends DirectiveFactory>(f: F): F =>
我怀疑这是JS版本和使用its html的问题。
是否有可以引入的解决方法/修复方法来纠正IE11的问题？任何提示或指导都是很棒的。
浏览 2提问于2020-04-09得票数 0
我尝试过几种不同的方法来在TypeScript中声明一个装饰函数，这样装饰类就实现了一个接口。就像这样：
interface IValidatable {
checkValidation: () => boolean;
}
function validated<T>(Class: {new():T}): {new():T & IValidatable} {
Class.prototype.checkValidation = () => true;
return Class as {new():T & IValidatable};
浏览 5提问于2017-04-18得票数 0
我有一个带有Typescript和React环境的标准箭头图ES7函数： const getItemList: Function = (groups: any[]): JSX.Element =>
group.map((item: any, i: number) => {
const itemCardElemProps = { handleEvents: () => {}, ...item}
return <Item key={`${item.id}_${i}`} {...itemCardElemProps} />
}) 并得到错误：
浏览 1150提问于2019-10-10得票数 36
1回答
假设我有一个装饰器，如下面的所示，它添加了一个带有预设值的新name属性。
有没有办法告诉typescript我的装饰器添加了这个属性，这样所有装饰类的类型都是正确的？
示例代码：
function withName(name) {
return (target) => {
target.prototype.name = name;
}
}
@withName('Karl')
class Person {
greet() {
console.log("Hi I'm ", this.name)
浏览 3提问于2018-06-20得票数 3
我试图在一个没有包含在类中的函数中添加一个自定义的TypeScript装饰器，似乎无论我做什么编译器都会报错。
有什么想法吗？有可能吗？
浏览 0提问于2016-05-30得票数 32
回答已采纳
2回答
我想知道是否可以使用TypeScript 1.5从一个类创建一个属性装饰器？我的意思是从
function Inject(value = null) {
return function (target:Object, propertyKey:string) {
target[propertyKey] = value;
};
}
到像这样的类
class Inject{...}
如果这是可能的，我们怎么做？
感谢你的预支
浏览 1提问于2015-06-03得票数 1
当我在tsconfig.json中启用noImplicitThis时，我得到以下代码的错误：
此“”隐式具有类型“any”，因为它没有类型批注。
class Foo implements EventEmitter {
on(name: string, fn: Function) { }
emit(name: string) { }
}
const foo = new Foo();
foo.on('error', function(err: any) {
console.log(err);
this.emit('end'); // error
浏览 1104提问于2017-01-31得票数 183
回答已采纳
免责声明:我以前也经历过类似的问题。他们确实帮助我修复了一些TypeScript编译器问题。但我找不到一个有用的，完整的，代码示例。
问题:我想在我的一些类方法上使用TypeScript装饰器。但问题是，如果我的方法被实现为箭头函数，我就无法使用它们。我修改了我的代码(在运行时，它们更多地被认为是类属性)，基于一些文章和文章，主要是
可选描述符descriptor?: TypedPropertyDescriptor<any>
返回为any
在那个编译器接受了修饰器之后，我的代码没有错误地执行。但我的装饰代码不起作用。下面的简化代码可供参考。任何帮助使代码工作将是有帮
浏览 1提问于2020-04-23得票数 0
我有一个示例代码，它说明了我的代码中发生的一件奇怪的事情，但我想不出为什么会发生这种情况。
基本上，我有一个简单的类Foo，它只包含一个方法。一个greet方法，在默认情况下，当被调用时，它只是记录"Hello，World“。但是我有一个装饰器应用于改变方法的方法。新函数几乎相同，但需要一个字符串参数来确定要记录的内容。
以下是我的示例的完整代码。
const arr = [];
function methodOverride(target, propertyKey, descriptor) {
descriptor.value = function(str) {
浏览 6提问于2020-10-12得票数 0
如何让TypeScript发出如下属性定义：
Object.defineProperties(this, {
view: {
value: view,
enumerable: false,
writable: false,
configurable: false
},
});
浏览 2提问于2012-10-03得票数 16
回答已采纳
1回答
使用TypeScript和Angular 2.4
我有一个带有滚动文本的组件(如marqueee)，我有一个指定滚动速度(每秒像素)的参数。
如何使用component中的方法动态指定动画长度？
假设以下组件：
import {Component, Input, ElementRef, trigger, state, style, transition, animate} from '@angular/core';
import * as $ from 'jquery';
const SCROLL_SPEED_DEFAULT = 25;
@Component
浏览 6提问于2017-03-14得票数 4
1回答
有没有办法在VSCode中选择整个函数定义？在我的开发工作流程中，这是一个重复出现的动作，我想让它自动化，而不是使用鼠标。找不到捷径。当然应该有办法了吧？ 我使用python/javascript作为我的语言，安装了Python (ms-python.python) & JavaScript和TypeScript Nightly (ms-vscode.vscode-typescript-next)扩展。 谢谢！?
浏览 112提问于2021-09-18得票数 1
回答已采纳
我用TypeScript写了很多代码，但巴别塔很少，我知道TypeScript是如何在装饰器上工作的，而且巴别塔也支持装饰器，它们的行为是一样的吗？
浏览 26提问于2018-02-12得票数 8
回答已采纳
我想知道为什么TypeScript中的这个特性叫做Decorator
它只是一个与Annotation或Attribute不同的名字吗？还有别的原因吗？
Decorator和Annotation/Attribute的区别是什么？
浏览 5提问于2016-04-30得票数 14
回答已采纳
我使用的是带有Angular的TypeScript 2.7.2。我在谷歌上搜索了一段时间，想知道如何为泛型约束指定默认类型。
class BaseComponentModel {
}
class BaseComponent<T extends BaseComponentModel = BaseComponentModel> {
@Input()
public model: T;
}
class ButtonComponentModel {
}
class ButtonComponent extends BaseComponent<ButtonCompon
浏览 0提问于2018-06-13得票数 0
我使用的是微软的TypeScript语言版的摩纳哥编辑器。TypeScript类和函数都有JSDoc。我想将按钮/链接等添加到现有的JSDoc中，以便当用户在代码完成中单击它们时调用JavaScript函数。 似乎我不能简单地将带有JavaScript的超文本标记语言放到现有的JSDoc中。有没有可能将任何按钮附加到代码完成显示的JSDoc上？我想将它们添加到已经存在的JSDoc中。 https://microsoft.github.io/monaco-editor/playground.html const editor = monaco.editor.create(document.ge
浏览 38提问于2021-03-27得票数 1
1回答
我有一个带有属性的候选对象
candidateid:number;
name:string;
我希望根据name属性对这类对象的数组进行排序。我如何在angular 2的TypeScript中实现这一点？
浏览 1提问于2016-10-04得票数 59
1回答
请您推荐一种带有表格的页面的设计模式。
有三种页面类型- AgeReport、PositionReport、SalaryReport。
每种页面类型都有自己的列。
列具有所有页面类型的相同属性(title、type、desc)。
因此，最好创建一个列列表，并在所有页面类型中使用它。
应当有可能：
获取特定页面类型的所有列的标题获取特定类型(int、double、string)特定页面类型的列的标题。获取特定页面类型的所有表数据。
图像是附加的。
我只找到了这个解决方案：
attributes.Each页面类型的列应该具有列列表，并在构造函数中定义此列表.
浏览 2提问于2020-06-19得票数 0
回答已采纳
我想把this放在类方法中。我可以使用箭头函数，但我想覆盖扩展类中的一些方法。
现在我有了这个解决方案，它起作用了：
class Foo {
bar = "Context preserved.";
constructor() {
this.foo = this.foo.bind(this);
}
foo() {
alert(this.bar);
}
}
class Foo2 extends Foo {
foo() {
alert(this.bar + " Class ext
浏览 0提问于2017-03-05得票数 2
我很熟悉typescript中箭头函数中this的行为(至少我是这么认为的)。然而，今天我偶然发现箭头函数的参数列表中使用了一个this (这来自alexa-sdk的类型定义)：
export interface Handlers<T> {
[intent: string]: (this: Handler<T>) => void;
}
这实际上意味着什么，我该如何实现它？
let handlers: Handlers<IntentRequest> = {
"MyIntent" = ???
}
我知道我可以这样做：
let
浏览 5提问于2017-08-24得票数 0
回答已采纳
import { ObjectType, ID, Int, Field } from 'type-graphql';
@ObjectType()
export default class Address {
@Field(type => ID)
id: String;
@Field()
type: string;
@Field()
title: string;
@Field()
location: string;
} 信息: ts-node-dev ver.1.0.0 (使用ts-node版本9.1.1，typescript版本4.
浏览 61提问于2021-03-18得票数 0
我正在尝试用一个装饰器来扩展一个类的原型，这个装饰器使用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
回答已采纳
我是一名有打字稿的大一新生。我不理解我的代码中的这个错误。
我使用IProps来描述这个类的属性。为什么typescript要检查这个类的方法？我该如何解决这个问题？
export interface IProps extends FormComponentProps {
dispatch: Dispatch<any>;
loading: any;
}
@Form.create()
@connect(({ global, loading }) => ({ global, loading }))
expor
浏览 1提问于2018-09-14得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
