浅谈JavaScript中面向对象技术的模拟


Posted in Javascript onSeptember 25, 2006

一、引言

在C#和Java语言中,面向对象是以类的方式实现的,特别是继承这个特性,类的方式继承表现出了强大的功能,而且也易于学习。JavaScript不是纯的面向对象的语言,而是基于对象的语言,对象的继承是以原型函数的形式继承的,很多初学者刚开始接触的时候不太理解,但是JavaScript这种以原型函数的形式实现面向对象技术,不仅是可行的,而且还为面向对象技术提供了动态继承的功能,本文主要讨论了JavaScript的面向对象技术。
二、原型对象概述

每个JavaScript对象都有原型对象,对象都继承原型对象的所有属性。一个对象的原型是由创建该对象的构造函数定义的。JavaScript的所有函数都有一个名为prototype的属性,该属性引用了原型对象,该原型对象初始化的时候只有constructor属性来引用创建该原型对象的对象。JavaScript没有Class定义类的概念,构造函数就定义了类,并初始化类中的属性,每个类的成员都会从原型对象中继承相同的属性,也就是说,原型对象提供了类的实例共享的属性和方法,这就节约了内存。

当读取一个对象的属性的时候,JavaScript会先从对象中查找,如果没有查找到,才会到原型对象中查找该属性(或方法),所以,尤其是对于方法,最好保存到原型对象中以便于共享,并且达到节省内存的目的,而且原型对象还有一个强大的功能,那就是如果通过构造函数实例化一些对象后,再给构造函数的原型对象增加属性和方法,那么它原来实例化的对象实例将会继承这些增加的属性和方法。
三、对象属性、对象方法、类属性、类方法

每个对象都会有自己单独的实例属性和实例方法的副本,如果实例化5个对象,那么就会有5个对象的实例属性和实例方法副本。This关键字引用它们的实例对象,也就是说,谁操作了实例方法,this就引用谁;访问了哪个实例对象的属性,this就引用这个实例对象。

类方法和类属性只有一个副本,类方法调用的时候必须引用类的名字,例如:Date.setHours();

下面用一个程序来表现实例属性、实例方法、类属性、类方法

 function Mobile(kind,brand) { 
    this.kind=kind;//定义手机的种类,例如GSM/CDMA 

    this.brand=brand;//定义手机的品牌,this关键字表示用该构造函数实例化之后的对象 

} 

 

/**//* 

 定义类的第二步是在构造函数的原型对象中定义它的实例方法或其他属性 

 该对象定义的任何属性都将这个类的所有实例继承。 

  

 */ 

 //拨号,这里只是返回电话号码 

Mobile.prototype.dial = function(phoneNo) { 

    return phoneNo; 

}; 

 

 

/**//* 

 定义类的第三步是定义类方法,常量和其他必要的类属性,作为构造函数自身的属性,而不是构造函数 

 原型对象的属性,注意,类方法没有使用关键字this,因为他们只对他们的实际参数进行操作。 

 */ 

//开机关机方法 

Mobile.turnOn=function() { 

   return "The power of mobile is on"; 

} 

Mobile.turnOff=function() { 

   return "The power of mobile is off"; 

}


//类属性,这样他们就可以被用作常量,注意实际上他们并不是只读的

Mobile.screenColor=64K;//假设该类手机的屏幕颜色都是64K彩屏的
四、子类化
   JavaScript支持子类化,只需把子类的原型对象用超类实例化即可,但是应该注意,这样子类化之后就会存在一个问题,由于是用超类实例化子类的原型对象取得的,所以就冲掉了自己本身的由JavaScript提供的constructor属性,为了确保constructor的正确性,需要重新指定一下,子类化的程序例子如下:
   /*****  子类化  *****/
//下面是子类构造函数智能型手机
function SmartPhone(os)
{
  this.os=os;

}
//我们将Mobile对象作为它的原型
//这意味着新类的实例将继承SmartPhone.prototype,
//后者由Mobile.prototype继承而来
//Mobile.prototype又由Object.prototype继承而来
SmartPhone.prototype=new Mobile(GSM,Nokia);
//下面给子类添加一个新方法,发送电子邮件,这里只是返回Email地址
SmartPhone.prototype.sendEmail=function(emailAddress) {
  return this.emailAddress
}
//上面的子类化方法有一点缺陷,由于我们明确把SmartPhone.prototype设成了我们所创建的一个对象,所以就覆盖了JS提供
//的原型对象,而且丢弃了给定的Constructor属性。该属性引用的是创建这个对象的构造函数。但是SmartPhone对象集成了它的
//父类的constructor,它自己没有这个属性,明确设置着一个属性可以解决这个问题:
SmartPhone.prototype.constructor=SmartPhone;
var objSmartPhone=new SmartPhone();//实例化子类

