<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Javascript高级语法10-工厂模式实例xhr</title>
</head>
<body>
<script>
//接口
var Interface = function(name,methods){
if(arguments.length != 2){
alert("interface must have two paramters...");
}
this.name = name;//这个是接口的名字
this.methods = [];//定义个空数组来转载函数名
for (var i = 0; i < methods.length; i++) {
if(typeof methods[i] != "string"){
alert("method name must is String ...")
}else{
this.methods.push(methods[i])
}
}
}
//定义接口的一个静态方法来实现接口与实现类的直接检验
//静态方法不要写成Interface.prototype.* 因为这是写到接口原型连上的
//我们要把静态的函数直接写到类层次上
Interface.ensureImplements = function(object){
if(arguments.length<2){
alert("必须最少是2个参数");
return false;
}
//遍历
for (var i = 1; i < arguments.length; i++) {
var inter = arguments[i];
//如果你是接口就必须是Interface类型的
if(inter.constructor != Interface){
throw new Error("if is interface class must is Interface type");
}
//遍历函数集合并分析
for (var j = 0; j < inter.methods.length; j++) {
var method = inter.methods[j];
//实现类中必须有方法名字 和 接口中所有的方法名项目
if(!object[method] || typeof object[method] != "function"){
throw new Error("实现类并且没有完全实现接口中的所有方法...");
}
}
}
} //xhr工厂
function demo1(){
//Ajax操作接口
var AjaxHandler = new Interface("AjaxHandler",["request","createXHRObject"]);
//ajax简单实现类
var Simplehandler = function(){};
Simplehandler.prototype = {
/*method: get/post
*url 请求地址
* callback 回调函数
* postVars 传入参数
*/
request:function(method,url,callback,postVars){
//1.得到xhr对象
var xhr = this.createXHRObject();
xhr.onreadystatechange = function(){
if(xhr.readyState != 4){ //4代表的意思是交互完成
return;
}
//200正常交互完成 404 文件没找到 500内部程序出现错误
(xhr.status == 200)?callback.success(xhr.responseText,xhr.responseXML):
callback.failure(xhr.status);
}
//打开链接
xhr.open(method,url,true);//true设置异步
//设置参数
if(method != "POST"){
postVars = null;
}
xhr.send(postVars); },
createXHRObject:function(){
var methods = [
//针对不同的浏览器用不同的方法
function(){return new XMLHttpRequest();},
function(){return new ActiveObject('Msxml2.XMLHTTP');},
function(){return new ActiveObject('Microsoft.XMLHTTP');},
]
//利用try catch制作一个智能循环体
for(var i=0;i<methods.length;i++){
try{
methods[i]();
}
catch(e){
continue;
}
//这句话非常重要,只有这样才能确保 不用每次请求都循环数组
this.createXHRObject = methods[i];
return methods[i]();
}
//如果全不对的话就显式报错
throw new Error("Error");
}
} //实验
var myHandler = new Simplehandler();
var callback = {
success:function(responseText){
alert("Ok")
},
failure:function(status){
alert("failure")
}
}
myHandler.request("GET","",callback);
} demo1();
/*
* 工厂模式使用场合:
* 1.动态实现,创建一些用不同方式实现的同一接口
* 可以被同等对待的一系列类,我们可以用工厂模式来实例化
* 2.节省设置开销,和子系统组合
* 针对不同情况的子系统,进行模块层次的收集,使其子系统使用起来变得更简单。
* 利与弊:
* 松耦合,把创建类等复杂的过程交给工厂来完成,程序员有时间和经历放到重点业务上
*
* 弊端:工厂好用,但处理起来很复杂
* 代码复杂度会随之增高,一般的程序员很难驾驭
* 一般的简单的类 推荐还是用new 比较好
*/
</script>
</body>
</html>

