JavaScript中的对象化编程


Posted in Javascript onJanuary 16, 2008

关于对象化编程的语句 现在我们有实力学习以下关于对象化编程,但其实属于上一章的内容了。

with 语句 为一个或一组语句指定默认对象。

用法:
with (<对象>) <语句>;

with 语句通常用来缩短特定情形下必须写的代码量。在下面的例子中,请注意 Math 的重复使用:
x = Math.cos(3 * Math.PI) + Math.sin(Math.LN10);
y = Math.tan(14 * Math.E);

当使用 with 语句时,代码变得更短且更易读:
with (Math) {
  x = cos(3 * PI) + sin(LN10);
  y = tan(14 * E);
}

this 对象 返回“当前”对象。在不同的地方,this 代表不同的对象。如果在 JavaScript 的“主程序”中(不在任何 function 中,不在任何事件处理程序中)使用 this,它就代表 window 对象;如果在 with 语句块中使用 this,它就代表 with 所指定的对象;如果在事件处理程序中使用 this,它就代表发生事件的对象。

一个常用的 this 用法:
<script>
...
function check(formObj) {
  ...
}
...
</script>

<body ...>
...
<form ...>
...
<input type="text" ... onchange="check(this.form)">
...
</form>
...
</body>

这个用法常用于立刻检测表单输入的有效性。

自定义构造函数 我们已经知道,Array(),Image()等构造函数能让我们构造一个变量。其实我们自己也可以写自己的构造函数。自定义构造函数也是用 function。在 function 里边用 this 来定义属性。
function <构造函数名> [(<参数>)] {
  ...
  this.<属性名> = <初始值>;
  ...
}

然后,用 new 构造函数关键字来构造变量:
var <变量名> = new <构造函数名>[(<参数>)];

构造变量以后,<变量名>成为一个对象,它有它自己的属性——用 this 在 function 里设定的属性。

以下是一个从网上找到的搜集浏览器详细资料的自定义构造函数的例子:
function Is() {
  var agent = navigator.userAgent.toLowerCase();
  this.major = parseInt(navigator.appVersion);  //主版本号
  this.minor = parseFloat(navigator.appVersion);//全版本号
  this.ns = ((agent.indexOf('mozilla')!=-1) &&
             ((agent.indexOf('spoofer')==-1) && //是否 Netscape
              (agent.indexOf('compatible') == -1)));
  this.ns2 = (this.ns && (this.major == 3));    //是否 Netscape 2
  this.ns3 = (this.ns && (this.major == 3));    //是否 Netscape 3
  this.ns4b = (this.ns && (this.minor < 4.04)); //是否 Netscape 4 低版本
  this.ns4 = (this.ns && (this.major >= 4));    //是否 Netscape 4 高版本
  this.ie = (agent.indexOf("msie") != -1);      //是否 IE
  this.ie3 = (this.ie && (this.major == 2));    //是否 IE 3
  this.ie4 = (this.ie && (this.major >= 4));    //是否 IE 4
  this.op3 = (agent.indexOf("opera") != -1);    //是否 Opera 3
  this.win = (agent.indexOf("win")!=-1);        //是否 Windows 版本
  this.mac = (agent.indexOf("mac")!=-1);        //是否 Macintosh 版本
  this.unix = (agent.indexOf("x11")!=-1);       //是否 Unix 版本
}

var is = new Is();

这个构造函数非常完整的搜集了浏览器的信息。我们看到它为对象定义了很多个属性:major, minor, ns, ie, win, mac 等等。它们的意思见上面的注释。把 is 变量定义为 Is() 对象后,用 if (is.ns) 这种格式就可以很方便的知道浏览器的信息了。我们也可以从这个构造函数中看到,它也可以使用一般的 JavaScript 语句(上例中为 var 语句)。

让我们再来看一个使用参数的构造函数:
function myFriend(theName, gender, theAge, birthOn, theJob) {
  this.name = theName;
  this.isMale = (gender.toLowerCase == 'male');
  this.age = theAge;
  this.birthday = new Date(birthOn);
  this.job = theJob
}

var Stephen = new myFriend('Stephen', 'Male', 18, 'Dec 22, 1982', 'Student');

