命令模式是JavaScript设计模式中行为型的一种设计模式；定义：向某些对象发送请求，但是并不知道被请求的操作具体是什么，所以我们希望以一种松耦合的方式来设计程序，使得请求发送者和接收者之间能够消除彼此之间的耦合关系

WhatjQuery是一种快速、简洁跨游览器的JavaScript函数库，其宗旨是“Writeless,Domore”，它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式

作者简介：钱昱多年前端工作经验《JavaScript设计模式精讲》作者，主要分享前端方面技术博客csdn：https://me.csdn.net/qianyu6200430公众号：前端下午茶之前在项目的过程中遇到了一个问题

写在前面：本系列文章内容为《JavaScript设计模式与开发实践》一书学习笔记，感谢作者曾探策略模式在现实中，很多时候可以选择多种途径到达同一个目的地，程序设计中，要实现某一个功能有多种方案可以选择，

本文摘自《JavaScript设计模式》张容铭著版权归原作者所有外观模式在对页面dom绑定原生点击事件的时候，dom2级会覆盖dom0级的操作；IE9不兼容addEventListener,而不支持dom2

文章目录JavaScript设计模式设计原则设计模式分类工厂模式单例模式适配器模式装饰器模式代理模式外观模式观察者模式(最重要)迭代器模式——–分割线———状态模式原型模式桥接模式组合模式享元模式策略模式模板方法模式职责链模式命令模式备忘录模式中介者模式

“如果您使用的解决方案不是唯一的解决方案来解决本身就是一个独特挑战的挑战，那么您就利用了JavaScript设计模式的力量”。软件语言已经存在了几十年。至此，软件语言的生命周期已经被很好地理解了。

积小流成江海推荐学习：前端面试宝典Vue2Vue3Vue2/3项目实战Node.jsThree.jsJS版算法个人推广：每篇文章最下方都有加入方式，旨在交流学习&资源分享，快加入进来吧设计模式内容参考链接JavaScript

