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

一、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. Spring配置文件详解

      转自: http://book.51cto.com/art/201004/193743.htm 此处详细的为我们讲解了spring2.5的实现原理,感觉非常有用 spring配置文件是用于指导Sp ...

  2. 传感器之超声波测距HC-SR04

    一.前言 HC-SR04超声波测距模块可提供2cm-400cm的非接触式距离感测功能,测距精度可达高到3mm:模块包括超声波发射器.接收器与控制电路.像智能小车的测距以及转向,或是一些项目中,常常会用 ...

  3. 【前端】使用readline模块实现Node.js的输入输出

    'use strict'; function f(x) { // do something... } var readline = require('readline'); //创建readline接 ...

  4. Navicat for mysql 远程连接 mySql数据库10061、1045错误

    原文地址:http://www.111cn.net/database/mysql/46377.htm 有朋友可能会碰到使用Navicat for mysql 远程连接 mySql数据库会提示10061 ...

  5. java模式-工厂模式

    今天在学习工厂模式,从最简单的简单工厂模式开始. 我们现在需要通过工厂Factory生产A,B两款产品(都是产品,实现了接口Product). 产品A: public class A implemen ...

  6. synergy 两台Windows电脑配置过程

    Synergy 介绍 软件作用 Synergy 两台独立电脑,共享一套鼠标和键盘的工具, 软件原理(我自己想的) 保证两台电脑在一个局域网内,可以相互Ping通的电脑(这样才能直接通过TCP连接) 将 ...

  7. JAVA微信支付多次回调方法解决方案

    @WebServlet("/ActionServlet")public class PayWxOrderingReqCBS extends HttpServlet { public ...

  8. JavaACOFramework的各个类介绍(part1 : Ant类)

    public abstract class Ant extends Observable implements Runnable { public static int ANT_ID = 1; // ...

  9. CodeUI Test:创建第一个CodeUI Test

    CodeUI Test是微软自动化测试的一个比较好的项目,它的原理是获取到Windows窗口上的控件,然后针对控件的部分属性进行获取和对比,模拟对控件进行点击.双击.右键点击等事件.这样可以录制用户测 ...

  10. Openlayers自定义简单popup

    OpenLayers中可以使用很多种类型的popup,大家可以到Openlayers的 popupMatrix.html示例中看.之前存在这样一个错误的想法:popup和marker是绑定的,要有po ...