从这个构造函数我们不但看到了参数的用法,还看到了不同的属性用不同的数据型是可以的(上例五个属性分别为:字符串,布尔值,数字,日期,字符串),还看到了构造函数里也可以用构造函数来“构造”属性。如果用了足够的“保护措施”来避免无限循环,更可以用构造函数自身来构造自己的属性。

Javascript 相关文章推荐
jQuery bind事件使用详解
May 05 Javascript
使用JavaScript动态设置样式实现代码及演示动画
Jan 25 Javascript
jQuery图片播放8款精美插件分享
Feb 17 Javascript
Jquery 点击按钮自动高亮实现原理及代码
Apr 25 Javascript
简单谈谈javascript代码复用模式
Jan 28 Javascript
JS实现的简洁纵向滑动菜单(滑动门)效果
Oct 19 Javascript
JS查找字符串中出现次数最多的字符
Sep 05 Javascript
js获取元素的标签名实现方法
Oct 08 Javascript
详解JavaScript RegExp对象
Feb 04 Javascript
canvas红包照片实例分享
Feb 28 Javascript
详谈jQuery.load()和Jsp的include的区别
Apr 12 jQuery
vue实现输入框的模糊查询的示例代码(节流函数的应用场景)
Sep 01 Javascript
JavaScript中的事件处理
Jan 16 #Javascript
JavaScript中的其他对象
Jan 16 #Javascript
JavaScript中的Document文档对象
Jan 16 #Javascript
JavaScript中的Location地址对象
Jan 16 #Javascript
JavaScript中的History历史对象
Jan 16 #Javascript
JavaScript中的Window窗口对象
Jan 16 #Javascript
JavaScript中的Screen屏幕对象
Jan 16 #Javascript
You might like
php设计模式 State (状态模式)
2011/06/26 PHP
THINKPHP项目开发中的日志记录实例分析
2014/12/01 PHP
PHP守护进程化在C和PHP环境下的实现
2017/11/21 PHP
Yii2语言国际化自动配置详解
2018/08/22 PHP
php实现微信企业付款到个人零钱功能
2018/10/09 PHP
JavaScript 编程引入命名空间的方法
2007/06/29 Javascript
js确认删除对话框适用于a标签及submit
2014/07/10 Javascript
js对字符的验证方法汇总
2015/02/04 Javascript
浅谈js对象属性 通过点(.) 和方括号([]) 的不同之处
2016/10/29 Javascript
vue.js获取数据库数据实例代码
2017/05/26 Javascript
layerUI下的绑定事件实例代码
2018/08/17 Javascript
vue-cli 使用axios的操作方法及整合axios的多种方法
2018/09/12 Javascript
js 实现在2d平面上画8的方法
2018/10/10 Javascript
微信小程序使用map组件实现解析经纬度功能示例
2019/01/22 Javascript
使用Angular自定义字段校验指令的方法示例
2019/02/01 Javascript
详解vue中axios请求的封装
2019/04/08 Javascript
Python学习小技巧之列表项的排序
2017/05/20 Python
VSCode下好用的Python插件及配置
2018/04/06 Python
Python实现多条件筛选目标数据功能【测试可用】
2018/06/13 Python
python pexpect ssh 远程登录服务器的方法
2019/02/14 Python
Python之NumPy(axis=0 与axis=1)区分详解
2019/05/27 Python
pandas DataFrame行或列的删除方法的实现示例
2019/08/02 Python
[原创]赚疯了!转手立赚800+?大佬的python「抢茅台脚本」使用教程
2021/01/12 Python
波兰快递服务:Globkurier.pl
2019/11/08 全球购物
电气工程及自动化专业自荐书范文
2013/12/18 职场文书
2013年研究生毕业感言
2014/02/06 职场文书
大学生求职工作的自我评价
2014/02/13 职场文书
《木笛》教学反思
2014/03/01 职场文书
医学生求职自荐书
2014/06/12 职场文书
2014最新毕业证代领委托书
2014/09/26 职场文书
批评与自我批评发言稿
2014/10/15 职场文书
教师师德师风整改措施
2014/10/24 职场文书
2015年世界无车日活动总结
2015/03/23 职场文书
保护环境的宣传语
2015/07/13 职场文书
关于运动会的宣传稿
2015/07/23 职场文书
MySQL里面的子查询的基本使用
2021/08/02 MySQL