SuriFuture - 博客园

轻松掌握：JavaScript组合模式

摘要：组合模式组合模式：将一组对象组合成树形结构，并统一对待组合对象和叶对象，忽略它们之间的不同（因为叶对象也可以也可以包含叶对象而成为组合对象），组合模式中的对象只能是一对多的关系，不能出现多对一。基本单元：一个组合对象包含多个叶对象。每个基本单元又可以是别的组合对象的叶对象类似文件夹与它里面的内阅读全文

posted @ 2016-08-26 12:49 SuriFuture 阅读(404) 评论(0) 推荐(1) 编辑

轻松掌握：JavaScript观察者模式

摘要：观察者模式观察者模式也叫“订阅者/发布者”模式，定义对象间的一种一对多的依赖关系，发布者可以向所有订阅者发布消息。观察者模式被广泛地应用于JavaScript客户端编程中。所有的浏览器事件（mouseover，keypress等）都是使用观察者模式的例子。使用这个模式的最主要目的就是促进对象之阅读全文

posted @ 2016-08-26 00:48 SuriFuture 阅读(366) 评论(0) 推荐(0) 编辑

轻松掌握：JavaScript代理模式、中介者模式

摘要：代理模式、中介者模式代理模式在面向对象设计中，有一个单一职责原则，指就一个类（对象、函数）而言，应该仅有一个引起它变化的原因。如果一个对象承担了过多的职责，就意味着它将变得巨大，引起它变化的原因就多，它把这些职责耦合到了一起，这种耦合会导致程序难于维护和重构。这时候，我们可以把该对象（本体）的阅读全文

posted @ 2016-08-25 21:30 SuriFuture 阅读(1362) 评论(0) 推荐(1) 编辑

轻松掌握：JavaScript策略模式

摘要：策略模式定义：定义一系列的算法，把它们一个个封装成函数，也可把它们作为属性统一封装进一个对象，然后再定义一个方法，该方法可根据参数自动选择执行对应的算法。一般用于在实现一个功能时，有很多个方案可选择的情况。例子1：根据员工薪水salary、绩效等级S、A、B、C，来计算年终奖例子2：表单验证阅读全文

posted @ 2016-08-25 11:38 SuriFuture 阅读(292) 评论(0) 推荐(1) 编辑

轻松掌握：JavaScript单例模式

摘要：单例模式定义：保证一个对象（类）仅有一个实例，并提供一个访问它的全局访问点；实现原理：利用闭包来保持对一个局部变量的引用，这个变量保存着首次创建的唯一的实例; 主要用于：全局缓存、登录浮窗等只需要唯一一个实例的时候；一. 为一个非单例模式对象（如：Demo）实现单例模式的方法：给Demo添加阅读全文

posted @ 2016-08-24 23:41 SuriFuture 阅读(282) 评论(0) 推荐(0) 编辑

JS常用的设计模式

摘要：单例模式只创建类的唯一一个实例。我们看了好几种可以不通过构造函数和类Java语法达成单例的方法。从另一方面来说，JavaScript中所有的对象都是单例。有时候开发者说的单例是指通过模块化模式创建的对象。工厂模式一种在运行时通过指定字符串来创建指定类型对象的方法。遍历模式通过提供API来实阅读全文

posted @ 2016-08-22 23:17 SuriFuture 阅读(172) 评论(0) 推荐(0) 编辑

原生JS实现-星级评分系统

摘要：今天我又写了个很酷的实例：星级评分系统（可自定义星星个数、显示信息）使用默认值5个星星，默认信息 `var msg = [........]; sufuStar.star(10,msg);`自定义星星个数为10、显示信息msg格式参考默认值，条数必须和星星个数一致；自己实现一些实例，有个好处，能阅读全文

posted @ 2016-08-20 14:31 SuriFuture 阅读(2535) 评论(0) 推荐(1) 编辑

原生JS实现轮播+学前端的感受（防止走火入魔）

摘要：插件！插件！天天听到有人求这个插件，那个插件的，当然，用第三方插件可以大幅提高开发效率，但作为新手，我还是喜欢自己来实现，主要是我有时间！今天我来给大家分享下用原生JS实现图片轮播的写法前辈们可以无视下面这段废话：在开始之前，先说下我学前端到现在的一点感受。到今天应该有两个月左右了吧，基本每天阅读全文

posted @ 2016-08-19 13:18 SuriFuture 阅读(1464) 评论(0) 推荐(1) 编辑

JavaScript实战（原生range和自定义特效）

摘要：今天我又码了两个特效：一个是用原生input[type=range]的，另一个完全自定义的；下面是完整代码和演示： <!DOCTYPE html tip{ position: absolute; top: 30px; left: 0; right: 0; width: 200px; height: 阅读全文

posted @ 2016-08-16 15:34 SuriFuture 阅读(1219) 评论(0) 推荐(0) 编辑

JavaScript实战-菜单特效

摘要：以下是我自己用原生JS写的各种菜单特效，虽然网上一搜一大堆，但我还是喜欢自己来写一写！这是上一篇： "JavaScript实战（带收放动画效果的导航菜单）" 下面是经过优化后的完整代码，优化了CSS样式、简化事件函数、减少HTML层级，删了至少20行以上的冗余代码 __如果各位前辈有好的建议，记得阅读全文

posted @ 2016-08-15 12:48 SuriFuture 阅读(718) 评论(0) 推荐(0) 编辑

导航

公告