JavaScript 基于原型的对象(创建、调用)


Posted in Javascript onOctober 16, 2009

JavaScript中的对象有三种
1,内部对象
如Array,Boolean,Data,Math,Number,Object,RegExp,String对象等
这些对象系统给我们提供了各自的属性与方法供调用。
2,基于类的对象
用类的方式实现对象的引用,这些类需要我们自己定义
3,基于原型的对象
提供有关如何使用 JavaScript 基于原型的对象模型的指南,并且提供指向特定信息的链接,这些信息描述基于原型的对象的自定义构造函数和继承。

在我们写js代码的时候,内部对象是不可避免的要引用,但是光靠这些对象是不够的,所以需要我们自己定义对象,这个时候通常用到的对象是第三种,即基于原型的对象,下面就如何创建自己的对象,定义对象的方法、属性,调用对象给出详细的说明。

//JScript 的一个强大功能是能够定义构造函数,以创建自定义的基于原型的对象,以便在您的脚本中使用。 
//要创建基于原型的对象的实例,首先必须定义一个构造函数。 
//此过程将创建一个新对象并将它初始化(创建属性并赋初始值)。 
//当完成后,构造函数将返回对所构造对象的引用。 
//在构造函数内部,创建的对象是通过 this 语句引用的。 
function people(name,age)//定义people对象 
{ 
this.mName=name;//这里的mName表示属性,无需在外面定义,this指示的是people这个对象 
this.Age=age; 
this.category="哺乳动物"; 
this.toString=Exporting;//方法,注意这里只能写toString,而不是toString() 
this.myMethod=function()//等价于this.myMethod=method;然后下面写method的方法 
{ 
return "你好"; 
} 
} 
function Exporting()//可以有返回值,但函数名前不用写返回值的类型,如string,int之类 
{ 
return "我的名字是——"+this.mName+",年龄是——"+this.Age; 
} 
/*function method() 
{ 
return "你好"; 
}*/ 
people.prototype.getName=function()//在构造函数外面写方法, 
//也也可以这样写function people.prototype.getName() 
//等价于在构造函数里面的方法:this.getName 
{ 
return this.mName; 
} 
people.prototype.getAge=this.Age;//在构造函数外面写属性, 
//等价于在构造函数里面的方法:this.getAge 
function people.prototype.getMoney()//同people.prototype.getMoney=function()等价 
//也等价于在构造函数里的写法:this.getMoney 
{ 
return "1000"; 
} 
function show()//调用people对象 
{ 
var me=new people("刘德华",22);//实例化people对象,关键字new 
//var myName=me.getName(); 
//alert(myName); 
me.sex="男";//这里的sex属性只能用于me这个实例,即特有属性 
//而如果有定义var you =new people("小强",1); 
//you这个实例却不能调用sex属性 
//如果要这两个实例都可以引用的话应该把sex属性写作people.prototype.sex 
//alert(me.sex); 
//alert(me.category); 
//alert(me.toString());//或者直接写alert(me)即可 
//alert(me.myMethod()); 
//alert(me.getMoney()); 
alert(me.myMethod()+"\n姓名:"+me.getName()+"\n性别:"+me.sex+"\n类别:"+me.category+"\n总资产:"+me.getMoney()+"\n总结:"+me.toString()); 
}

根据上面的思路,可以在JavaScript内置对象上添加其它属性或者方法,下面为String对象增加一
good方法和bad属性,这是内置对象中所没有的方法和属性
String.prototype.good=function()//自定义方法 
{ 
return "恭喜你成功对内置String对象追加good方法"; 
} 
String.prototype.bad="恭喜你成功对内置String对象追加bad属性";//自定义属性 
function test()//调用String对象追加的属性和方法 
{ 
var str="good good study";//定义一个字符串实例str 
alert(str.good()+"\n"+str.bad);//调用自定义的string对象的方法good和属性bad 
}

最后在html中添加两个button按钮,测试对象people和string对象追加的方法和属性
<html> 
<title>JavaScript基于原型的对象</title> 
<body> 
<div> 
<input type="button" value="自定义对象定义" onclick="show()"> 
</div> 
<div> 
<input type="button" value="内置对象追加方法" onclick="test()"> 
</div> 
</body> 
</html>