Javascript 相关文章推荐
JavaScript版DateAdd和DateDiff函数代码
Mar 01 Javascript
jquery鼠标滑过提示title具体实现代码
Aug 06 Javascript
jQuery Animation实现CSS3动画示例介绍
Aug 14 Javascript
jquery.ui.draggable中文文档(原文翻译)
Nov 15 Javascript
js实现日期级联效果
Jan 23 Javascript
js文本框输入内容智能提示效果
Dec 02 Javascript
jQuery实现二维码扫描功能
Jan 09 Javascript
Vue自定义指令实现checkbox全选功能的方法
Feb 28 Javascript
layui radio性别单选框赋值方法
Aug 15 Javascript
js实现3D照片墙效果
Oct 28 Javascript
Angular8 简单表单验证的实现示例
Jun 03 Javascript
vue tab滚动到一定高度,固定在顶部,点击tab切换不同的内容操作
Jul 22 Javascript
理解JavaScript中的事件
Sep 23 #Javascript
Valerio 发布了 Mootools
Sep 23 #Javascript
prototype.js的Ajax对象
Sep 23 #Javascript
在Javascript中为String对象添加trim,ltrim,rtrim方法
Sep 22 #Javascript
如何实现JS函数的重载
Sep 22 #Javascript
扩展String功能方法
Sep 22 #Javascript
js实现ASP分页函数 HTML分页函数
Sep 22 #Javascript
You might like
PHILIPS AE3805收音机的分析打磨
2021/03/02 无线电
mysql数据库差异比较的PHP代码
2012/02/05 PHP
PHP自定session保存路径及删除、注销与写入的方法
2014/11/18 PHP
PHP实现图片上传并压缩
2015/12/22 PHP
jscript之Open an Excel Spreadsheet
2007/06/13 Javascript
JQuery里选择超链接的实现代码
2011/05/22 Javascript
找出字符串中出现次数最多的字母和出现次数精简版
2012/11/07 Javascript
jquery移除button的inline onclick事件(已测试及兼容浏览器)
2013/01/25 Javascript
当前页禁止复制粘贴截屏代码小集
2013/07/24 Javascript
javascript中的正则表达式使用指南
2015/03/01 Javascript
个人总结的一些JavaScript技巧、实用函数、简洁方法、编程细节
2015/06/10 Javascript
深入理解JavaScript中的箭头函数
2015/07/28 Javascript
js正则表达式最长匹配(贪婪匹配)和最短匹配(懒惰匹配)用法分析
2016/12/27 Javascript
webpack组织模块打包Library的原理及实现
2018/03/10 Javascript
WebSocket的通信过程与实现方法详解
2018/04/29 Javascript
ES6 Set结构的应用实例分析
2019/06/26 Javascript
layui加载表格,绑定新增,编辑删除,查看按钮事件的例子
2019/09/06 Javascript
js 实现watch监听数据变化的代码
2019/10/13 Javascript
JS document form表单元素操作完整示例
2020/01/13 Javascript
Vue中keep-alive 实现后退不刷新并保持滚动位置
2020/03/17 Javascript
[02:22]2018DOTA2亚洲邀请赛VG赛前采访
2018/04/03 DOTA
Python简单生成8位随机密码的方法
2017/05/24 Python
Python中将dataframe转换为字典的实例
2018/04/13 Python
Python实用技巧之列表、字典、集合中根据条件筛选数据详解
2018/07/11 Python
python使用wxpy实现微信消息防撤回脚本
2019/04/29 Python
浅谈Python中(&,|)和(and,or)之间的区别
2019/08/07 Python
pycharm设置python文件模板信息过程图解
2020/03/10 Python
Eyeko美国:屡获殊荣的睫毛膏、眼线笔和眉妆
2018/07/05 全球购物
迪奥美国官网:Dior美国
2019/12/07 全球购物
4s客服专员岗位职责
2013/12/01 职场文书
《陶罐和铁罐》教学反思
2014/02/19 职场文书
《小动物过冬》教学反思
2014/04/17 职场文书
个人贷款授权委托书样本
2014/10/07 职场文书
小学一年级班主任工作经验交流材料
2015/11/02 职场文书
2019年年中工作总结讲话稿模板
2019/03/25 职场文书
导游词之河北白洋淀
2020/01/15 职场文书