A decorator for a class in TypeScript. Example: @MyDecarator1 class Book {...}

Компьютер, программы

→

TypeScript - programming language similar to JavaScript. TypeScript uses types, classes, inheritance. TypeScript converted to JavaScript

A decorator for a class in TypeScript. Example: @MyDecarator1 class Book {...}

посмотрели 5692 раз

обновлено: 16 Augusta 2026

Декоратор в TypeScript обозначается @

Декоратор в TypeScript это добавление в класс новых переменных, методов.

Декоратор используется чтобы изменить поведение класса.

Шаг 1. Чтобы декаратор использовать нужно добавить "experimentalDecorators": true в файл tsconfig.json

Файл tsconfig.json

{
     "compilerOptions": {
          "module": "commonjs",
          "target": "es6",
          "lib": ["es6"],
          "sourceMap": false,
          "outDir": "./build",
          "experimentalDecorators": true
     },
     "exclude": [
          "node_modules"
     ]
}

Шаг 2. Пишем свой декаратор MyInfo

Файл my-decarator.ts

// пишем свой декаратор
function MyDecarator1<T extends { new(...args: any[]): {} }>(MyClass: T)
{
     return class extends MyClass{
          DateCreated = Date()
          Author = "Evgen";
     }
}

Шаг 3. Используем наш декаратор MyInfo

TypeScript

// используем наш декаратор
@MyDecarator1
class Book
{
     public Name: string;

     constructor()
     {
     }
}

Результат

При создании объекта Book

var b1 = new Book();
b1.Name = "Hobbits";

Увидим что создались еще 2 поля: DateCreated и Author

Скачать пример

my_typescript_project_decarator.zip ...
размер: 3 kb

Как запустить пример?

Шаг 1. Открываем папку.
Открываем Visual Studio Code и выбираем папку (нажимаем на меню File → Open Folder и выбираем папку D:/my_typescript_project_decarator)

Шаг 2. Устанавливаем библиотеки.
В Visual Studio Code нажимаем на меню Terminal → New Terminal и выполним:

npm install

Шаг 3. Компилируем проект
Выполним:

npm run MyBuild

Шаг 4. Ставим breakpoint в ts файле и запускаем приложение.
В Visual Studio Code нажимаем на меню Run → Start Debugging (или нажимаем на кнопку F5)

Читать подробнее: как запустить приложение с TypeScript и Webpack в Visual Studio Code...

Декаратор в других языках

Декаратор в языке программирования C# это атрибут для класса

← Previous topic
Create a new Node.js console app in Visual Studio 2017 to learn Typescript

Next topic →
Convert class to {property object}. Typescript. Example: var myProps1 = {... myClass1};

Your feedback ... Comments ...

Объявления

• What the TypeScript ?

• How to download, install TypeScript ? How to check what is installed TypeScript and which version?

New app

Option 1. Write the application in a text editor, compile it on the command line

• Create a new application with TypeScript (compile in the command line TypeScript in JavaScript)

• Compilation settings Typescript in Javascript At the command prompt: removeComments, outFile, outDir

Option 2 [bgcolor=lightblue](best for me)[/bgcolor]. Writing the application in Visual Studio Code

• Create a new application TypeScript in Visual Studio Code. Debug the application. We look in debugging how TypeScript is executed step by step. Breakpoints.

• Create a new TypeScript app in Visual Studio Code. I"ve created some ts files. That"s why I use Webpack (collects all files into one js). Debug is running and Breakpoints are set.

Option 3. Writing an application in Visual Studio 2017

• Create a new Node.js console app in Visual Studio 2017 to learn Typescript

TypeScript Features

• A decorator for a class in TypeScript. Example: @MyDecarator1 class Book {...}

• Convert class to {property object}. Typescript. Example: var myProps1 = {... myClass1};

WWW sites to explore TypeScript

• Sites to explore TypeScript