Decorator for the classroom in the TypeScript. Пример: @MyDecarator1 class Book {...}

Programming, development, testing

→

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

→

Decorator for the classroom in the TypeScript. Пример: @MyDecarator1 class Book {...}

Looked at 3907 times

Decorator for the classroom in the TypeScript. Пример: @MyDecarator1 class Book {...}

last updated: 26 December 2020

Декоратор в 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
Создаем новое Node.js консольное приложение в Visual Studio 2017 для изучения Typescript

Next topic →
Конвертируем class в {объект свойств}. Typescript. Пример: var myProps1 = {...myClass1};