一种JavaScript的设计模式


Posted in Javascript onNovember 22, 2006

一种JavaScript的设计模式 
//简单的类的设计模式
//定义一个类class1
function class1() {
  //构造函数
}

//通过指定prototype对象来实现类的成员定义
class1.prototype = {
  someProperty:"simple",
  someMethod:function {
    //方法代码
  },
  //其实属性和方法
}在一个类的成员之间互相引用,必须通过this指针来进行。因为在JavaScript中第个属性和方法都是独立的,它们通过this指针联系在一个对象上。 

//简单的带参数的事件设计模式
<script language="JavaScript" type="text/javascript">
<!--
//将有参数的函数封装为无参数的函数
function createFunction(obj, strFunc) {
  var args = [];//定义args用于存储传递给事件处理程序的参数
  if(!obj) obj = window;//如果是全局函数则obj=window;
  //得到传递给事件处理程序的参数
  for(var i=2; i<arguments.length; i++) {
    args.push(arguments[i]);
  }
  //用无参数函数封装事件处理程序的调用
  return function() {
    obj[strFunc].apply(obj, args);//将参数传递给指定的事件处理程序
  }
}

//定义类class1
function class1() {
  //构造函数
}
class.prototype = {
  show:function() {
    //show函数的实现
     this.onshow();//触发onshow事件
  },
  onShow:function() {}//定义事件接口
}
//创建class1的实例
var obj = new class1();
//创建obj的onshow事件处理程序
function objOnshow(userName) {
   alert("hello,"+userName);
}
//定义变量userName
var userName = "terry";
//绑定obj的onShow事件
obj.onShow=createFunction(null, "objOnshow", userName);
//调用obj的show方法
obj.show();
//-->
</script>
通过createFunction封装,就可以用一种通用的方案实现参数传递。 
//一个简单的开发框架
<script language="javascript">
    var http_request = false;
    function send_request(url) {//初始化、指定处理函数、发送请求的函数
        http_request = false;
        //开始初始化XMLHttpRequest对象
        if(window.XMLHttpRequest) { //Mozilla 浏览器
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) {//设置MiME类别
                http_request.overrideMimeType("text/xml");
            }
        }
        else if (window.ActiveXObject) { // IE浏览器
            try {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e) {}
            }
        }
        if (!http_request) { // 异常,创建对象实例失败
            window.alert("不能创建XMLHttpRequest对象实例.");
            return false;
        }
        http_request.onreadystatechange = processRequest;
        // 确定发送请求的方式和URL以及是否同步执行下段代码
        http_request.open("GET", url, true);
        http_request.send(null);
    }
    // 处理返回信息的函数
    function processRequest() {
        if (http_request.readyState == 4) { // 判断对象状态
            if (http_request.status == 200) { // 信息已经成功返回,开始处理信息
                alert(http_request.responseText);
            } else { //页面不正常
                alert("您所请求的页面有异常。");
            }
        }
    }
</script>

Javascript 相关文章推荐
Mootools 1.2教程 设置和获取样式表属性
Sep 15 Javascript
jquery中each方法示例和常用选择器
Jul 08 Javascript
JS实现无限级网页折叠菜单(类似树形菜单)效果代码
Sep 17 Javascript
举例讲解JavaScript中将数组元素转换为字符串的方法
Oct 25 Javascript
jQuery点击输入框显示验证码图片
May 19 Javascript
JS字符串按逗号和回车分隔的方法
Apr 25 Javascript
在knockoutjs 上自己实现的flux(实例讲解)
Dec 18 Javascript
vue生命周期的探索
Apr 03 Javascript
微信小程序在text文本实现多种字体样式
Nov 08 Javascript
vue实现全屏滚动效果(非fullpage.js)
Mar 07 Javascript
微信小程序之导航滑块视图容器功能的实现代码(简单两步)
Jun 19 Javascript
vue基于better-scroll仿京东分类列表
Jun 30 Javascript
表单内同名元素的控制
Nov 22 #Javascript
document.all与WEB标准
May 13 #Javascript
云网广告中的代码,提示出错,大家找找
Nov 21 #Javascript
在视频前插入广告
Nov 20 #Javascript
使两个iframe的高度与内容自适应,且相等
Nov 20 #Javascript
arguments对象
Nov 20 #Javascript
重定向实现代码
Nov 20 #Javascript
You might like
最小化数据传输――在客户端存储数据
2006/10/09 PHP
PHP脚本的10个技巧(7)
2006/10/09 PHP
用来给图片加水印的PHP类
2008/04/09 PHP
php使用pdo连接mssql server数据库实例
2014/12/25 PHP
PHP连接操作access数据库实例
2015/03/30 PHP
PHP中each与list用法分析
2016/01/08 PHP
php实现断点续传大文件示例代码
2020/06/19 PHP
Javascript实例教程(19) 使用HoTMetal(4)
2006/12/23 Javascript
JQuery 无废话系列教程(二) jquery实战篇上
2009/06/23 Javascript
JavaScript调用客户端的可执行文件(示例代码)
2013/11/28 Javascript
解决用jquery load加载页面到div时,不执行页面js的问题
2014/02/22 Javascript
Javascript递归打印Document层次关系实例分析
2015/05/15 Javascript
javascript 闭包详解
2015/07/02 Javascript
Node.js服务器环境下使用Mock.js拦截AJAX请求的教程
2016/05/23 Javascript
JS之相等操作符详解
2016/09/13 Javascript
浅析使用BootStrap TreeView插件实现灵活配置快递模板
2016/11/28 Javascript
JavaScript奇技淫巧44招【实用】
2016/12/11 Javascript
jQuery Layer弹出层传值到父页面的实现代码
2017/08/17 jQuery
JavaScript对象的浅拷贝与深拷贝实例分析
2018/07/25 Javascript
详解Vue Cli浏览器兼容性实践
2020/06/08 Javascript
JavaScript 中的执行上下文和执行栈实例讲解
2021/02/25 Javascript
[02:39]DOTA2英雄基础教程 极限穿梭编织者
2013/12/05 DOTA
[02:02]2018DOTA2亚洲邀请赛Mineski赛前采访
2018/04/04 DOTA
[52:12]FNATIC vs Infamous 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
python实现目录树生成示例
2014/03/28 Python
python学习数据结构实例代码
2015/05/11 Python
Python正确重载运算符的方法示例详解
2017/08/27 Python
浅谈python 读excel数值为浮点型的问题
2018/12/25 Python
python实现淘宝秒杀脚本
2020/06/23 Python
python交互界面的退出方法
2019/02/16 Python
python def 定义函数,调用函数方式
2020/06/02 Python
一波HTML5 Canvas基础绘图实例代码集合
2016/02/28 HTML / CSS
什么是类的返射机制
2016/02/06 面试题
生产车间实习自我鉴定
2013/09/23 职场文书
《梅花魂》教学反思
2014/04/30 职场文书
小学中队活动总结
2015/05/11 职场文书