JavaScript高级---桥模式设计
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>桥设计模式</title>
<!--
@theme: javascript高级 桥模式设计
@autor：EthanCoco
@date：2015-11-21
@email：lijianlin0204@163.com
-->
<!-- 引入的核心js公共文件 -->
<script type=text/javascript charset=utf-8 src="jquery-1.8.0.min.js"></script>
<script type=text/javascript charset=utf-8>
//命名空间
var LJL = {};
//单体模式 跨浏览器事件处理
LJL.EventHandler = {
addHandler : function(element,type,handle){
if(element.addEventListener){ //狐火
element.addEventListener(type,handle,false);
}else if(element.attachEvent){ //IE
element.attachEvent('on'+type,handle,false);
}
},
removeHandler : function(element,type,handle){
if(element.addEventListener){
element.addEventListener(type,handle,false);
}else if(element.attachEvent){
element.attachEvent('on'+type,handle,false);
}
}
};
// 桥接模式: 主要作用就是把抽象和现实分离开来，使他们可以完全独立变化
// 应用场景：事件监听回调机制 (用户点击一个按钮,向服务器端发送信息)
// 当页面加载完毕之后执行函数体
/*
//经典
$(function(){
// 1前台业务逻辑
var ipn = document.getElementById('ipn');
// 用事件注册的方式 在元素上添加事件
LJL.EventHandler.addHandler(ipn,'click',sendMsg);
//--------------------------------------------------
// 2后台业务逻辑
function sendMsg(){//处理后台的函数
alert(this.value);
}
})
*/
// 利用桥模式 分开俩个业务逻辑单元
$(function(){
// 1前台业务逻辑 : 这一段代码处理前台的事件注册和绑定的
var ipn = document.getElementById('ipn');
// 用事件注册的方式 在元素上添加事件
LJL.EventHandler.addHandler(ipn,'click',bridgeHandler);
//--------------------------------------------------
// 利用桥模式分开
function bridgeHandler(msg){
var msg = this.value;
sendMsg(msg);
}
//--------------------------------------------------
// 2后台业务逻辑 ：这一段代码处理后台发送请求的
function sendMsg(msg){//处理后台的函数
alert(msg);
}
//单元测试
sendMsg("I have getVlaue");
});
// 桥模式：特权函数
var PublicClass = function(){
//private variable
var name = '张三';
// getter 访问私用成员变量 // 特权函数
this.getName = function(){
return name ;
};
};
var p1 = new PublicClass();
alert(p1.getName());
var PublicClass = function(){
// 私用化的变量
var privateMethod = function(){
alert('执行了一个很复杂的操作...');
};
// 单元测试这个很复杂的函数
//privateMethod();
// 通过特权函数去访问这个私用的独立单元
this.bridgeMethod = function(){
return privateMethod();
}
};
var p1 = new PublicClass();
p1.bridgeMethod();
// 桥模式：用桥把多个单体组织在一起
// 使每个单元都能独立化,可以实现自己的变化
var Class1 = function(a,b,c){
this.a = a ;
this.b = b ;
this.c = c ;
};
var Class2 = function(d,e){
this.d = d ;
this.e = e ;
};
var BridgeCalss = function(a,b,c,d,e){
this.class1 = new Class1(a,b,c);
this.class2 = new Class2(d,e);
};
</script>
</head>
<body>
<input id=ipn type=button value="getValue"/>
</body>
</html>
JavaScript高级---桥模式设计的更多相关文章
- JavaScript高级---组合模式设计
一.设计模式 javascript里面给我们提供了很多种设计模式: 工厂.桥.组合.门面.适配器.装饰者.享元.代理.观察者.命令.责任链 在前面我们实现了工厂模式和桥模式 工厂模式 : 核心:为了生 ...
- JavaScript高级---门面模式设计
门面模式 两个作用: 1.简化类的接口 2.消除类与使用它的客户代码之间的耦合 门面模式常常是开发人员最亲密的朋友.它几乎是所有javascript库的核心原则 门面模式的目的是为了让开发人员用更简单 ...
- JavaScript高级---装饰者模式设计
一.设计模式 javascript里面给我们提供了很多种设计模式: 工厂.桥.组合.门面.适配器.装饰者.享元.代理.观察者.命令.责任链 在前面我们实现了工厂模式和桥模式 工厂模式 : 核心:为了生 ...
- javascript闭包(Module模式)的用途和高级使用方式
javascript闭包(Module模式)的用途和高级使用方式 javascript闭包的用途:1. 匿名自执行函数:或者可以理解为,避免污染全局变量2. 缓存:源于闭包的核心特性便是保存状态,应用 ...
- JavaScript高级---适配器模式
一.设计模式 javascript里面给我们提供了很多种设计模式: 工厂.桥.组合.门面.适配器.装饰者.享元.代理.观察者.命令.责任链 在前面我们实现了工厂模式和桥模式 工厂模式 : 核心:为了生 ...
- 《JavaScript高级程序设计》学习笔记(4)——引用类型
欢迎关注本人的微信公众号"前端小填填",专注前端技术的基础和项目开发的学习. 本节内容对应<JavaScript高级程序设计>的第五章内容. 在ECMAScript中, ...
- javascript高级编程笔记01(基本概念)
1.在html中使用JavaScript 1. <script> 元素 <script>定义了下列6个属性: async:可选,异步下载外部脚本文件. charset:可选, ...
- 《Javascript高级程序设计》阅读记录（三）：第五章 上
这个系列以往文字地址: <Javascript高级程序设计>阅读记录(一):第二.三章 <Javascript高级程序设计>阅读记录(二):第四章 这个系列,我会把阅读< ...
- JavaScript高级程序设计第三版.CHM【带实例】
从驱动全球商业.贸易及管理领域不计其数的复杂应用程序的角度来看,说 JavaScript 已经成为当今世界上最流行的编程语言一点儿都不为过. JavaScript 是一种非常松散的面向对象语言,也是 ...
随机推荐
- python常错: join() 方法
描述 Python join() 方法用于将序列中的元素以指定的字符连接生成一个新的字符串. 语法 join()方法语法: str.join(sequence) 参数 sequence -- 要连接的 ...
- 【转载】#303 - Accessibility of Class Members
Members of a class can have different kinds of accessibility. An accessibility keyword indicates wha ...
- keep alive的相关介绍
无论Windows还是linux,Keepalive就三个配置参数.下文以linux环境为介绍. Technorati 标签: keepalive tcp_sock结构体中有三个有关的 ...
- setuid函数解析
在讨论这个setuid函数之前,我们首先要了解的一个东西就是内核为每个进程维护的三个UID值.这三个UID分别是实际用户ID(real uid).有效用户ID(effective uid).保存的设置 ...
- VHDL基本常识
std_logic_vector和integer需要通过signed或unsigned进行间接转换(强制转换) a_std <= std_logic_vector(to_unsigned(a_i ...
- JAVA多线程学习--哲学家就餐问题
哲学家就餐问题是1965年由Dijkstra提出的一种线程同步的问题. 问题描述:一圆桌前坐着5位哲学家,两个人中间有一只筷子,桌子中央有面条.哲学家思考问题,当饿了的时候拿起左右两只筷子吃饭,必须拿 ...
- jeecms获取栏目标题图
[@cms_channel id='1'] <img src="${tag_bean.titleImg!site.typeImg}" /> [/@cms_channel ...
- RichTextBox 自动滚动到最后
RichTextBox.AppendText($"[{DateTime.Now.ToString("hh:mm:ss")}] {msg}\n"); RichTe ...
- kdbchk: the amount of space used is not equal to block size
一.对数据文件检查 注意:应该在关闭数据库模式下进行bbed的操作 [oracle@ora10 controlfile]$ dbv file=/u01/app/oracle/oradata/ORCL/ ...
- HDU 1465 第六周L题
Description 大家常常感慨,要做好一件事情真的不容易,确实,失败比成功容易多了! 做好“一件”事情尚且不易,若想永远成功而总从不失败,那更是难上加难了,就像花钱总是比挣钱容易的道理一样. ...