Javascript设计模式(摘译)
说明: 未完成。。。更新中。。。。
一、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.
创建型设计模式直接处理对象的初始化程序,重点关注创建基于特定场景的对象。它不关注如何创建对象,其复杂性的层次直接加入到应用程序的设计中。创建型设计模式通过在对象创建过程上加上一层来解决问题。
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设计模式
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
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
参看:
- https://carldanley.com/javascript-design-patterns/#creational-design-patterns
Javascript设计模式(摘译)的更多相关文章
- 《JavaScript设计模式 张》整理
最近在研读另外一本关于设计模式的书<JavaScript设计模式>,这本书中描述了更多的设计模式. 一.创建型设计模式 包括简单工厂.工厂方法.抽象工厂.建造者.原型和单例模式. 1)简单 ...
- 《JavaScript设计模式与开发实践》整理
最近在研读一本书<JavaScript设计模式与开发实践>,进阶用的. 一.高阶函数 高阶函数是指至少满足下列条件之一的函数. 1. 函数可以作为参数被传递. 2. 函数可以作为返回值输出 ...
- Javascript设计模式学习一
学习Javascript设计模式之前,需要先了解一些相关知识,面向对象的基础知识.this等重要概念,以及掌握一些函数式编程的技巧. Js多态 多态的思想:实际上是把“做什么”和“谁去做”分离开来.例 ...
- javascript设计模式实践之职责链--具有百叶窗切换图片效果的JQuery插件(三)
在上一篇<javascript设计模式实践之模板方法--具有百叶窗切换图片效果的JQuery插件(二)>里,通过采用模板方法模式完成了切换效果对象的构建编写. 接下来就是完成各效果对象的调 ...
- javascript设计模式实践之模板方法--具有百叶窗切换图片效果的JQuery插件(二)
在上一篇<javascript设计模式实践之迭代器--具有百叶窗切换图片效果的JQuery插件(一)>里,通过采用迭代器模式完成了各初始化函数的定义和调用. 接下来就要完成各个切换效果的编 ...
- javascript设计模式实践之迭代器--具有百叶窗切换图片效果的JQuery插件(一)
类似于幻灯片的切换效果,有时需要在网页中完成一些图片的自动切换效果,比如广告,宣传,产品介绍之类的,那么单纯的切就没意思了,需要在切换的时候通过一些效果使得切换生动些. 比较常用之一的就是窗帘切换了. ...
- 常用的Javascript设计模式
<parctical common lisp>的作者曾说,如果你需要一种模式,那一定是哪里出了问题.他所说的问题是指因为语言的天生缺陷,不得不去寻求和总结一种通用的解决方案. 不管是弱类型 ...
- JavaScript设计模式学习笔记
1 JavaScript设计模式深入分析 私有属性和方法:函数有作用域,在函数内用var 关键字声明的变量在外部无法访问,私有属性和方法本质就是你希望在对象外部无法访问的变量. 特权属性和方法:创建属 ...
- JavaScript设计模式:读书笔记(未完)
该篇随我读书的进度持续更新阅读书目:<JavaScript设计模式> 2016/3/30 2016/3/31 2016/4/8 2016/3/30: 模式是一种可复用的解决方案,可用于解决 ...
随机推荐
- sql获取时间
SELECT CONVERT(varchar(10), getdate(), 120)--当前年月日,Example:2013-11-19 SELECT CONVERT(varchar(10), ge ...
- Bootstrap Modal 垂直方向加滚动条
原文链接:http://blog.csdn.net/cyh1111/article/details/52960747 背景 使用Bootstrap Modal实现用户资料修改,由于用户信息过多,默认M ...
- 学习ceph官网的ceph块设备命令(一)
一)存储池命令 1.列出存储池 #ceph osd lspools #ceph osd pool ls 2.创建存储池 # ceph osd pool create yhcpool 512 pool ...
- PCB走线分析——直角、差分、蛇形线
PCB直角走线的影响 布线(Layout)是PCB设计工程师最基本的工作技能之一.走线的好坏将直接影响到整个系统的性能,大多数高速的设计理论也要最终经过 Layout 得以实现并验证,由此可见,布 ...
- blue and red ball
#include<iostream> #include<cstring> using namespace std; int sum; ]; int n; int head; i ...
- less简单用法
http://less.bootcss.comless工具:koala工具url:http://koala-app.com/index-zh.html// less import: // less 文 ...
- &和&&
int j = 5,k = 3; if(!(j==k) && (j == 1 + k++ )) { } System.out.println(j); System.out.printl ...
- Codeforces Round #388 (Div. 2) A,B,C,D
A. Bachgold Problem time limit per test 1 second memory limit per test 256 megabytes input standard ...
- AspNet MVC中各种上下文理解
0 前言 AspNet MVC中比较重要的上下文,有如下: 核心的上下文有HttpContext(请求上下文),ControllerContext(控制器上下文) 过滤器有关有五个的上下文Actio ...
- 解决yum update失败
1.yum update .yum clean.yum install操作提示 Loaded plugins: fastestmirror, langpacks Loading mirror spee ...