前端设计模式简单理解

很长的一段时间，听到设计模式，就感觉是不明觉厉的东西，也不太清楚到底是些啥。慢慢的尝试去读懂它后，发现，原来它一直在我们身边。
这段时间，看了下小册，有位大神出的设计模式核心原理，自己也动手整理了下，感谢！

先简单的上自己整理的一张图

image.png

工厂模式

工厂模式就是将创建对象的过程单独封装，然后实现无脑传参

抽象工厂

详情看脑图，基本思想是 围绕一个大的场景，分开创建一些小的工厂，来达到需求

单例模式

核心思想就是，不管我们尝试去创建多少次，它都只给你返回第一次所创建的那唯一的一个实例

原型模式

原型模式是一种编程范式，就是基于原型链的继承，js面向对象系统实现的根基

装饰器模式

装饰器模式，又名装饰者模式。它的定义是“在不改变原对象的基础上，通过对其进行包装拓展，使原有对象可以满足用户的更复杂需求”

适配器模式

就是把一个类的接口变换成客户端所期待的另一种接口，帮我们解决兼容问题

代理模式

看脑图解释

策略模式

这种模式，对大家培养良好的编码习惯和重构能带来很大的帮助，简单来说呢，就是对于方法中的，一堆堆的if， 我们可以拆分成一个个的方法， 用对象包裹起来，然后实现调用就好了，举个简单的例子

 const methodList = {
        [ShipMethod.PickUp]: () => {
          return !isPickUp;
        },
        [ShipMethod.ShipToMe]: () => {
          return storeOnly;
        },
        [ShipMethod.SDD]: () => {
          return sameDayDelivery
        },
      };
methodList[shipMethod]();

状态模式

允许一个对象在起内部状态改变的时候改变它的行为，对象看起来似乎修改了它的类
其实就是基于策略模式，添加了一个状态控制，根据状态，调用不同的方法

观察者模式

观察者模式定义了一种一对多的依赖关系，让多个观察者对象同时监听某一个目标对象，当这个目标对象的状态发生变化时，会通知所有观察者对象，使它们能够自动更新。 —— Graphic Design Patterns

迭代器模式

迭代器模式提供一种方法顺序访问一个聚合对象中的各个元素，而又不暴露该对象的内部表示。 ——《设计模式：可复用面向对象软件的基础》
详细可以去了解es6 的迭代器的实现原理