JavaScript设计模式-10.工厂模式实例xhr的更多相关文章

  1. JavaScript设计模式--简单工厂模式例子---XHR工厂

    第一步,Ajax操作接口(目的是起一个接口检测作用) (1)引入接口文件 //定义一个静态方法来实现接口与实现类的直接检验 //静态方法不要写出Interface.prototype ,因为这是写到接 ...

  2. JavaScript设计模式之工厂模式

    一.工厂模式概念 工厂模式定义一个用于创建对象的接口,这个接口由子类决定实例化哪一个类.该模式使一个类的实例化延迟到了子类.而子类可以重写接口方法以便创建的时候指定自己的对象类型(抽象工厂). 这个模 ...

  3. JavaScript设计模式(3)-工厂模式

    工厂模式 1. 简单工厂 简单工厂:使用一个类或对象封装实例化操作 假如我们有个自行车商店类 BicycleShop,它提供了销售自行车的方法可以选择销售两类自行车 Speedster,Comfort ...

  4. JavaScript设计模式--简单工厂模式

    一,介绍 工厂模式创建对象(视为工厂里的产品)时无需指定创建对象的具体类. 工厂模式定义一个用于创建对象的接口,这个接口由子类决定实例化哪一个类.该模式使一个类的实例化延迟到了子类.而子类可以重写接口 ...

  5. javaScript设计模式之----工厂模式

    什么是工厂模式?我们通过一个例子了解一下: 比如我们想要弹出几个字符串 function funA(){ alert('a'); } function funB(){ alert('b'); } fu ...

  6. javascript设计模式-抽象工厂模式

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. JS设计模式——7.工厂模式(示例-XHR)

    XHR工厂 基本实现 var AjaxHandler = new Interface('AjaxHandler', ['request', 'createXHR']); var SimpleHandl ...

  8. 【javascript】javascript设计模式之工厂模式

    1.要解决的问题 2.如何实现 3.与构造函数的区别 4.总结 1.要解决的问题 工厂模式通常用于重复创建相似对象,提供动态创建对象的接口. 2.工厂模式最为设计模式中构造模式之一,通常在类或类的静态 ...

  9. JavaScript设计模式-9.工厂模式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. VS2010中如何将动态链接库改成静态链接库

    VS2010中如何将动态链接库改成静态链接库 VS2010静态编译生成的.exe可执行文件,可以免安装免DLL在其他电脑直接运行. 静态编译:就是在编译可执行文件的时候,将可执行文件需要调用的对应动态 ...

  2. HTML5 Canvas之猜数字游戏

    主要的内容描述的是如何渲染一个矩形的边框和填充背景,以及文字. 代码中有详细的注释: 效果图: 以下是代码: <!DOCTYPE html> <html lang="cn& ...

  3. Javascript Promises 介绍

    什么是 Promises Promises是一种关于异步编程的规范,目的是将异步处理对象和处理规则进行规范化,为异步编程提供统一接口.   传统的回调函数 说到JavaScript的异步编程处理,通常 ...

  4. 从极速飞艇源码 VantComponent 谈 小程序维护

    在开发极速飞艇源码详情咨询Q166848365小程序的时候,我们总是期望用以往的技术规范和语法特点来书写当前的小程序,所以才会有各色的小程序框架,例如 mpvue.taro 等这些编译型框架.当然这些 ...

  5. 搭建自己的 Docker 私有仓库服务

    关于 Docker 的介绍这里就省了,Docker 在其相关领域的火爆程度不亚于今年汽车行业里的特斯拉,docCloud 甚至把公司名都改成了 Docker, Inc. 好东西总是传播很快,我们现在已 ...

  6. LINQ to Entities 基于方法的查询语法

    1.投影: Select 与 SelectMany SelectMany操作符提供了将多个from子句组合起来的功能,相当于数据库中的多表连接查询,它将每个对象的结果合并成单个序列. 与 select ...

  7. Monthly数据类型

    Monthly由来 最近在做关于智能财税的项目,大量用到了账期相关的数据操作.项目已有两年历史了,对于账期数据,前辈们用的是DateTime数据类型,即每个月的最后一天就是账期.而用DateTime来 ...

  8. ie兼容placeholder效果

    转载:http://www.jb51.net/article/56244.htm placeholder是HTML5<input>的属性之一,在不同的浏览器( 支持HTML5的现代浏览器 ...

  9. OpenStack虚机网卡的创建过程

    OpenStack虚机网卡的创建过程 OpenStack最基本和常用的操作就是启动虚机.虚机启动的过程中涉及很多内容,其中非常重要的一个环节就是创建并绑定虚机的虚拟网卡.虚机的创建和管理是Nova的任 ...

  10. GO学习笔记 - 数据类型推导

    官方教程:https://tour.go-zh.org/basics/14 在定义一个变量却并不显式指定其类型时(使用 := 语法或者 var = 表达式语法), 变量的类型由(等号)右侧的值推导得出 ...