一种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 相关文章推荐
关于jquery.validate1.9.0前台验证的使用介绍
Apr 26 Javascript
jQuery表单验证功能实例
Aug 28 Javascript
使用angularjs创建简单表格
Jan 21 Javascript
jQuery网页定位导航特效实现方法
Dec 19 Javascript
JS去除字符串中空格的方法
Feb 14 Javascript
基于 Vue 的树形选择组件的示例代码
Aug 18 Javascript
js实现各浏览器全屏代码实例
Jul 03 Javascript
mpvue中使用flyjs全局拦截的实现代码
Sep 13 Javascript
vue-cli在 history模式下的配置详解
Nov 26 Javascript
vue基于better-scroll仿京东分类列表
Jun 30 Javascript
vue用elementui写form表单时,在label里添加空格操作
Aug 13 Javascript
解决新建一个vue项目过程中遇到的问题
Oct 22 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
php中iconv函数使用方法
2008/05/24 PHP
在IIS7.0下面配置PHP 5.3.2运行环境的方法
2010/04/13 PHP
《PHP编程最快明白》第六讲:Mysql数据库操作
2010/11/01 PHP
php环境套包 dedeampz 伪静态设置示例
2014/03/26 PHP
深入分析PHP优化及注意事项
2016/07/04 PHP
PHP实现基于栈的后缀表达式求值功能
2017/11/10 PHP
tp5框架使用composer实现日志记录功能示例
2019/01/10 PHP
深入聊聊Array的sort方法的使用技巧.详细点评protype.js中的sortBy方法
2007/04/12 Javascript
javascript的trim,ltrim,rtrim自定义函数
2008/09/21 Javascript
jQuery拖动图片删除示例
2013/05/10 Javascript
javascript删除元素节点removeChild()用法实例
2015/05/26 Javascript
jquery插件splitScren实现页面分屏切换模板特效
2015/06/16 Javascript
JS实现点击复选框将按钮或文本框变为灰色不可用的方法
2015/08/11 Javascript
javascript数据结构之双链表插入排序实例详解
2015/11/25 Javascript
利用jQuery实现CheckBox全选/全不选/反选的简单代码
2016/05/31 Javascript
JS实现将Asp.Net的DateTime Json类型转换为标准时间的方法
2016/08/02 Javascript
JavaScript实现刷新不重记的倒计时
2016/08/10 Javascript
Vue.js第四天学习笔记
2016/12/02 Javascript
使用微信小程序开发前端【快速入门】
2016/12/05 Javascript
JavaScript表单验证的两种实现方法
2017/02/11 Javascript
浅谈Angular4中常用管道
2017/09/27 Javascript
解决vue单页路由跳转后scrollTop的问题
2018/09/03 Javascript
Node登录权限验证token验证实现的方法示例
2020/05/25 Javascript
解决ant Design中this.props.form.validateFields未执行的问题
2020/10/27 Javascript
微信小程序实现点赞业务
2021/02/10 Javascript
安装python3的时候就是输入python3死活没有反应的解决方法
2018/01/24 Python
查看Django和flask版本的方法
2018/05/14 Python
Python itertools.product方法代码实例
2020/03/27 Python
Python 随机生成测试数据的模块:faker基本使用方法详解
2020/04/09 Python
简单总结CSS3中视窗单位Viewport的常见用法
2016/02/04 HTML / CSS
Foot Locker意大利官网:全球领先的运动鞋和服装零售商
2017/05/30 全球购物
小学庆六一活动方案
2014/02/28 职场文书
保护地球的标语
2014/06/17 职场文书
个人查摆剖析材料
2014/10/16 职场文书
教师节晚会主持词
2015/06/30 职场文书
部分武汉产收音机展览
2022/04/07 无线电