js之设计模式
关注
分享
扫一扫
Judy1623
前端是个非常具有挑战的工作，只要自己心有所爱，就会成为那个最好的自己！
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
javascript 设计模式(2) —— 策略模式
实现功能：使用Javascript 中的策略模式来实现 根据每一位员工的年底业绩考核，来核算年终奖的需求。第一种（不推荐）1.我们先用我们熟悉的js代码来实现这个功能var calculateBonus = function(salary,perLevel){ if( perLevel === 'S'){ return salary * 4 ; }...翻译 2019-07-10 11:01:48 · 167 阅读 · 0 评论 -
Javascript 设计模式(3) —— 代理模式
第一、定义： 代理模式是为一个对象提供代用品或者占位符，以便控制对它的访问。比如说，某男生小明想向他的女神 A 表白，刚好小明认识的一个女生B 和 女神A 是好朋友，那么小明就想让 女生B 帮忙送花给 女神A 。这个就是一个代理模式。缓存代理模式var mult = function(){ var a = 1; for (var i = 0; i < argum...原创 2019-07-10 17:31:40 · 138 阅读 · 0 评论 -
Javascript 设计模式(4) —— 发布订阅模式
发布—订阅模式可以用一个全局的 Event 对象来实现，订阅者不需要了解消息来自哪个发布者，发布者也不知道消息会推送给哪些订阅者，Event 作为一个类似“中介者”的角色，把订阅者和发布者联系起来。发布订阅模式var Event = (function(){ var clientList = {}, listen, trigger, remove; list...翻译 2019-07-15 13:39:10 · 159 阅读 · 0 评论 -
Javascript 设计模式(5-1) —— 命令模式
命令模式：命令模式的由来，其实是回调（callback）函数的一个面向对象的替代品。功能：点击按钮执行刷新功能流程：设置安装命令的接口 - 点击按钮的执行的具体行为 （比如：刷新-增加子菜单） - 把命令封装在命令类中 - 执行命令...翻译 2019-07-16 09:07:34 · 139 阅读 · 0 评论 -
Javascript 设计模式(5-2) —— 宏命令
宏命令是一组命令的集合，通过执行宏命令的方式，可以一次执行一批命令。下面我们看看如何逐步创建一个宏命令。首先，我们依然要创建好各种 Command：第一步 ：定义好各种命令var closeDoorCommand = { execute: function(){ console.log( '关门' ); } };var openQQComm...翻译 2019-07-16 14:22:44 · 903 阅读 · 0 评论 -
javascript 设计模式(1) —— 单例模式
单例模式是：保证一个类仅有一个实例，并提供一个访问它的全局访问点。例如：用户点击按钮的时候才显示弹框让我们一步步优化，实现更好的单例模式第一种：点击一次创建一个新对象缺点 ： 失去了单例的效果，当我们每次点击的时候都会创建一个新的div<html> <body> <button id="loginBtn">登录</button>...翻译 2019-07-17 09:12:46 · 158 阅读 · 0 评论 -
Javascript 设计模式(6) ——组合模式
组合模式就是用小的子对象来构建更大的对象，这些小的子对象也许是由更小的‘‘孙对象’构成的。marcoCommand 被称为组合对象，closeDoorCommand、openPcCommand、openQQCommand 都是叶对象。例如 ：目前的万能遥控器，包含了关门、开电脑、登录 QQ 这 3 个命令。现在我们需要一个“超级万能遥控器”，可以控制家里所有的电器，这个遥控器拥有以...翻译 2019-07-19 09:08:39 · 206 阅读 · 0 评论 -
javascript 设计模式(9) —— 装饰者模式
装饰者函数 ：可以把行为依照职责分成粒度更细的函数，随后通过装饰把它们合并到一起，这有助于我们编写一个松耦合和高复用性的系统。应用1 ：数据统计上报比如页面中有一个登录 button，点击这个 button 会弹出登录浮层，与此同时要进行数据上报，来统计有多少用户点击了这个登录 button： Function.prototype.after = function( afterfn ){...翻译 2019-07-25 10:41:43 · 149 阅读 · 0 评论 -
javascript 设计模式(7) —— 模板方法模式
模板方法模式 ：在一个方法中定义一个算法的骨架，而将一些步骤的实现延迟到子类中。模板方法使得子类可以在不改变算法结构的情况下，重新定义算法中某些步骤的具体实现。翻译 2019-07-23 09:16:29 · 162 阅读 · 0 评论