说明: 未完成。。。更新中。。。。

一、javascipt设计模式分类

设计模式分类有很多标准,最流行的三种如下

1)  creational  --  主要关注对象创建

Creational design patterns deal directly with object initialization procedures focusing on the creation of situation-specific objects. Without thinking about how objects are created, a level of complexity can be added to the design of an application. Creational design patterns work to solve this problem by adding a layer to the object creation process.

创建型设计模式直接处理对象的初始化程序,重点关注创建基于特定场景的对象。它不关注如何创建对象,其复杂性的层次直接加入到应用程序的设计中。创建型设计模式通过在对象创建过程上加上一层来解决问题。

2)   structural  --  主要关注对象的组合方法

Structural design patterns are ones that focus on easing the relationship between different components of an application. They help to provide stability by ensuring that if one part of the app changes, the entire thing doesn't need to as well.

3)   behavioral --   主要关注对象间的通信方式

Behavioral design patterns emphasize flexibility through the identification of common communication patterns between various objects.

二、日常使用的javascript设计模式

1)The Module Pattern

2)The Revealing Module Pattern

    var account = function(){
var balance = 0; var deposit = function(money){
balance + = money;
console.log("balance after deposti: ",balance);
sendMsg();
}; var withdraw = function(money){
balance -= money;
console.log("balance after withdraw",balance);
sendMsg();
}; //私有方法
var sendMsg = function(){
console.log("sending message!")
}; //公共方法 -- send outside module
return {
deposit:deposit,
withdraw: withdraw
}
}; var a1 = account();
a1.deposit(100);
a1.withdraw(20);
a1.sendMsg(); //could have a alert

3)The Singleton Pattern

            var PersonSingleton =(function(){
var instantiated;
function init(){
function myOtherMethod() {
alert( 'my other method' );
}
return{
name: 'Anonymous',
work: function(){
console.log(this.name + "is working");
},
someOtherMethod: myOtherMethod
}
}
return{
//handles the prevention of additional instantiations
getInstance: function(){
if(!instantiated){
instantiated = init();
}
return instantiated;
}
}
})(); var p1 = PersonSingleton.getInstance();
p1.work(); //return Anonymouse
var p2 = PersonSingleton.getInstance();
p2.work(); //return Anonymouse

4)The Observer Pattern

5)The Mediator Pattern

6)The Prototype Pattern

7)The Facade Pattern

8)The Factory Pattern

参看:

  • https://carldanley.com/javascript-design-patterns/#creational-design-patterns

