
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 · 904 阅读 · 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 评论