JavaScript设计模式

JavaScript设计模式--模板方法模式

一、定义模板方法是基于继承的设计模式，可以很好的提高系统的扩展性。java中的抽象父类、子类模板方法有两部分结构组成，第一部分是抽象父类，第二部分是具体的实现子类。二、示例CoffeeorTea(1)把水煮沸(2)用沸水浸泡茶叶(3)把茶水倒进杯子(4)加柠檬/*抽象父类：饮料*/varBeverage=function(){};//(1)把水煮沸Beverage.prototype.boilWa
奋飛·2015-12-20 19:32

JavaScript设计模式--模板方法模式

一、定义模板方法是基于继承的设计模式，可以很好的提高系统的扩展性。java中的抽象父类、子类模板方法有两部分结构组成，第一部分是抽象父类，第二部分是具体的实现子类。二、示例CoffeeorTea(1)把水煮沸(2)用沸水浸泡茶叶(3)把茶水倒进杯子(4)加柠檬/*抽象父类：饮料*/ varBeverage=function(){}; //(1)把水煮沸 Beverage.prototype.boi
ligang2585116·2015-12-20 19:00

JavaScript设计模式--观察者模式

一、定义观察者模式（发布-订阅模式）：其定义对象间一种一对多的依赖关系，当一个对象的状态发生改变时，所有依赖于它的对象都将得到通知。在JavaScript中，一般使用事件模型来替代传统的观察者模式。好处：（1）可广泛应用于异步编程中，是一种替代传递回调函数的方案。（2）可取代对象之间硬编码的通知机制，一个对象不用再显示地调用另外一个对象的某个接口。两对象轻松解耦。二、DOM事件–观察者模式典例需要
ligang2585116·2015-12-20 19:00

JavaScript设计模式--迭代器模式

迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素，而又不需要暴露该对象的内部表示。JavaScript中的Array.prototype.forEach一、jQuery中的迭代器$.each([1,2,3],function(i,n){ console.log("当前下标为："+i+"当前元素为："+n); });二、实现自己的迭代器vareach=function(ary,callba
ligang2585116·2015-12-20 19:00

JavaScript设计模式--代理模式

明星都有经纪人作为代理。如果请明星办一场商演，只能联系其经纪人，经纪人会把商演的细节和报酬谈好，再把合同交给明星签。一、定义代理模式：为一个对象提供一个代用品或占位符，以便控制对它的访问。代理分为：保护代理和虚拟代理保护代理：用于控制不同权限的对象对目标对象的访问，在JavaScript中很难判断谁访问了某个对象，所以保护代理很难实现。二、图片预加载（最常见的虚拟代理应用场景）图片预加载是一种常用
ligang2585116·2015-12-20 19:00

JavaScript设计模式--策略模式

把不变的部分和变化的部分隔开是每个设计模式的主题。条条大路通罗马。我们经常会遇到解决一件事情有多种方案，比如压缩文件，我们可以使用zip算法、也可以使用gzip算法。其灵活多样，我们可以采用策略模式解决。一、定义定义一系列的算法，把它们一个个封装起来，并且使它们可以相互替换。基于策略类模式的程序至少由两部分组成。第一个部分是一组策略类，策略类封装了具体的算法，并负责具体的计算过程。第二个部分是环境
ligang2585116·2015-12-20 18:00

JavaScript设计模式--单例模式

一、定义保证一个类仅有一个实例，并提供一个访问它的全局访问点。当单击登陆按钮，页面中出现一个登陆浮窗，这个登陆浮窗是唯一的，无论单击多少次登陆按钮，这个浮窗都只会被创建一次，那么这个登陆浮窗就适合用单例模式来创建。二、实现原理要实现单例并不复杂，使用一个变量来标志当前是否已经为某个类创建过对象，如果是，则在下一次获取该类的实例时，直接返回之前创建的对象。三、假单例全局变量不是单例模式，但在Java
ligang2585116·2015-12-20 18:00

JavaScript设计模式--前奏

最近阅读了《JavaScript设计模式与开发实践》（2015年度最佳推荐），收获颇多，自己对设计模式有了全新的了解和认识。在项目实践中也用到了一些，感觉很不错。
ligang2585116·2015-12-20 18:00

关于javascript中的类式继承

最近在看《javascript设计模式》，有关类式继承自己感觉比较难于理解，于是乎查找了相关资料，整理如下。1.关于函数对象引自http://cssrain.cn/article.asp?
·2015-12-09 11:03

Prototype源码浅析——Class部分(一)之类

需要深入了解的可以去参考大牛的文章，另推荐几本书《javascript高级程序设计》、《javascript语言精髓与编程实践》和《javascript设计模式》，多读几遍就会对javascript的原型有深入的了解
·2015-12-09 10:45

【学习】Javascript设计模式——设计模式类别

前言命名、抽象、标识是通用设计结构的主要方面，这些设计结构能被用于构造可复用的面向对象设计。设计模式确定所包含的类和实例、它们的角色、协作方式以及职责分配。每一种设计模式都重点关注一个特定的对象设计问题或者设计要点，描述何时使用它，在另一些约束条件下是否还能使用，以及使用的效果和利弊。由于我们最终要实现设计，设计模式还是提供了示例，代码来阐明其实现。虽然设计模式描述的是面向对象设计，但是他们都是基
Jafeney·2015-12-08 22:20

JavaScript设计模式 - 迭代器模式

迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素，而又不需要暴露该对象的内部表示。迭代器模式可以把迭代的过程从业务逻辑中分离出来，在使用迭代器模式之后，即使不关心对象的内部构造，也可以按顺序访问其中的每个元素许多浏览器都支持Javascript的Array.prototype.forEach迭代器可以分为内部迭代器和外部迭代器一、jQuery中的迭代器1$.each([1,2,3,4],
Medeor·2015-12-03 22:00

JavaScript设计模式 - 代理模式

代理模式是为一个对象提供一个代用品或占位符，以便控制对它的访问代理模式的用处(个人理解)：为了保障当前对象的单一职责(相对独立性),而需要创建另一个对象来处理调用当前对象之前的一些逻辑以提高代码的效率、状态判断等。代理模式中最常用的是虚拟代理和缓存代理一、虚拟代理虚拟代理是把一些开销很大的对象，延迟到真正需要它的时候才去创建执行示例:虚拟代理实现图片预加载1//图片加载函数 2varmyImag
Medeor·2015-12-03 00:00

JavaScript设计模式 - 策略模式

策略模式：定义一系列算法，把他们一个一个封装起来，并且使他们可以相互替换(具有相同的目标和意图)示例我是divlineareaseInstrongEaseInstrongEaseOutsineaseInsineaseOut策略模式指的是定义一些列的算法，把他们一个个封装起来，目的就是将算法的使用与算法的实现分离开来。以策略模式的思路实现上边例子的效果的js代码:1.首先封装移动节点的缓动算法1/*
Medeor·2015-11-27 21:00

javascript设计模式--策略模式之输入验证

策略模式定义了算法家族，分别封装起来，让他们之间可以互相替换，此模式让算法的变化独立于使用算饭的客户.先定义一个简单的输入表单：.form{width:px;height:px;#margin:pxauto;}.form-item-label{width:px;text-align:right;float:left;}.form-item-input{float:left;}.form-item{
白色的海·2015-11-27 14:10

javascript设计模式实践之策略模式--输入验证

策略模式中的策略就是一种算法或者业务规则，将这些策略作为函数进行封装，并向外提供统一的调用执行。先定义一个简单的输入表单： .form{ width:400px; height:200px; #margin:0pxauto; } .form-item-label{ width:100px; text-align:right; float:left; }
白色的海·2015-11-27 13:00

学习JavaScript设计模式(策略模式)

何为策略？比如我们要去某个地方旅游，可以根据具体的实际情况来选择出行的线路。1、策略模式的定义如果没有时间但是不在乎钱，可以选择坐飞机。如果没有钱，可以选择坐大巴或者火车。如果再穷一点，可以选择骑自行车。在程序设计中，我们也常常遇到类似的情况，要实现某一个功能有多种方案可以选择。比如一个压缩文件的程序，既可以选择zip算法，也可以选择gzip算法。定义：策略模式定义一系列的算法，分别封装起来，让他
小平果118·2015-11-26 15:47

学习JavaScript设计模式(单例模式)

单例模式的定义：保证一个类仅有一个实例，并提供一个访问它的全局访问点。单例模式是一种常用的模式，有一些对象我们往往只需要一个，比如线程池、全局缓存、浏览器的window对象。在js开发中，单例模式的用途同样非常广泛。试想一下，当我们单击登录按钮的时候，页面中会出现一个登录框，而这个浮窗是唯一的，无论单击多少次登录按钮，这个浮窗只会被创建一次。因此这个登录浮窗就适合用单例模式。1、单例模式的使用场景
小平果118·2015-11-26 15:05

学习JavaScript设计模式(链式调用)

1、什么是链式调用这个很容易理解，例如:$(this).setStyle('color','red').show();一般的函数调用和链式调用的区别：调用完方法后，returnthis返回当前调用方法的对象。functionDog(){this.run=function(){alert("Thedogisrunning....");returnthis;//返回当前对象Dog};this.eat=
小平果118·2015-11-26 14:19

学习JavaScript设计模式(继承)

1、继承在javascript中继承是一个非常复杂的话题，比其他任何面向对象语言的中的继承都复杂得多。在大多数其他面向对象语言中，继承一个类只需要使用一个关键字即可。与它们不同，在javascript中要想达到传承公用成员的目的，需要采取一系列措施。更有甚者，javascript属于使用原型式继承的少数语言之一。利益于这种语言的灵活性，你既可使用标准的基于类的继承，也可使用更微妙一些的原型式继承。
小平果118·2015-11-26 14:45

学习JavaScript设计模式(封装)

在JavaScript中，并没有对抽象类和接口的支持。JavaScript本身也是一门弱类型语言。在封装类型方面，JavaScript没有能力，也没有必要做得更多。对于JavaScript的设计模式实现来说，不区分类型是一种失色，也可以说是一种解脱。从设计模式的角度出发，封装在更重要的层面体现为封装变化。通过封装变化的方式，把系统中稳定不变的部分和容易变化的部分隔离开来，在系统的演变过程中，我们只
小平果118·2015-11-26 14:07

学习JavaScript设计模式(接口)

1、接口概述1）、什么是接口？接口是提供了一种用以说明一个对象应该具有哪些方法的手段。尽管它可以表明这些方法的语义，但它并不规定这些方法应该如何实现。2）、接口之利促进代码的重用。接口可以告诉程序员一个类实现了哪些方法，从而帮助其使用这个类。有助于稳定不同类之前的通信方式。测试和调式因此也能变得更轻松。在javascript这种弱类型语言中，类型不匹配错误很难跟踪。使用接口可以让这种错误的查找变午
小平果118·2015-11-26 14:55

学习JavaScript设计模式(多态)

多态的实际含义是：同一操作作用于不同的对象上面，可以产生不同的解释和不同的执行结果。换句话说，给不同的对象发送同一个消息的时候，这些对象会根据这个消息分别给出不同的反馈。从字面上来理解多态不太容易，下面我们来举例说明一下。主人家里养了两只动物，分别是一只鸭和一只鸡，当主人向它们发出“叫”的命令时，鸭会“嘎嘎嘎”地叫，而鸡会“咯咯咯”地叫。这两只动物都会以自己的方式来发出叫声。它们同样“都是动物，并
小平果118·2015-11-25 17:11

Javascript设计模式理论与实战：观察者模式

观察者模式主要应用于对象之间一对多的依赖关系，当一个对象发生改变时，多个对该对象有依赖的其他对象也会跟着做出相应改变，这就非常适合用观察者模式来实现。使用观察者模式可以根据需要增加或删除对象，解决一对多对象间的耦合关系，使程序更易于扩展和维护。基础知识观察者模式定义了对象间的一种一对多依赖关系，每当一个对象发生改变时，其相关依赖对象皆得到通知并被进行相应的改变。观察者模式又叫做发布-订阅模式。生活
limlim2009·2015-11-25 15:08

Javascript设计模式理论与实战：状态模式

在软件开发中，很大部分时候就是操作数据，而不同数据下展示的结果我们将其抽象出来称为状态，我们平时开发时本质上就是对应用程序的各种状态进行切换并作出相应处理。状态模式就是一种适合多种状态场景下的设计模式。使用状态模式可以可以让代码更加清晰，提高应用程序的维护性和扩展性。基础知识状态模式定义一个对象，这个对象可以通过管理其状态从而使得应用程序作出相应的变化。状态模式是一个非常常用的设计模式，它主要有两
狼狼的蓝胖子·2015-11-25 15:00

Javascript设计模式理论与实战：观察者模式

观察者模式主要应用于对象之间一对多的依赖关系，当一个对象发生改变时，多个对该对象有依赖的其他对象也会跟着做出相应改变，这就非常适合用观察者模式来实现。使用观察者模式可以根据需要增加或删除对象，解决一对多对象间的耦合关系，使程序更易于扩展和维护。基础知识观察者模式定义了对象间的一种一对多依赖关系，每当一个对象发生改变时，其相关依赖对象皆得到通知并被进行相应的改变。观察者模式又叫做发布-订阅模式。生活
狼狼的蓝胖子·2015-11-24 23:00

分享一篇有关变量声明提升机制的博文

从一本有趣的js书说起最近在逛某当搜索javascript的时候发现一本相当有趣的介绍js各种设计模式的教学书籍javascript设计模式（张容铭著）这里给大家安利一下当时看到推荐语里面的介绍说这本书是通过讲述一个菜鸟程序员是如何在职场实践中成长的就立马勾起了我的兴趣
饥人谷_鸡冷·2015-11-21 20:47

JavaScript设计模式 - 单例模式

单例模式：保证一个类仅有一个实例，并提供一个访问它的全局访问点。一、实现一个标准的单例模式，用一个变量来标志当前是否已经为某个类创建过对象，如果是，则在下一次获取该对象实例时，直接返回之前创建的对象示例:1varSingleton=function(name){ 2this.name=name; 3this.instance=null;//使用一个变量来表示是否已经创建该对象 4}; 5
Medeor·2015-11-21 18:00

Javascript设计模式理论与实战：享元模式

 享元模式不同于一般的设计模式，它主要用来优化程序的性能，它最适合解决大量类似的对象而产生的性能问题。享元模式通过分析应用程序的对象，将其解析为内在数据和外在数据，减少对象的数量，从而提高应用程序的性能。基本知识享元模式通过共享大量的细粒度的对象，减少对象的数量，从而减少对象的内存，提高应用程序的性能。其基本思想就是分解现有类似对象的组成，将其展开为可以共享的内在数据和不可共享的外在数据，我们称内
狼狼的蓝胖子·2015-11-20 11:00

Javascript设计模式理论与实战：组合模式

我们平时开发过程中，一定会遇到这种情况：同时处理简单对象和由简单对象组成的复杂对象，这些简单对象和复杂对象会组合成树形结构，在客户端对其处理的时候要保持一致性。比如电商网站中的产品订单，每一张产品订单可能有多个子订单组合，比如操作系统的文件夹，每个文件夹有多个子文件夹或文件，我们作为用户对其进行复制，删除等操作时，不管是文件夹还是文件，对我们操作者来说是一样的。在这种场景下，就非常适合使用组合模式
狼狼的蓝胖子·2015-11-16 12:00

JavaScript设计模式与开发实践 | 04 - 单例模式

单例模式单例模式的定义是：保证一个类仅有一个实例，并提供一个访问它的全局访问点。单例模式是一种常用的模式，有一些对象我们往往只需要一个，比如线程池、全局缓存、浏览器的window对象等。例如，当我们点击登录按钮时，页面会弹出一个登录悬浮窗，而这个登录悬浮窗是唯一的，无论点击多少次登录按钮，这个悬浮窗只会被创建一次，这时，这个悬浮窗就适合用单例模式来创建。实现单例模式实现一个标准的单例模式，一般是用
small2·2015-11-16 00:00

Javascript设计模式（摘译）

说明：未完成。。。更新中。。。。一、javascipt设计模式分类设计模式分类有很多标准，最流行的三种如下1） creational -- 主要关注对象创建Creationaldesignpatternsdealdirectlywithobjectinitializationproceduresfocusingonthecreationofsituation-specificobjects.Wit
Joanna Qian·2015-11-15 04:00

Javascript设计模式（摘译）

说明：未完成。。。更新中。。。。一、javascipt设计模式分类设计模式分类有很多标准，最流行的三种如下1） creational -- 主要关注对象创建Creationaldesignpatternsdealdirectlywithobjectinitializationproceduresfocusingonthecreationofsituation-specificobjects.Wit
Joanna Qian·2015-11-15 04:00

JavaScript设计模式入门小结

    JavaScript是弱类型的语言，程序员在定义变量时并不指定其类型。函数是一等对象，并且可以动态创建和修改，你可以创建闭包。所有的类和对象都是易变的，可以在运行时修改。可供使用的继承范型有两种：原型继承和类继承。 JavaScript这种轻灵的语言中，过度复杂的设计模式会很快把应用程序拖入泥沼。   其他： JavaScript不区分整数和浮
·2015-11-13 22:54

Javascript设计模式-模块模式

一、 模块模式介绍 　　随着网页越来越像桌面程序的大流，Javascript模块化编程已经成为了一个迫切的需求。所谓模块， 就是实现特定功能的一组方法。C++，Java等语言对模块化的实现表现在给类提供私有和公共封装。由于Javascript不支持“类”，因此它需要基于闭包的特性，使用“模块模式”的设计模式，来实现Javascript的模块化编程。 　　以下是实现模块化的方法： 　　1.1
·2015-11-13 20:08

javascript设计模式系列

javascript设计模式系列   创建型： 1.抽象工厂模式（Abstract Factory） 2.构建者模式（Builder） 3.工厂方法模式（Factory
·2015-11-13 19:30

JavaScript设计模式之一Interface接口

如何用面向对象的思想来写JavaScript，对于初学者应该是比较难的，我们经常用的JQuery其实也是用面向对象的思想去封装的，今天我们来看看如何在Javascript中用Interface，在C#还是JAVA中都应该面向接口设计我们的程序，在C#和Java中都Interface这样的关键字，但是JavaScript中没有相应的机制，但是Javascript很灵活，我们可以用它的特性去模仿Int
·2015-11-13 19:07

读过的某些书

比较基础的感觉； javascript语言精粹：周爱民有一本差不多的，弥漫着香味； 高性能javascript：巧妙，学的是思想； javascript权威指南：你会感觉到，一个提升，醍醐灌顶的感觉； javascript
·2015-11-13 16:48

Javascript面向对象之三单例模式-《javascript设计模式》笔记

1.单例模式概述源自百度百科对于单例模式的定义：单例模式的意思就是只有一个实例。单例模式确保某一个类只有一个实例，而且自行实例化并向整个系统提供这个实例。这个类称为单例类。在javascript的世界里，其实没有严格的对象和类定义，“一切皆对象”使得javascript中都是对象，不能像java，c++或者php使用特定的方法返回一个实例来实现，因此对javascript来说，我们要创造的是一个“
·2015-11-13 08:51

2014年11月 上 前端资源分享

资源来自：https://github.com/hacke2/hacke2.github.io/issues/10 js http://blog.jobbole.com/29454/常用javascript
·2015-11-13 06:31

纯javascript对撤销和重写(undo、redo)的完美实现,适用于任何页面元素操作

不知道大家看过java的命令模式没有，命令模式在英文里也叫undo,在javascript设计模式这本书里里就是这样子说的，虽然有好几个英文名称。
·2015-11-13 06:23

《javascript设计模式》-2-接口

/** * 接口是一种指定对象应该有哪些方法的技术，他不关心方法如何实现。 * 基于接口编程的好处是：实现相同接口的对象，可以互换，而不影响功能实现。 * 接口还有利于大项目中，多人合作的交流 */ /**************** 在js中模仿接口 ******************/ //用注释描述接口 //效果最差，不会提供错误信息 //易于实现 /*
·2015-11-13 04:45

有关js进阶的书

我觉得js进阶的书看《Javascript DOM高级程序设计》和《javascript设计模式》就非常不错。
·2015-11-13 04:44

javascript设计模式--备忘录模式（Memento）

1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Memento</title> 6 </head> 7 <bo
·2015-11-13 02:17

javascript设计模式--状态模式（State）

1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>State Pattern</title> 6 </head>
·2015-11-13 02:17

javascript设计模式--单例模式（Singleton）

<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script> /* 单
·2015-11-13 02:16

javascript设计模式-抽象工厂模式

1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>抽线工厂</title> 6 </head> 7 <b
·2015-11-13 02:15

javascript设计模式--中介者模式（Mediator）

1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>中介者模式</title> 6 </head> 7 <
·2015-11-13 02:14

javascript设计模式 - 解释器模式(interpreter)

1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>解释器模式</title> 6 </head>
·2015-11-13 02:13

javascript设计模式-迭代器模式(Iterator)

1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>迭代器模式</title> 6 </head>
·2015-11-13 02:13
上一页 24 25 26 27 28 29 30 31 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他