开发中，我们或多或少地接触了设计模式，但是很多时候不知道自己使用了哪种设计模式或者说该使用何种设计模式。本文意在梳理常见设计模式的特点，从而对它们有比较清晰的认知。

JavaScript 中常见设计模式

各设计模式关键词

看完了上述设计模式后，把它们的关键词特点罗列出来，以后提到某种设计模式，进而联想相应的关键词和例子，从而心中有数。

设计模式 特点 案例
单例模式 一个类只能构造出唯一实例 创建菜单对象
策略模式 根据不同参数可以命中不同的策略 动画库里的算法函数
代理模式 代理对象和本体对象具有一致的接口 图片预加载
迭代器模式 能获取聚合对象的顺序和元素 each([1, 2, 3], cb)
发布-订阅模式 PubSub 瀑布流库
命令模式 不同对象间约定好相应的接口 按钮和命令的分离
组合模式 组合模式在对象间形成一致对待的树形结构 扫描文件夹
模板方法模式 父类中定好执行顺序 咖啡和茶
享元模式 减少创建实例的个数 男女模具试装
职责链模式 通过请求第一个条件，会持续执行后续的条件，直到返回结果为止 if else 优化
中介者模式 对象和对象之间借助第三方中介者进行通信 测试结束告知结果
装饰者模式 动态地给函数赋能 天冷了穿衣服，热了脱衣服
状态模式 每个状态建立一个类，状态改变会产生不同行为 电灯换挡
适配者模式 一种数据结构改成另一种数据结构 枚举值接口变更

参考文献

*《JavaScript设计模式与开发实践》

JavaScript 中常见设计模式整理的更多相关文章

  1. JS中常见设计模式总结

    github: https://github.com/14glwu/FEInterviewBox/tree/master/JS%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F ...

  2. JavaScript中常见的数组操作函数及用法

    JavaScript中常见的数组操作函数及用法 昨天写了个帖子,汇总了下常见的JavaScript中的字符串操作函数及用法.今天正好有时间,也去把JavaScript中常见的数组操作函数及用法总结一下 ...

  3. JavaScript中常见的字符串操作函数及用法

    JavaScript中常见的字符串操作函数及用法 最近几次参加前端实习生招聘的笔试,发现很多笔试题都会考到字符串的处理,比方说去哪儿网笔试题.淘宝的笔试题等.如果你经常参加笔试或者也是一个过来人,相信 ...

  4. JavaScript：JavaScript中常见获取对象元素的方法

    介绍: javascript中常见的3种获取元素的方法,分别是通过元素ID.通过标签名字和通过类名字来获取 操作如下: 1.getElementById DOM提供了一个名为getElementByI ...

  5. JavaScript中常见的十五种设计模式

    在程序设计中有很多实用的设计模式,而其中大部分语言的实现都是基于“类”. 在JavaScript中并没有类这种概念,JS中的函数属于一等对象,在JS中定义一个对象非常简单(var obj = {}), ...

  6. JavaScript 中常见的内存泄露陷阱（摘）

    内存泄露是每个开发者最终都不得不面对的问题.即便使用自动内存管理的语言,你还是会碰到一些内存泄漏的情况.内存泄露会导致一系列问题,比如:运行缓慢,崩溃,高延迟,甚至一些与其他应用相关的问题. 什么是内 ...

  7. javascript中常见的几种循环遍历

    项目开发中,不管是建立在哪个框架基础上,对数据的处理都是必须的,而处理数据离不开各种遍历循环.javascript中循环遍历有很多种方式,记录下几种常见的js循环遍历. 一.for循环 for循环应该 ...

  8. JavaScript中常见数据结构

    数据结构 栈:一种遵从先进后出 (LIFO) 原则的有序集合:新添加的或待删除的元素都保存在栈的末尾,称作栈顶,另一端为栈底.在栈里,新元素都靠近栈顶,旧元素都接近栈底. 队列:与上相反,一种遵循先进 ...

  9. 深圳尚学堂：JavaScript中常见的字符串操作

    快到春节放假了,春节后又是一大波的找工作热潮,在前端实招聘笔试时,必不可免额会考到关于JavaScript中字符串的处理问题.考的不是你会不会,而是你能不能在不借用XX手册或者XX指南再或者百度谷歌的 ...

随机推荐

  1. 【面试笔试算法】Program 5 : 推箱子 (网易游戏笔试题)

    时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 推箱子是一款经典游戏.如图所示,灰色格子代表不能通过区域,蓝色方格是箱子,黑色圆形代表玩家,含有圆点的格子代表目标点. 规 ...

  2. OpenGL下多个sampler在shader中的使用

    在OpenGL中,sampler2D/Cube等做为uniform可以在fragment shader中使用.结合glActiveTexture和glUniform1i,实现texture与sampl ...

  3. web报表工具FineReport的JS编辑框和URL地址栏语法简介

    JS编辑框: 1.FineReport的js. 作为一款BS产品,browser端的JavaScript是必不可少的. FineReport中的js是已经调用了finereport.js的. 大家知道 ...

  4. err：安装程序试图挂载映像 1（缺少ISO 9660图像）

    一般出现此错误是因为你没有把相应的CentOS-6.4-i386-bin-DVD1.iso文件放入到你装系统所引导的盘中,造成找不到挂载映像文件. ubuntu-12.04.3-desktop-i38 ...

  5. 【图片版】学习CSS网格布局

    简言 CSS网格布局(Grid)是一套二维的页面布局系统,它的出现将完全颠覆页面布局的传统方式.传统的CSS页面布局 一直不够理想.包括table布局.浮动.定位及内联块等方式,从本质上都是Hack的 ...

  6. svn 不能添加.a文件

    1.打开终端输入    open ~/.subversion/ 2.双击打开config文件 3.修改如下两行 # global-ignores = *.o *.lo *.la *.al .libs ...

  7. 致IT之路的先驱者和旅人

    1,图灵和香农 故事的开始,要从计算机之父图灵和信息论的创始人香农开始说起.图灵最大的贡献是发明了图灵机,关于图灵机如果要让人明白究竟有什么用,从如何实现一个半导体电路图灵机这方面理解比较好.只要一个 ...

  8. 多重影分身——C#中多线程的使用一(基础)

    首先明确几个概念: 什么是进程? 当一个程序开始运行时,它就是一个进程,进程包括运行中的程序和程序所使用到的内存和系统资源. 而一个进程又是由多个线程所组成的. 一个程序通常只有一个进程(不包括exe ...

  9. JavaScript 将两个数组合并，且删除重复的值

    var a=[1,2,3,4,5,8,9,10]; var b=[6,7,8,9,10]; var c = a.concat(b);//合并成一个数组 console.log(c) temp = {} ...

  10. 关于redis分布式锁的实现方式（转载）

    这个是在网上找到的一个大神写的(http://wudashan.cn/2017/10/23/Redis-Distributed-Lock-Implement/),对于分布式redis部署的,可以参考r ...