JavaScript设计模式-19.代理模式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>javascript高级语法19-代理模式</title>
</head>
<body>
<script>
/*代理是一个对象（proxy），用它来控制对 目标对象的访问
* 他要实现与目标对象相同的接口，但不同于装饰者模式。
* 它对目标对象不进行任何修改。
* 它的目的在于：延缓复杂对象的初始化时间，
* 这样可以再用刀这个目标对象的时候再初始化它。
* （对于单例来讲，更是重要。）
*/
function demo1(){
//图书类
var Book = function(id,name,price){
this.id = id;
this.name = name;
this.price = price;
}
//目标类
var myBookShop = (function(){
//书店里的书
var books = {}
return function(bks){
if(typeof bks == "object"){
books = bks;
}
//加书
this.addBook = function(book){
books[book.id] = book;
}
this.findBook = function(bid){
//这块后边用责任链模式改写。
if(books[bid]){
return books[bid];
}else{
return null;
}
}
this.returnBook = function(book){
this.addBook(book);
}
this.checkBook = function(bid){
var book = this.findBook(bid);
return book;
}
// Interface.ensureImplements(this,bookShop);
}
})(); // 普通代理：没什么意义，一般不用
var myBookShopProxy = function(bks){
var obj = new myBookShop(bks);
//加书
this.addBook = function(book){
obj.addBook(book);
}
this.findBook = function(bid){
return obj.findBook(bid);
}
this.returnBook = function(book){
obj.returnBook(book);
}
this.checkBook = function(bid){
return obj.checkBook(bid);
}
} var proxy = new myBookShopProxy({
"001":new Book("001","extjs","45"),
"002":new Book("002","javascript","22")
})
alert(proxy.checkBook("002").name);
/*这个代理是严格按照定义来写的
* 一般开发中不会用到，没什么意义
*/
}
// demo1(); //惰性代理
function demo2(){
//图书类
var Book = function(id,name,price){
this.id = id;
this.name = name;
this.price = price;
}
//目标类
var myBookShop = (function(){
//书店里的书
var books = {}
return function(bks){
if(typeof bks == "object"){
books = bks;
}
//加书
this.addBook = function(book){
books[book.id] = book;
}
this.findBook = function(bid){
//这块后边用责任链模式改写。
if(books[bid]){
return books[bid];
}else{
return null;
}
}
this.returnBook = function(book){
this.addBook(book);
}
this.checkBook = function(bid){
var book = this.findBook(bid);
return book;
}
// Interface.ensureImplements(this,bookShop);
}
})(); //惰性代理
var myBookShopProxy = function(bks){
var obj = null;
this._init = function(){
alert("这时候初始化本类");
obj = new myBookShop(bks);
}
//加书
this.addBook = function(book){
this._init();
obj.addBook(book);
}
this.findBook = function(bid){
this._init();
return obj.findBook(bid);
}
this.returnBook = function(book){
this._init();
obj.returnBook(book);
}
this.checkBook = function(bid){
this._init();
return obj.checkBook(bid);
} }
var proxy = new myBookShopProxy({
"001":new Book("001","extjs","45"),
"002":new Book("002","javascript","22")
})
alert(proxy.checkBook("001").name); //调用方法的时候，才会初始化本类。
}
// demo2(); function demo3(){
/*模仿extjs store proxy之间的关系
*/
//定义命名空间
var Ext = Ext || {};
Ext.data = Ext.data || {};
//建立model
Ext.data.Model = function(fields){
this.fields = fields;
}
//model模型 proxy代理
Ext.data.Store = function(model,proxy){
//数据载体
var data = [];
this.model = model;
this.proxy = proxy;
//加载数据
this.load = function(){
var d = this.proxy.request();
//数据操作
for(var i=0;i<d.length;i++){
var o = {};
for(var k=0;k<model.fields.length;k++){
o[model.fields[k]["name"]] =
d[i][model.fields[k]["name"]];
}
data.push(o);
} }
//根据索引得到model
this.getAt = function(index){
return data[index];
}
//得到所有数据的count
this.getCount = function(){
return data.length;
}
//清除所有数据
this.removeAll = function(){
data = [];
}
//遍历
this.each = function(fn,scope){
for(var i=0;i<data.length;i++){
if(scope){
fn.call(scope,data[i]);
}else{
fn.call(this,data[i]);
}
}
}
}
//定义ajax的本体
Ext.Ajax = Ext.Ajax || function(){};
Ext.Ajax.prototype.request = function(type,extraParams,method,url){
//1.得到跨浏览器的xhr对象，发送请求
//2.验证请求的状态等等复杂的操作。
//3.我们认为这个本体是一个大型的复杂的对象。
//4.应该在这里使用惰性代理。
return [{'id':001,name:"extjs"},{id:"002",name:"js"}];
}
//代理类
Ext.Ajax.proxy = function(){
var ajax = null;
//构造函数
this._init = function(){
ajax = new Ext.Ajax();
}
this.request = function(type,extraParams,method,url){
this._init();
return ajax.request(type,extraParams,method,url);
}
}
//测试
var person = new Ext.data.Model([{
name:"name"
},{
name:"id"
}]); var personStore = new Ext.data.Store(person,new Ext.Ajax.proxy()); personStore.load();
alert(personStore.getCount());
alert(personStore.getAt(0).name);
personStore.each(function(model){
document.write(model.name + "<br>");
})
}
demo3();
</script>
</body>
</html>
JavaScript设计模式-19.代理模式的更多相关文章
- JavaScript设计模式之代理模式
一.代理模式概念 代理,顾名思义就是帮助别人做事,GoF对代理模式的定义如下: 代理模式(Proxy),为其他对象提供一种代理以控制对这个对象的访问.代理模式使得代理对象控制具体对象的引用.代理几乎可 ...
- 再起航，我的学习笔记之JavaScript设计模式19(状态模式)
状态模式 概念介绍 状态模式(State):当一个对象的内部状态发生改变时,会导致其行为的改变,这看起来像是改变了对象 示例演示 在我们写项目的过程中或多或少会遇到如下的多分支判断 function ...
- JavaScript 设计模式之代理模式
一.代理模式概念解读 1.代理模式概念文字解读 代理,顾名思义就是帮助别人做事,GOF对代理模式的定义如下: 代理模式(Proxy),为其他对象提供一种代理以控制对这个对象的访问.代理模式使得代理对象 ...
- 第三章 --- 关于Javascript 设计模式 之 代理模式
第一.定义: 代理模式是为一个对象提供代用品或者占位符,以便控制对它的访问. 比如说,某男生小明想向他的女神 A 表白,刚好小明认识的一个女生B 和 女神A 是好朋友,那么小明就想让 女生B 帮忙送花 ...
- JavaScript设计模式_03_代理模式
代理模式是非常常见的模式,比如我们使用的VPN工具,明星的经纪人,都是代理模式的例子.但是,有人会疑问,明明可以直接访问对象,为什么中间还要加一个壳呢?这也就说到了代理模式的好处.在我看来,代理模式最 ...
- 学习javascript设计模式之代理模式
1.代理模式为一个对象提供一个代用品或占位符,以便控制对它的访问. 2.不用代理模式: 客户 -> 本体 使用代理模式: 客户 -> 代理 -> 本体 3.例子场景1 点击操作与 ...
- JavaScript设计模式（代理模式）
一.简单的单例模式: 1.未使用代理模式的情况:小明直接给女神送花 var Flower = function() {} var xiaoming = { sendFlower: function( ...
- Java设计模式之代理模式（静态代理和JDK、CGLib动态代理）以及应用场景
我做了个例子 ,需要可以下载源码:代理模式 1.前言: Spring 的AOP 面向切面编程,是通过动态代理实现的, 由两部分组成:(a) 如果有接口的话 通过 JDK 接口级别的代理 (b) 如果没 ...
- 夜话JAVA设计模式之代理模式（Proxy）
代理模式定义:为另一个对象提供一个替身或者占位符以控制对这个对象的访问.---<Head First 设计模式> 代理模式换句话说就是给某一个对象创建一个代理对象,由这个代理对象控制对原对 ...
随机推荐
- windows本地代码上传github
1.下载Git工具 https://www.git-scm.com/download/win 2.进到项目目录 cd /dir/dir/dir/file 3.初始化 git init 4.添加远程仓库 ...
- CDI(Weld)高级<4> Event(事件) （转）
目录[-] 1. Event payload(事件的有效载入) 2. Event observers(event的观察者) 3. Event producers(event生产者) 4.Annotat ...
- SparkSQL大数据实战：揭开Join的神秘面纱
本文来自 网易云社区 . Join操作是数据库和大数据计算中的高级特性,大多数场景都需要进行复杂的Join操作,本文从原理层面介绍了SparkSQL支持的常见Join算法及其适用场景. Join背景介 ...
- django系列5.1--ORM对数据库的操作
Django---ORM数据库操作(图书管理系统基本实例) 一.基本知识 MVC模式(Model–view–controller)是软件工程中的一种软件架构模式,把软件系统分为三个基本部分:模型(Mo ...
- python--内置模块(二) os sys pickle json
1.os模块 常用方法: os.makedirs('dirname1/dirname2') 可生成多层递归目录 os.removedirs('dirname1') 若目录为空,则删除,并递归到上一级目 ...
- web负载均衡【总结归纳所有看过的资料的理论】
web负载均衡 在有些时候进行扩展是显而易见的,比如下载服务由于带宽不足而必须进行的扩展,但是,另一些时候,很多人一看到站点性能不尽如人意,就马上实施负载均衡等扩展手段,真的需要这样做吗?当然这个问题 ...
- 在线编辑器Ckeditor （1） - php （30）
在线编辑器 在线编辑器也称之为所见即所得编辑器,是一种常见的html源码编辑器. 所见即所得:用户在输入的时候,不论是格式和是样式都能被系统原封不动的保存,最后在查看的时候,可以按照用户输入的原来的结 ...
- centos7无GUI运行selenium chromedriver 亲测可用！
1. 安装chrome 首先安装google的epel源 vi /etc/yum.repos.d/google.repo [google] name=Google-x86_64 baseurl=htt ...
- Bootstrap中表单控件状态(验证状态)
Bootstrap 表单 http://www.runoob.com/try/try2.php?filename=bootstrap3-form-controlstate (这链接里有简介) &l ...
- Linux动态库的导出控制
在实际工作中,许多软件模块是以动态库的方式提供的.做为模块开发人员,我们不仅要掌握如何编写和构建动态库,还要了解如何控制动态库的导出接口,这样,我们可以向模块的用户仅导出必要的接口,而另一些内部接口, ...