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 相关文章推荐
用JavaScript实现UrlEncode和UrlDecode的脚本代码
Jul 23 Javascript
通过jQuery源码学习javascript(一)
Dec 27 Javascript
javascript定时变换图片实例代码
Mar 17 Javascript
js实现头像图片切割缩放及无刷新上传图片的方法
Jul 17 Javascript
基于JavaScript实现动态添加删除表格的行
Feb 01 Javascript
JavaScript数据推送Comet技术详解
Apr 07 Javascript
jQuery中on绑定事件后引发的事件冒泡问题如何解决
May 25 Javascript
如何用js实现鼠标向上滚动时浮动导航
Jul 18 Javascript
vue移动端UI框架实现QQ侧边菜单组件
Mar 09 Javascript
解决Mac安装thrift因bison报错的问题
May 17 Javascript
angular4+百分比进度显示插件用法示例
May 05 Javascript
JavaScript onclick事件使用方法详解
May 15 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
《魔兽世界》惊魂幻象将获得调整
2020/03/08 其他游戏
ThinkPHP的L方法使用简介
2014/06/18 PHP
php魔法函数与魔法常量使用介绍
2017/07/23 PHP
PHP与JavaScript针对Cookie的读写、交互操作方法详解
2017/08/07 PHP
js模拟select下拉菜单控件的代码
2013/05/08 Javascript
jquery设置text的值示例(设置文本框 DIV 表单值)
2014/01/06 Javascript
jquery实现翻动fadeIn显示的方法
2015/03/05 Javascript
jquery超简单实现手风琴效果的方法
2015/06/05 Javascript
常用javascript表单验证汇总
2020/07/20 Javascript
js滚动条平滑移动示例代码
2016/03/29 Javascript
jQuery解析XML 详解及方法总结
2016/09/28 Javascript
JavaScript中${pageContext.request.contextPath}取值问题及解决方案
2016/12/08 Javascript
Easyui笔记2:实现datagrid多行删除的示例代码
2017/01/14 Javascript
使用jQuery的load方法设计动态加载及解决被加载页面js失效问题
2017/03/01 Javascript
浅谈Vuex@2.3.0 中的 state 支持函数申明
2017/11/22 Javascript
JavaScript数据结构之双向链表和双向循环链表的实现
2017/11/28 Javascript
JavaScript基于面向对象实现的无缝滚动轮播示例
2020/01/17 Javascript
vue实现简单加法计算器
2020/10/22 Javascript
[02:23]1个至宝=115个英雄特效 最“绿”至宝拉比克“魔导师密钥”登场
2018/12/29 DOTA
Python生成随机数的方法
2014/01/14 Python
使用python绘制人人网好友关系图示例
2014/04/01 Python
python在文本开头插入一行的实例
2018/05/02 Python
Python实现监控键盘鼠标操作示例【基于pyHook与pythoncom模块】
2018/09/04 Python
python根据时间获取周数代码实例
2019/09/30 Python
详解如何用python实现一个简单下载器的服务端和客户端
2019/10/28 Python
基于python图书馆管理系统设计实例详解
2020/08/05 Python
澳大利亚宠物商店:Petbarn
2017/11/18 全球购物
研讨会主持词
2014/04/02 职场文书
语文教研活动总结
2014/07/02 职场文书
建筑施工安全生产责任书
2014/07/22 职场文书
校运动会广播稿300字
2014/10/07 职场文书
警察正风肃纪剖析材料
2014/10/16 职场文书
2014年信息中心工作总结
2014/12/17 职场文书
2015年度个人教学工作总结
2015/05/20 职场文书
钱学森观后感
2015/06/04 职场文书
十大必看国产动漫排名,魁拔上线,第二曾在日本播出
2022/03/18 国漫