Skip to content

前置知识

一般写法

class A {
name: string;
// constructor() {
// this.name = "A";
// }
// 当构造函数增加参数时,创建实例时必须传入参数,否则会报错,出现了强耦合的问题
constructor(name: string) {
this.name = name;
}
}
class B {
a: string;
constructor() {
this.a = new A().name; // 报错
}
}
class C {
a: string;
constructor() {
this.a = new A().name; // 报错
}
}

引入控制反转和依赖注入

class A {
name: string;
constructor(name: string) {
this.name = name;
}
}
class B {
name: string;
constructor(name: string) {
this.name = name;
}
}
// 依赖注入容器
class Container {
module: any;
constructor() {
this.module = {};
}
provide(key: string, mo: any) {
this.module[key] = mo;
}
get(key: string) {
return this.module[key];
}
}
// 创建容器实例
const c1 = new Container();
// 注册依赖
c1.provide("A", new A("Alice"));
c1.provide("B", new B("Bob"));
console.log(c1.get("A").name);
console.log(c1.get("B").name);
class X {
a: any;
b: any;
constructor(mo: Container) {
this.a = mo.get("A");
this.b = mo.get("B");
}
}
Terminal window
$ tsc --init
tsconfig.json
{
"compilerOptions": {
"experimentalDecorators": true
}
}
const doc: ClassDecorator = (targe: any) => {
console.log("ClassDecorator called on: ", target);
target.prototype.name = "Class A";
};
// 类装饰器
@doc
class A {
constructor() {}
}
const a1: any = new A();
console.log(a1.name);
const doc: PropertyDecorator = (target: any, propertyKey: string | symbol) => {
console.log("PropertyDecorator called on: ", target, propertyKey);
};
class A {
// 属性装饰器
@doc
public name: string;
constructor() {
this.name = "Class A";
}
}
const doc: PropertyDecorator = (
target: any,
propertyKey: string | symbol,
descriptor: any,
) => {
console.log(target, propertyKey, descriptor);
};
class A {
public name: string;
constructor() {
this.name = "Class A";
}
@doc
getName() {}
}
const doc: ParameterDecorator = (
target: any,
propertyKey: string | symbol | undefined,
parameterIndex: number,
) => {
console.log(target, propertyKey, parameterIndex);
};
class A {
public name: string;
constructor() {
this.name = "Class A";
}
getName(name: string, @doc age: number) {}
}
import axios from "axios";
const Get = (url: string) => {
return (target: any, key: any, descriptor: PropertyDecorator) => {
const fn = descriptor.value;
axios
.get(url)
.then((res) => {
fn(res, {
status: 200,
success: true,
});
})
.catch((e) => {
fn(res, {
status: 500,
success: false,
});
});
};
};
class Controller {
constructor() {}
@Get("/list")
getList(res: any, status: any) {
console.log(res.data, status);
}
}