Javascript设计模式(摘译)的更多相关文章

  1. 《JavaScript设计模式 张》整理

    最近在研读另外一本关于设计模式的书<JavaScript设计模式>,这本书中描述了更多的设计模式. 一.创建型设计模式 包括简单工厂.工厂方法.抽象工厂.建造者.原型和单例模式. 1)简单 ...

  2. 《JavaScript设计模式与开发实践》整理

    最近在研读一本书<JavaScript设计模式与开发实践>,进阶用的. 一.高阶函数 高阶函数是指至少满足下列条件之一的函数. 1. 函数可以作为参数被传递. 2. 函数可以作为返回值输出 ...

  3. Javascript设计模式学习一

    学习Javascript设计模式之前,需要先了解一些相关知识,面向对象的基础知识.this等重要概念,以及掌握一些函数式编程的技巧. Js多态 多态的思想:实际上是把“做什么”和“谁去做”分离开来.例 ...

  4. javascript设计模式实践之职责链--具有百叶窗切换图片效果的JQuery插件(三)

    在上一篇<javascript设计模式实践之模板方法--具有百叶窗切换图片效果的JQuery插件(二)>里,通过采用模板方法模式完成了切换效果对象的构建编写. 接下来就是完成各效果对象的调 ...

  5. javascript设计模式实践之模板方法--具有百叶窗切换图片效果的JQuery插件(二)

    在上一篇<javascript设计模式实践之迭代器--具有百叶窗切换图片效果的JQuery插件(一)>里,通过采用迭代器模式完成了各初始化函数的定义和调用. 接下来就要完成各个切换效果的编 ...

  6. javascript设计模式实践之迭代器--具有百叶窗切换图片效果的JQuery插件(一)

    类似于幻灯片的切换效果,有时需要在网页中完成一些图片的自动切换效果,比如广告,宣传,产品介绍之类的,那么单纯的切就没意思了,需要在切换的时候通过一些效果使得切换生动些. 比较常用之一的就是窗帘切换了. ...

  7. 常用的Javascript设计模式

    <parctical common lisp>的作者曾说,如果你需要一种模式,那一定是哪里出了问题.他所说的问题是指因为语言的天生缺陷,不得不去寻求和总结一种通用的解决方案. 不管是弱类型 ...

  8. JavaScript设计模式学习笔记

    1 JavaScript设计模式深入分析 私有属性和方法:函数有作用域,在函数内用var 关键字声明的变量在外部无法访问,私有属性和方法本质就是你希望在对象外部无法访问的变量. 特权属性和方法:创建属 ...

  9. JavaScript设计模式:读书笔记(未完)

    该篇随我读书的进度持续更新阅读书目:<JavaScript设计模式> 2016/3/30 2016/3/31 2016/4/8 2016/3/30: 模式是一种可复用的解决方案,可用于解决 ...

随机推荐

  1. 精通AngularJS 读书笔记(2)

    AngularJS 速成 视图 因为AngularJS 依靠浏览器去解析模板,所以要保证模板是有效的HTML.尤其要小心闭合号HTML标签(未闭合好的标签不会产生任何错误信息,但会让视图不能正确渲染) ...

  2. linux文件基本属性

    在Linux中第一个字符代表这个文件是目录.文件或链接文件等等. 当为[ d ]则是目录 当为[ - ]则是文件: 若是[ l ]则表示为链接文档(link file): 若是[ b ]则表示为装置文 ...

  3. ipad pro 文章

    这篇文章是通过iPad Pro发送的.体验一下键盘输入,以及safari下的输入.这个键盘的输入手感好一般,按键行程较短.

  4. python 学习笔记十九 django深入学习四 cookie,session

    缓存 一个动态网站的基本权衡点就是,它是动态的. 每次用户请求一个页面,Web服务器将进行所有涵盖数据库查询到模版渲染到业务逻辑的请求,用来创建浏览者需要的页面.当程序访问量大时,耗时必然会更加明显, ...

  5. R语言基本操作函数---变量的基本操作

    1.变量变换        as.array(x),as.data.frame(x),as.numeric(x),as.logical(x),as.complex(x),as.character(x) ...

  6. AIDMA VS AISAS vs ISMAS 营销法则

    AIDMA法则与传统媒体时代 引起注意——产生兴趣——培养欲望——形成记忆——购买行动 注:AIDMA,传统消费者行为学理论模型,即:Attention(引起注意),Interest (引起兴趣),D ...

  7. Oracle(创建序列)

    概念: 所谓序列,在oracle中就是一个对象,这个对象用来提供一个有序的数据列,这个有序的数据列的值都不重复. 1.序列可以自动生成唯一值 2.是一个可以被共享的对象 3.典型的用来生成主键值的一个 ...

  8. Hibernate 继承映射

    @Entity@Inheritance(strategy=InheritanceType.SINGLE_TABLE)@DiscriminatorColumn()public class Animal ...

  9. Cheatsheet: 2016 05.01 ~ 05.31

    Other Awesome Go - A curated list of awesome Go frameworks, libraries and software Visual Studio Cod ...

  10. C#委托,事件理解入门 (译稿)

    原文地址:http://www.codeproject.com/Articles/4773/Events-and-Delegates-Simplified 引用翻译地址:http://www.cnbl ...