JavaScript必知的设计模式及其实际应用
设计模式，是软件开发人员在开发过程之中面对一般问题的解决方案，这些解决方案是众多软件开发人员经过相当长的一段时间的实验以及在错误之中总结出来的。在之后被多数人知晓并反复使用。
使用设计模式是为了重用代码，让代码更加容易让他人理解，保证代码的可靠性。不论对于自己还是他人都是有利的。也是设计模式使得编码真正的工程化。
这次我就简单梳理几个js的设计模式。
一、 工厂模式
工厂模式是用来创建对象的一种最常用的设计模式。我们不暴露所创建的对象的具体逻辑，而将它封装在一个函数之中，类似与一个工厂一样。简单来说就是把实现同一件事情的相同代码，放在一个函数之中，之后想要使用直接调用就可以。
function Test(a,b){
var obj = {};
obj.a = a;
obj.b = b;
obj.cons = function(){
console.log(this.a+this.b);
}
return obj;
}
var t1 = Testab("aba","bab");
t1.cons();
var t2 = Testab("cdc","dcd");
t2.cons();这种模式十分有用，尤其使创建对象的流程赋值的时候，比如依赖很多设置文件等。
二、 中介者模式
中介者模式是用来降低多个对象和类之间的通信复杂性。这种模式提供一个中介类，这个类是用来处理不同类之间的通信，使代码耦合性降低，便于维护。
假设有很多个对象和类，它们之间想要相互的调用，如果每一个都写，会使代码非常混乱，但如果加入一个中介，他们只需要将各自所需提交给中介即可。
var a = {
score:30,
test:function(score){
this.score = score;
compare(a);
}
}
var b = {
score:20,
test:function(score){
this.score = score;
compare(b);
}
}
var c = {
score:10,
test:function(score){
this.score = score;
compare(c);
}
}
function compare(res){
var score = [a.score,b.score,c.score].sort(function(a,b){return a<b;});
console.log(score.indexOf(res.score)+1);
}
a.test(10);
b.test(20);
c.test(30);虽然中介者模式做到了低耦合，但是如果使用情况不当而强行使用的话反而会使代码更加的繁琐，请注意。
三、 观察者模式
观察者模式又称订阅/发布模式，定义了一种一对多的关系，让多个观察者同时监听某一个对象，这个对象的状态发生改变时就会通知所有的观察者，观察者会进行相应的改变。
以学校铃声为发布者举例的话，当上铃声响起，订阅者老师回去讲课，而订阅者学生会听讲，当下课铃响起时，老师回去备课，而学生会玩耍等。
function Publisher(){
this.type = function(){
if(Math.random() > 0.5){
return "发布";
}else{
return "不发布";
}
}
}
function Watcher1(){
this.listen = function(t){
if(t == "发布"){
console.log(`马上接收`);
}else{
console.log(`等待`);
}
}
}
function Watcher2(){
this.listen = function(t){
if(t == "发布"){
console.log(`一会接收`);
}else{
console.log(`其他事情`);
}
}
}
var s = new Publisher();
var t = s.type();
var t1 = new Watcher1();
t1.listen(t);
var t2 = new Watcher2();
t2.listen(t);观察者模式，广泛用于客户端js编程中。
四、 组合模式
组合模式就是将多个对象的功能，组合起来，实现批量执行。
比如卧室有多种灯，一个一个去开会很麻烦，可以将他们链接到一个开关上，当摁下这个开关后所有灯开启。
class A{
init(){
console.log(“a”);
}
}
class B{
init(){
console.log(“b”);
}
}
class C{
init(){
console.log(“c”);
}
}
class Comb{
constructor(){
this.skills = [];
}
add(task){
this.skills.push(task);
}
action(){
this.skills.forEach(val=>{val.init();});
}
}
var c = new Comb();
c.add(new A());
c.add(new B());
c.add(new C());
c.action();一般有多种功能想要整合时才会用组合模式，因为组合模式会消耗内存。
五、 MVC模式
MVC的全名是Model View Controller，是模型、视图、控制器的缩写。模型是用来管理多个数据的，视图时管理多种的渲染方式等，而控制器时设定相应的指令。
一个事件发生的过程（通信单向流动）：
1、用户在视图 V 上与应用程序交互
2、控制器 C 触发相应的事件，要求模型 M 改变状态（读写数据）
3、模型 M 将数据发送到视图 V ，更新数据，展现给用户
class Model{
model1(){
return "a";
}
model2(){
return "b";
}
model3(){
return "c";
}
}
class View{
view1(data){
console.log(data);
}
view2(data){
document.write(data);
}
view3(data){
alert(data);
}
}
class Ctrl{
constructor(){
this.m = new Model();
this.v = new View();
}
ctrl1(){
var data = this.m.model1();
this.v.view1(data);
}
ctrl2(){
var data = this.m.model2();
this.v.view3(data);
}
}
var c = new Ctrl();
c.ctrl1();
c.ctrl2();因为MVC模式每个部分进行独立的开发、测试和维护，所有MVC模式现在十分普遍，流行的MVC框架比比皆是。
这次整理就到这里，有机会再完善。在疫情之中逆战必胜。