/**
*
* Mediator pattern 中介者是一种行为设计模式， 让程序组件通过特殊的中介者对象进行间接沟通， 达到减少组件之间依赖关系的目的。
* file: Mediatorts.ts
* The Mediator interface declares a method used by components to notify the
* mediator about various events. The Mediator may react to these events and
* pass the execution to other components.
*/
interface Mediator {
notify(sender: object, event: string): void; //void
}
/**
* Concrete Mediators implement cooperative behavior by coordinating several
* components.
*/
class ConcreteMediator implements Mediator {
private component1: Component1;
private component2: Component2;
constructor(c1: Component1, c2: Component2) {
this.component1 = c1;
this.component1.setMediator(this);
this.component2 = c2;
this.component2.setMediator(this);
}
public notify(sender: object, event: string):string { //void
let getstr="";
if (event === 'A') {
console.log('Mediator reacts on A and triggers following operations:');
this.component2.doC();
getstr="Mediator reacts on A and triggers following operations:";
getstr=getstr+this.component2.doC();
}
if (event === 'D') {
console.log('Mediator reacts on D and triggers following operations:');
this.component1.doB();
this.component2.doC();
getstr="Mediator reacts on D and triggers following operations:";
getstr=getstr+this.component1.doB()+","+this.component2.doC();
}
return getstr;
}
}
/**
* The Base Component provides the basic functionality of storing a mediator's
* instance inside component objects.
*/
class BaseComponent {
protected mediator: Mediator;
constructor(mediator?: Mediator) {
this.mediator = mediator!;
}
public setMediator(mediator: Mediator): void {
this.mediator = mediator;
}
}
/**
* Concrete Components implement various functionality. They don't depend on
* other components. They also don't depend on any concrete mediator classes.
*/
class Component1 extends BaseComponent {
/**
*
* @returns
*/
public doA(): string { //void
console.log('Component 1 does A.');
this.mediator.notify(this, 'A');
return "Component 1 does A."
}
/**
*
* @returns
*/
public doB(): string { //void
console.log('Component 1 does B.');
this.mediator.notify(this, 'B');
return "Component 1 does B.";
}
}
/**
*
*/
class Component2 extends BaseComponent {
/**
*
* @returns
*/
public doC(): string {
console.log('Component 2 does C.');
this.mediator.notify(this, 'C');
return "Component 2 does C.";
}
/**
*
* @returns
*/
public doD(): string {
console.log('Component 2 does D.');
this.mediator.notify(this, 'D');
return "Component 2 does D.";
}
}
let pubMediator1="";
let pubMediator2="";
let pubMediator3="Geovin Du";
let pubMediator4="geovindu";
/**
* The client code.
*/
const c1 = new Component1();
const c2 = new Component2();
const mediator = new ConcreteMediator(c1, c2);
console.log('Client triggers operation A.');
pubMediator1=c1.doA();
console.log('');
console.log('Client triggers operation D.');
pubMediator2=c2.doD();
pubMediator3=mediator.notify(c1,"A");//B
pubMediator4=mediator.notify(c2,"D");//C
let messageMediator: string = 'Hello World,This is a typescript!,涂聚文 Geovin Du.Web';
document.body.innerHTML = messageMediator+",<br/>one="+pubMediator1+",<br/>two="+pubMediator2+",<br/>three="+pubMediator3+",<br/>four="+pubMediator4+",<br/>TypeScript Command Pattern 命令模式";
调用：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<head><title>TypeScript Hello Mediator pattern 中介者模式</title>
<meta name="Description" content="geovindu,涂聚文,Geovin Du"/>
<meta name="Keywords" content="geovindu,涂聚文,Geovin Du"/>
<meta name="author" content="geovindu,涂聚文,Geovin Du"/>
</head>
<body>
<script src="dist/Mediatorts.js"></script>
</body>
</html>
输出：
