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: 模式是一种可复用的解决方案,可用于解决 ...
随机推荐
- 【转】SVN添加文件时的错误处理:...\conf\svnserve.conf:12: Option expected
转载地址:http://www.linuxidc.com/Linux/2014-09/106683.htm 安装完SVN服务器,添加完用户权限后,准备将本地的项目add到服务器上时,报"C: ...
- AngularJS中多个ng-app(手动加载模块)
1.当有多个ng-app时:(首先是要加载angularJS) <div ng-app=""> <p>姓名:<input type="tex ...
- 2017年1月4日 星期三 --出埃及记 Exodus 21:30
2017年1月4日 星期三 --出埃及记 Exodus 21:30 However, if payment is demanded of him, he may redeem his life by ...
- 关于AJAX 的交互模型、交互流程及代码示范
AJAX = 异步JavaScript + XML. 它是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况 ...
- PHP的一些开源项目网站
https://github.com/wenzhixin/bootstrap-table https://github.com/1000hz/bootstrap-validator
- AIDMA VS AISAS vs ISMAS 营销法则
AIDMA法则与传统媒体时代 引起注意——产生兴趣——培养欲望——形成记忆——购买行动 注:AIDMA,传统消费者行为学理论模型,即:Attention(引起注意),Interest (引起兴趣),D ...
- 微信小程序-位置坐标
wx.getLocation(OBJECT) 获取当前的地理位置.速度. OBJECT参数说明: success返回参数说明: 示例代码: wx.getLocation({ type: 'wgs84' ...
- 【转】关于 mate viewport属性的具体说明!
什么是Viewport 手机浏览器是把页面放在一个虚拟的"窗口"(viewport)中,通常这个虚拟的"窗口"(viewport)比屏幕宽,这样就不用把每个网页 ...
- Openstack+Kubernetes+Docker微服务实践之路--Kubernetes
经过几番折腾终于搞定Kubernetes了,我们要在Openstack上部署Kubernetes集群,使用最新工具Kubeadm来安装,由于不能直接访问Kubernetes的源,我们需要一台可以穿墙的 ...
- attr和prop区别
今天写了个小程序,获取input[checked]属性,$('#check1').attr('checked'),结果返回undefined,查询了一番, 如果是具有true和false两个属性值的属 ...