js中的设计模式

js的设计模式还是真的要学一下的，看rxjs的时候，一直不明白发布订阅的意思，过于纠结于字面意思了。基础还是要扎实才行。

我觉得前端最好的学习路线

1.js(js高级进阶，代表入门了，重点看懂栈，堆的变量引用，变量提升的机制，值类型和引用类型)第一次最好看视频，我当初看完书没什么印象，看了一次视频课，再看的书才反应过来（原谅我把C语言的知识全忘光了，还好还记得一个指针）。

2.js的设计模式

    目前为止还是觉得设计模式主要是看懂对象的引用，值得传递，返回值得灵活调用。纠结了我半天的原型链原来就是返回自身。

    但是视频还是要看的，要不然不会想到jquery的点击事件是利用了观察者模式的方法。

3.jquery的源代码分析

     jquery 这么多年了，主要是有视频资源，看完这些，就可以看书了

 

下面记录一下主要的几种设计模式

       顺便提一下老师推荐Linux/Unix设计哲学，最近在看操作系统，先看完操作系统。

工厂模式

   工厂模式的定义：提供创建对象的接口，意思就是根据领导（调用者）的指示（参数），生产相应的产品（对象）

   简单工厂模式：使用一个类，通常为单体，来生成实例。

   复杂工厂模式定义是：将其成员对象的实列化推到子类中，子类可以重写父类接口方法以便创建的时候指定自己的对象类型。

  父类只对创建过程中的一般性问题进行处理，这些处理会被子类继承，子类之间是相互独立的，具体的业务逻辑会放在子类中进行编写。

简单的说就是根据产品的不同生成不同的实例

var XMLHttpFactory =function(){};　　　　　　//这是一个简单工厂模式 　　XMLHttpFactory.createXMLHttp =function(){ 　　　 var XMLHttp = null; 　　　　if (window.XMLHttpRequest){ 　　　　　　XMLHttp = new XMLHttpRequest() 　　　 }else if (window.ActiveXObject){ 　　　　　　XMLHttp = new ActiveXObject("Microsoft.XMLHTTP") 　　　　} 　　return XMLHttp; 　　} 　　//XMLHttpFactory.createXMLHttp()这个方法根据当前环境的具体情况返回一个XHR对象。 　　var AjaxHander =function(){ 　　　　var XMLHttp = XMLHttpFactory.createXMLHttp(); 　　　　... 　　}

观察者模式

           定义对象间的一种一对多依赖关系，使得每当一个对象状态发生改变时，其相关依赖对象皆得到通知并被自动更新。 其中有两个定义需要明确，被观察者和观察者。通常来说，这两者是一对多的，也有多对多的情景。           在网页开发中，被观察者通常是数据源，不论是内存数据，还是持久化数据，又或者是接口返回的数据，都可以作为被观察者。它一旦改变，就去改变依赖于它的节点。           观察者有很多可能，针对于网页开发，我们常常认为dom节点是观察者，一旦节点的监视的数据源发生变化，节点也执行更新方法

         下面是一个简单的自定义的发布方式。

 

// 发布类 class Subject { constructor(data) { this.obList = []; this.data = data; } add(ob) { if (arguments.length >= 1) { Array.from(arguments).forEach(item => this.obList.push(item)); } } remove(ob) { let i = this.obList.findIndex(ele => ele === ob); if (i >= 0) { this.obList.splice(i, 1); } } notify() { this.obList.forEach((item) => { item.update(this.data); }) } } // 观察者类 class Observer { constructor(id) { this.id = id; } update(data) { console.log('observer ' + this.id + ': ' + data + ';'); } } function test() { let sub = new Subject('test'); let ob1 = new Observer(1); let ob2 = new Observer(2); let ob3 = new Observer(3); sub.add(ob1, ob2, ob3); sub.notify(); sub.remove(ob2); sub.notify(); } test();

    针对更一步的耦合https://www.cnblogs.com/liuyongjia/p/9415008.html

先记一下这两个模式，举一反三还真不容易，单纯针对以上两种都可以扩展很多知识点了。等我去研究一下源代码。