1.外观模式的定义该模式就是把一些复杂的流程封装成一个接口供给外部用户更简单的使用。classCPU{start(){console.log('打开CPU');}}classMemory{start(){console.log('打开内存');}}classDisk{start(){console.log('打开硬盘');}}classComputer{constructor(){this.cpu

文章目录设计模式从哪来学习模式的作用设计模式和编程语言什么时候用设计模式这是关于《JavaScript设计模式与开发实践》的笔记，尝试总结了设计模式的精髓，从JS角度出发拓展到其他语言，请支持曾探作者原版

观察者模式文章目录观察者模式：理解观察者模式手写观察者模式必须先订阅再发布吗Vue数据双向绑定（响应式系统）的实现原理实现一个EventBus/EventEmitter在Vue中使用EventBus来实现组件间的通讯观察者模式与发布-订阅模式的区别是什么？这篇文章并不是笔者原创，而是在学习设计模式中对比较好的文章的提炼与总结，作为笔记便于自己复习。观察者模式有一个“别名”，叫发布-订阅模式（之所以

适配器模式是设计模式行为型模式中的一种模式；定义：适配器用来解决两个已有接口之间不匹配的问题，它并不需要考虑接口是如何实现，也不用考虑将来该如何修改；适配器不需要修改已有接口，就可以使他们协同工作；白话解释：你买了某种电器产品，准备带回家好好感受该款产品的魅力；结果带回家之后准备通电使用的时候，发现该产品仅支持两孔插座，而你家里的电源插座都是三孔插座；这个时候你总不能又跑去电器专卖店退货吧；突然灵

积小流成江海推荐学习：前端面试宝典Vue2Vue3Vue2/3项目实战Node.jsThree.jsJS版算法个人推广：每篇文章最下方都有加入方式，旨在交流学习&资源分享，快加入进来吧设计模式内容参考链接JavaScript

个人简介个人主页：前端杂货铺‍♂️学习方向：主攻前端方向，正逐渐往全干发展个人状态：研发工程师，现效力于中国工业软件事业人生格言：积跬步至千里，积小流成江海推荐学习：前端面试宝典Vue2Vue3Vue2/3项目实战Node.jsThree.jsJS版算法个人推广：每篇文章最下方都有加入方式，旨在交流学习&资源分享，快加入进来吧文章目录✨✨前言一、单例模式二、装饰器模式三、适配器模式本篇小结✨✨前言

作者：Hanpeng_Chen公众号：前端极客技术文章首发个人博客：JavaScript设计模式——工厂模式|代码视界在瞬息万变的前端领域，技术更新迭代非常快，我们经常能在网络上看到诸如“学不动了”之类的言论

个人简介个人主页：前端杂货铺‍♂️学习方向：主攻前端方向，正逐渐往全干发展个人状态：研发工程师，现效力于中国工业软件事业人生格言：积跬步至千里，积小流成江海推荐学习：前端面试宝典Vue2Vue3Vue2/3项目实战Node.jsThree.jsJS版算法个人推广：每篇文章最下方都有加入方式，旨在交流学习&资源分享，快加入进来吧文章目录✨✨前言一、简单工厂模式二、抽象工厂模式三、建造者模式本篇小结✨

单例模式也称为单体模式，规定一个类只有一个实例，并且提供可全局访问点；在读这篇文章之前，也许你对单例模式的概念感到模糊或者不清楚，但是其实在日常的开发中你肯定用到过单例模式；JavaScript中没有类的定义，单例模式的特点是”唯一“和”全局访问“，那么我们可以联想到JavaScript中的全局对象，利用ES6的let不允许重复声明的特性，刚好符合这两个特点；是的，全局对象是最简单的单例模式；le

兼容性不太好）JavaSCript-----ECMAScript语法---前端必备、DOM操作、BOM2、JavaScript进阶-----预解释、闭包、作用域、this指向、面向对象、继承的实现方式、算法、JavaScript

JavaScript设计模式核⼼原理与应⽤实践之结构型设计模式装饰器模式，又名装饰者模式。它的定义是“在不改变原对象的基础上，通过对其进行包装拓展，使原有对象可以满足用户的更复杂需求”。

个人简介个人主页：前端杂货铺‍♂️学习方向：主攻前端方向，正逐渐往全干发展个人状态：研发工程师，现效力于中国工业软件事业人生格言：积跬步至千里，积小流成江海推荐学习：前端面试宝典Vue2Vue3Vue2/3项目实战Node.jsThree.jsJS版算法个人推广：每篇文章最下方都有加入方式，旨在交流学习&资源分享，快加入进来吧文章目录✨✨前言一、构造器模式二、原型模式三、类模式本篇小结✨✨前言大家

近来觉得自己JavaScript基础较为薄弱，去啃一些知识(例如:JavaScript设计模式等)越来越困难，所以现在想要巩固一下JavaScript知识，此节就来写一个如何自己封装AJAX。

摘自《JavaScript设计模式与开发实践》单例模式的定义是：保证一个类仅有一个实例，并提供一个访问它的全局访问点。

策略模式是JavaScript设计模式中行为型的设计模式；定义：定义一系列算法，并将这些算法各自封装成策略类（方法），然后将不变的部分和变化的部分分离开来，并且这些算法可以相互替换白话解释：实际上所谓的策略模式就是值根据不同的策略来执行不同的方法

编程的两种风格--面向过程与面向对象面向过程：分析出解决问题所需要的步骤，然后用函数把这些步骤一步一步实现，使用的时候一个一个依次调用就可以了面向对象：把构成问题事务分解成各个对象，建立对象的目的不是为了完成一个步骤，而是为了描叙某个事物在整个解决问题的步骤中的行为以五子棋为例：面向过程的设计思路就是首先分析问题的步骤：1、开始游戏，2、黑子先走，3、绘制画面，4、判断输赢，5、轮到白子，6、绘制

JavaScript代码库（或JavaScript框架），JQuery设计的宗旨是“writeless，domore”即倡导写更少的代码，做更多的事情，它封装JavaScript常用的功能代码块，提供一种简便的JavaScript

JavaScript设计模式——策略模式定义一系列的方法,将每一个算法封装到具有共同接口的独立的类中,从而使得它们可以相互替换。目的是实现方法的使用和实现分开。

谨以此文，记录在学习javaScript这本书时遇到的知识点。设计模式的类别创建型设计模式专注于处理对象的创建机智，以适合给定情况的方式来创建对象。主要包括：Constructor构造器Factory工厂Abstract抽象Prototype原型Singleton单例Builder生成器结构型设计模式与对象组合有关，通常可以用于找出在不同对象之间建立关系的简单方法。同时对于不适合因某一特定目的而改

在之前的《Javascript设计模式理论与实战：简单工厂模式》这篇文章中，我们介绍了简单工厂的知识和一些应用。

本文摘自《JavaScript设计模式》张容铭著版权归原作者所有观察者模式：又被称作发布-订阅者模式或消息机制，定义了一种依赖关系，解决了主体对象与观察者之间功能的耦合创建一个观察者//将观察者放在闭包中

最近再看JavaScript设计模式一书，对于其中的一些内容记录下来，一是为了加深印象，二是为了随时随地想看的时候能找的到，大部分是摘抄书中的内容，而且很多内容

一、定义代理模式：为一个对象提供一个代用品或占位符，以便控制对它的访问。代理分为：保护代理和虚拟代理保护代理：用于控制不同权限的对象对目标对象的访问，在JavaScript中很难判断谁访问了某个对象，所以保护代理很难实现。二、图片预加载（最常见的虚拟代理应用场景）图片预加载是一种常用技术，如果直接给某个img标签节点设置src属性，由于图片过大或者网络不佳，图片的位置往往有段时间会有空白。常见的做

单例模式——一个人的寂寞单例模式：又称为单体模式，是只允许实例化一次的对象类。有时我们也用一个对象来规划一个命名空间，井井有条地管理对象上的属性和方法。单例模式是JavaScript中最常见的一种模式，这种模式经常为我们提供一个命名空间。如我们使用过的jQuery库，单例模式就为它提供了一个命名空间jQuery。命名空间就是人们所说的namespace，有人也叫它名称空间。它解决这么一类问题：为了

XSRF模型拾取算法闭包（好处与坏处）->垃圾回收（标记清除、引用计数）为什么离开现在的公司canvas绘图需要复习和参考的书【Javascript高级编程】-原型链、闭包、事件流【JavaScript

观察者模式当对象之间存在一对多的依赖关系时，其中一个对象的状态发生改变，所有依赖它的对象都会收到通知，这就是观察者模式。在观察者模式中，只有两种主体：目标对象(Subject)和观察者(Observer)。目标对象Subject:维护观察者列表observerList————维护拥有订阅权限的用户列表定义添加观察者的方法————提供用户订阅权限的功能当自身发生变化后，通过调用自己的notify方法

以下是13种常见的JavaScript设计模式：JavaScript设计模式单例模式（SingletonPattern）工厂模式（FactoryPattern）抽象工厂模式（AbstractFactoryPattern

原型模式用原型实例指向创建对象的类，适用于创建新的对象的类共享原型对象的属性以及方法。JavaScript语言内部实现原型模式，在编程中使用函数的prototype共享方法就是原型模式。functionperson(name){this.name=name;}person.prototype.getName=function(){returnthis.name;}functionstudent(n

最佳实践：使用代理方式实现单例模式，使用一个代理函数来实现实单例例化原生的js代码/*摘自《JavaScript设计模式与开发实践》*/varCreateDiv=function(html){this.ht

参考资料曾探《JavaScript设计模式与开发实践》；《javaScript设计模式与开发实践》笔记12个Javascript小技巧帮你提升代码质量模式与重构模式和重构之间有着一种与生俱来的关系。

参考资料曾探《JavaScript设计模式与开发实践》；《JavaScript设计模式与开发实践》原则篇（3）——开放-封闭原则设计原则和编程技巧之开放-封闭原则定义开放封闭原则(OpenClosedPrinciple

参考资料曾探《JavaScript设计模式与开发实践》；《javaScript设计模式与开发实践》笔记什么是接口？

JAVASCRIPT设计模式是本人根据GOF的设计模式写的博客记录。

工厂模式同样是一个工厂,但是我可以做衣服和鞋子,我只要告诉工厂我要什么就可以了,工厂根据客户的不同需求已经封装好了不同对应的方法,经常用到switch判断工厂封装了不同事情的细节,可以做多件事情,用户只要告诉工厂要的需求即可构造函数模式简单地说就是,大家都买了同样一部手机,但是每个人可以选择在自己手机上去安装私人app解决重复实例化问题,直接把属性和方法赋值给了实例对象建造者模式就是按照框架把流程

《JavaScript设计模式与开发实践》是由曾探所著的一本经典技术书籍。该书详细介绍了JavaScript中常用的设计模式，并结合实际项目开发经验给出了实践示例和最佳实践建议。

Javascript设计模式-原文链接单例模式:语言:JavaScript定义:单例模式有两个要点，保证一个类只有一个实例，并提供访问该实例的全局访问点。

状态模式状态模式的关键是区分事物内部的状态，事物内部状态的改变往往会带来事物的行为改变状态模式的优缺点优点把状态和行为封装成单独的类，独立而互不影响，也容易新增状态和转换。符合开放封闭原则。避免Context增加过多的类，状态切换的逻辑被分布在状态类中。缺点如果会定义许多状态类，逻辑分散，状态逻辑梳理复杂。状态模式的性能优化点主要是state状态对象的创建和销毁state被需要才创建。如果对象比较

单一职责原则（SRP）一个对象/方法只做一件事情。就一个类而言，应该仅有一个引起它变化的原因一个方法有两个动机可以修改，那么这个方法就具有两个职责。如果一个方法承担了过多的指责，那么在需求的变迁过程中，需要改写这个方法的可能性就越大。当多个职责耦合在一起的时候，一个职责发生变化可能会影响到其他职责的实现。这种是低内聚高耦合和脆弱的设计。SRP原则一个对象（方法）只做一件事情。SRP原则在很多设计模

介绍使用者无权直接访问目标对象中间使用代理，通过代理的方式做授权和控制实例科学上网明星经纪人UMLimage代码演示classRealImg{constructor(fileName){this.fileName=fileName;this.loadFromDisk()}display(){console.log('display.....'+this.fileName)}loadFromDisk

本文摘自《JavaScript设计模式》张容铭著版权归原作者所有事件与业务逻辑之间的桥梁类似中间件函数functionchange(dom,color,bg){dom.style.color=color

CSDN话题挑战赛第2期参赛话题：学习笔记学习之路，长路漫漫，写学习笔记的过程就是把知识讲给自己听的过程。这个过程中，我们去记录思考的过程，便于日后复习，梳理自己的思路。学习之乐，独乐乐，不如众乐乐，把知识讲给更多的人听，何乐而不为呢?桥接模式将抽象部分与他的实现部分分离，这样抽象化与实现化解耦，使他们可以独立的变化，使用组合关系代替继承关系实现，从而降低了抽象和实现这两个可变维度的耦合度。桥方可

JavaScript设计模式学习笔记（一）一、学习设计模式的目的二、模式分类创建型模式结构型模式行为型模式三、关于this的一个小题目本系列博客主要是面向自己创作，实属自己的读书笔记，注重记录一些重点，