测试结果通过。。。。。。。表明对象的创建、对象方法属性的调用、内部对象的追加方法和属性调用都是正确的。
Javascript 相关文章推荐
jQuery+PHP实现动态数字展示特效
Mar 14 Javascript
JSON字符串转JSON对象
Jul 31 Javascript
jquery实现的仿天猫侧导航tab切换效果
Aug 24 Javascript
基于Jquery插件Uploadify实现实时显示进度条上传图片
Mar 26 Javascript
AngularJS删除路由中的#符号的方法
Sep 20 Javascript
JS控制TreeView的结点选择
Nov 11 Javascript
JS编写函数实现对身份证号码最后一位的验证功能
Dec 29 Javascript
微信小程序时间标签和时间范围的联动效果
Feb 15 Javascript
js/jquery遍历对象和数组的方法分析【forEach,map与each方法】
Feb 27 jQuery
微信公众平台 发送模板消息(Java接口开发)
Apr 17 Javascript
Node.js API详解之 assert模块用法实例分析
May 26 Javascript
探究一道价值25k的蚂蚁金服异步串行面试题
Aug 21 Javascript
JavaScript 定义function的三种方式小结
Oct 16 #Javascript
JavaScript 函数式编程的原理
Oct 16 #Javascript
实现JavaScript中继承的三种方式
Oct 16 #Javascript
显示js对象所有属性和方法的函数
Oct 16 #Javascript
半角全角相互转换的js函数
Oct 16 #Javascript
JavaScript 三种创建对象的方法
Oct 16 #Javascript
JQuery困惑—包装集 DOM节点
Oct 16 #Javascript
You might like
谈谈PHP语法(3)
2006/10/09 PHP
PHP exif扩展方法开启详解
2014/07/28 PHP
在WordPress中使用wp_count_posts函数来统计文章数量
2016/01/05 PHP
Javascript-Mozilla和IE中的一个函数直接量的问题分析
2007/08/12 Javascript
caller和callee的区别介绍及演示结果
2013/03/10 Javascript
Extjs中ComboBoxTree实现的下拉框树效果(自写)
2013/05/28 Javascript
javascript去掉前后空格的实例
2013/11/07 Javascript
JS案例分享之金额小写转大写
2014/05/15 Javascript
JQuery表单验证插件EasyValidator用法分析
2014/11/15 Javascript
js获取时间并实现字符串和时间戳之间的转换
2015/01/05 Javascript
js实现文本框输入文字个数限制代码
2015/12/25 Javascript
你一定会收藏的Nodejs代码片段
2016/02/04 NodeJs
JQuery日期插件datepicker的使用方法
2016/03/03 Javascript
JavaScript实现倒计时跳转页面功能【实用】
2016/12/13 Javascript
微信小程序本作用域下调用全局JS详解及实例
2017/02/22 Javascript
解决vue-router进行build无法正常显示路由页面的问题
2018/03/06 Javascript
vue组件实现弹出框点击显示隐藏效果
2020/10/26 Javascript
vue 项目地址去掉 #的方法
2018/10/20 Javascript
Javascript迭代、递推、穷举、递归常用算法实例讲解
2019/02/01 Javascript
JavaScript前端实现压缩图片功能
2020/03/06 Javascript
Python自动化测试Eclipse+Pydev 搭建开发环境
2016/08/15 Python
Python实现判断一个字符串是否包含子串的方法总结
2017/11/21 Python
python使用zip将list转为json的方法
2018/12/31 Python
pyqt5 实现多窗口跳转的方法
2019/06/19 Python
linux环境下Django的安装配置详解
2019/07/22 Python
Python GUI编程学习笔记之tkinter控件的介绍及基本使用方法详解
2020/03/30 Python
Python实现淘宝秒杀功能的示例代码
2021/01/19 Python
Waterford英国官方网站:世界上最受欢迎的优质水晶品牌
2019/08/17 全球购物
Java语言的优势
2015/01/10 面试题
设备管理实施方案
2014/05/31 职场文书
拉歌口号大全
2014/06/13 职场文书
幼师求职信
2014/06/23 职场文书
公共场所禁烟标语
2014/06/25 职场文书
和谐拯救危机观后感
2015/06/15 职场文书
2016新教师岗前培训心得体会
2016/01/08 职场文书
nginx配置虚拟主机的详细步骤
2021/07/21 Servers