What are Typescript decorators

1.1. Concepts and Usage

For decorators, please refer to my other article decorators.

Second, Typescript environment setup

See my other article on building a TS environment for more on building a Typescript environment.

Second, the application of decorators in actual projects

2.1 A simple KOA example

import * as Koa from "koa"; import * as KoaRouter from "koa-router"; const app = new Koa(); const router = new KoaRouter(); router.get("/user", (ctx) => { ctx.body = "/user"; }) router.get("/order", (ctx) => { ctx.body = "/order"; }) // call loader app.use(router.routes()); App.listen (4001, () => {console.log(" server started successfully "); })Copy the code

The above is a very simple KOA example that defines two interfaces /user and /order, but in our actual project, we have various modules and defining routes in this way makes code maintenance more and more difficult. Some people might say, well, I can split files, module by module, file by file, it’s not impossible, but it’s not the best choice, program is design, we have to write high code.

2.2

Take a look at the overall directory structure

2.2.1 Defining decorators (Core)

utils/routerDector.ts

import * as Router from "koa-router"; import { glob } from "glob"; const router = new Router(); // Define decorator factory const creatDes: Function = (router: router) => (method: string) => (url: string) => { return function (target, property, descriptor: PropertyDescriptor) { router[method](url, descriptor.value); } } const createMethod = creatDes(router); export const get = createMethod("get"); export const post = createMethod("post");Copy the code

2.2.2 Defining a Route

order.ts

import { get, post } from ".. /utils/routerDector"; Class Order {@get("/list") list(CTX) {ctx.body = "Order list"}Copy the code

user.ts

import { get, post } from ".. /utils/routerDector"; class User { @post("/add") add(ctx) { ctx.body = "/add"; } @get("/print") print(ctx) { ctx.body = "/print" } }Copy the code

2.2.3 Defining the loader

Modify the utils/ RouterDector. ts file

import * as Router from "koa-router"; import { glob } from "glob"; const router = new Router(); const creatDes: Function = (router: Router) => (method: string) => (url: string) => { return function (target, property, descriptor: PropertyDescriptor) { router[method](url, descriptor.value); } } const createMethod = creatDes(router); export const get = createMethod("get"); export const post = createMethod("post"); Export const load = (Folder: string) => {const extName = ".{js,ts}"; glob.sync(require("path").join(folder, `./**/*${extname}`)).forEach(item => { require(item); }); return router; }Copy the code

2.2.4 Call the loader to load routes

The index. The ts file

import * as Koa from "koa"; import { load } from "./utils/routerDector" import { resolve } from "path"; const app = new Koa(); // call loader const router = load(resolve(__dirname, "./router")); app.use(router.routes()); App.listen (4001, () => {console.log(" server started successfully "); })Copy the code