一种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 相关文章推荐
YUI 读码日记之 YAHOO.util.Dom - Part.1
Mar 22 Javascript
重载toString实现JS HashMap分析
Mar 13 Javascript
禁用Tab键JS代码兼容Firefox和IE
Apr 18 Javascript
浅谈bootstrap源码分析之tab(选项卡)
Jun 06 Javascript
javascript特效实现——当前时间和倒计时效果的简单实例
Jul 20 Javascript
关于ES6的六个小特性(二)
Feb 20 Javascript
vue.js实现标签页切换效果
Jun 07 Javascript
angular2 ng2-file-upload上传示例代码
Aug 23 Javascript
antd Upload 文件上传的示例代码
Dec 14 Javascript
vue-router 中 meta的用法详解
Nov 01 Javascript
JavaScript 接口原理与用法实例详解
May 12 Javascript
关于angular浏览器兼容性问题的解决方案
Jul 26 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
关于svn冲突的解决方法
2013/06/21 PHP
PHP的Laravel框架结合MySQL与Redis数据库的使用部署
2016/03/21 PHP
laravel框架中路由设置,路由参数和路由命名实例分析
2019/11/23 PHP
编写自己的jQuery插件简单实现代码
2011/04/19 Javascript
浅谈javascript六种数据类型以及特殊注意点
2013/12/20 Javascript
node.js中的fs.chownSync方法使用说明
2014/12/16 Javascript
JS解析XML文件和XML字符串详解
2015/04/17 Javascript
JavaScript编写一个简易购物车功能
2016/09/17 Javascript
jQuery Validation Engine验证控件调用外部函数验证的方法
2017/01/18 Javascript
Google 爬虫如何抓取 JavaScript 的内容
2017/04/07 Javascript
前端axios下载excel文件(二进制)的处理方法
2018/07/31 Javascript
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
2019/11/15 Javascript
Vue自定义render统一项目组弹框功能
2020/06/07 Javascript
JavaScript中Object、map、weakmap的区别分析
2020/12/15 Javascript
python中lambda()的用法
2017/11/16 Python
Python实现基于TCP UDP协议的IPv4 IPv6模式客户端和服务端功能示例
2018/03/22 Python
wxPython的安装与使用教程
2018/08/31 Python
tensorflow2.0与tensorflow1.0的性能区别介绍
2020/02/07 Python
Python matplotlib 绘制双Y轴曲线图的示例代码
2020/06/12 Python
用Python自动清理系统垃圾的实现
2021/01/18 Python
html5基础教程常用技巧整理
2013/08/20 HTML / CSS
英国高街奥特莱斯:Highstreet Outlet
2019/11/21 全球购物
华三通信H3C面试题
2015/05/15 面试题
环境科学专业大学生自荐信格式
2013/09/21 职场文书
高三语文教学反思
2014/01/15 职场文书
学生感冒英文请假条
2014/02/04 职场文书
结婚喜宴主持词
2014/03/14 职场文书
联谊会主持词
2014/03/26 职场文书
思想作风整顿个人剖析材料
2014/10/06 职场文书
2014年机关作风建设工作总结
2014/10/23 职场文书
2016幼儿园教师节新闻稿
2015/11/25 职场文书
会计继续教育培训心得体会
2016/01/19 职场文书
观看《杨善洲》宣传教育片心得体会
2016/01/23 职场文书
HTML+css盒子模型案例(圆,半圆等)“border-radius” 简单易上手
2021/05/10 HTML / CSS
Python OpenCV 图像平移的实现示例
2021/06/04 Python
MySQL数据库必备之条件查询语句
2021/10/15 MySQL