【设计模式】工厂模式、单例模式、观察者模式、发布订阅模式 ...

1.工厂模式

1. class Factory{
2.     createProduct(name){
3.         return new Product(name);
4.     }
5. }
6. class Product{
7.     constructor(name){
8.         this.name=name;
9.     }
10.     display(){
11.         console.log(`product:${this.name}`);
12.     }
13. }
15. //使用
16. const factory=new Factory();
17. const p1=factory.createProduct('P1');
18. const p2=factory.createProduct('P2');
19. p1.display()
20. p2.display()

复制代码

2.单例模式

1. class Singleton{
2.     static instance=null;
3.     constructor(){
4.         if(Singleton.instance){
5.             return Singleton.instance
6.         }
7.         Singleton.instance=this;
8.     }
9. }
11. //使用
12. const instance1=new Singleton()
13. const instance2=new Singleton()

复制代码

3.观察者模式

1. class Subject{
2.     constructor(){
3.         this.observers=[];
4.     }
5.     addObserver(observer){
6.         this.observers.push(observer);
7.     }
8.     removerObserver(observer){
9.         this.observers=this.observers.filter(obs=>obs!==observer);
10.     }
11.     notifyObserver(){
12.         this.observers.forEach(obs=>obs.update());
13.     }
14. }
16. class Observer{
17.     constructor(name){
18.         this.name=name;
19.     }
20.     update(){
21.         console.log(`Observer ${this.name} has been notified`);
22.     }
23. }
24. //使用
25. const subject=new Subject();
26. const observer1=new Observer('1');
27. const observer2=new Observer('2');
28. subject.addObserver(observer1);
29. subject.addObserver(observer2);
30. subject.notifyObserver();

复制代码

4.发布订阅模式

1. class Broker{
2.     constructor(){
3.         this.subscribers=[];
4.         this.state=0;
5.     }
6.     subscribe(subscriber){
7.         this.subscribers.push(subscriber);
8.     }
9.     setState(state){
10.         this.state=state;
11.         this.publish();
12.     }
13.     getState(){
14.         return this.state;
15.     }
16.     publish(){
17.         this.subscribers.forEach(sub=>sub.update());
18.     }
19. }
21. class Publisher{
22.     constructor(){}
23.     changeState(broker,state){
24.         broker.setState(state);
25.     }
26. }
28. class Subscriber{
29.     constructor(name,broker){
30.         this.name=name;
31.         this.broker=broker;
32.         this.broker.subscribe(this);
33.     }
34.     update(){
35.         console.log(`${this.name}:${this.broker.getState()}`);
36.     }
37. }
38. //使用
39. const broker=new Broker();
40. const publish=new Publisher();
41. const subscribe1=new Subscriber('s1',broker);
42. const subscribe2=new Subscriber('s2',broker);
43. publish.changeState(broker,1);

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。