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

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. cocos2d-x项目与vs2013编译

    cocos2d-x项目与vs2013编译 2014-12-17 cheungmine 因为C++11引入了众多开源软件的特性,导致cocos2d-x r3.3项目无法用 vs2010编译. 所以安装了 ...

  2. Linux其他常见压缩备份工具 - dd，cpio

    dd dd 可以读取磁碟装置的内容(几乎是直接读取磁区"sector"),然后将整个装置备份成一个文件呢!真的是相当的好用啊- dd 的用途有很多啦-但是我们仅讲一些比较重要的选项 ...

  3. Android开发技巧——自定义控件之组合控件

    Android开发技巧--自定义控件之组合控件 我准备在接下来一段时间,写一系列有关Android自定义控件的博客,包括如何进行各种自定义,并分享一下我所知道的其中的技巧,注意点等. 还是那句老话,尽 ...

  4. Linux之ulimit详解(整理)

    修改:一般可以通过ulimit命令或编辑/etc/security/limits.conf重新加载的方式使之生效通过ulimit比较直接,但只在当前的session有效,limits.conf中可以根 ...

  5. jQuery插件学习基础

    1.给jQuery添加全局的函数: $.zgz={  fn1:function(){ alert('我是刚设置的第一个全局函数') },fn2:function(){ alert('我是刚设置的第二个 ...

  6. VS2010断点调试技巧

    设置断点:在如下图中的红色圆点处设置断点,红色圆点表示已经在这行设置断点.快捷键F9.   启动调试:按F5或者点击左边红框中的按钮.右边框是开始执行(不调试)Ctrl+F5. 调试工具栏:下面是工具 ...

  7. oracle查询表索引

    转载 http://blog.sina.com.cn/s/blog_5376c7190101hvvb.html 如下: select * from user_indexes where table_n ...

  8. Day9 进程理论 开启进程的两种方式 多进程实现并发套接字 join方法 Process对象的其他属性或者方法 守护进程 操作系统介绍

    操作系统简介(转自林海峰老师博客介绍) #一 操作系统的作用: 1:隐藏丑陋复杂的硬件接口,提供良好的抽象接口 2:管理.调度进程,并且将多个进程对硬件的竞争变得有序 #二 多道技术: 1.产生背景: ...

  9. vue项目通过webpack打包生成的dist文件放到express环境里运行（vue+webpack+express）

    1.首先需要的原料肯定是vue打包生成的dist文件 在vue项目目录下运行:npm run build,等待运行结束,会在项目目录下生成一个dist文件夹,里面会生成一些文件(如下图示) 小的项目文 ...

  10. 在VirtualBox中的Ubuntu中添加新硬盘

    步骤如下: 1. 关闭Ubuntu系统,打开VistualBox,"设置"->"存储"->"添加虚拟硬盘" 2. 启动Ubunt ...