JavaScript 原型学习总结


Posted in Javascript onOctober 29, 2010

每个对像都有一个隐慝的属性用于指向到它的父对像(构造对像的函数)的原型(这里称为父原型或隐式原型),并从中继承它的属性和方法 [函数对像除了父原型引用外,还有一个显式的原型引用],在一般情况下,对像的父原型是不可以访问的,而函数对像的显式原型可以通过FunctionName.prototype进行访问 [在FireFox中你可以通过对像的__proto__属性来访问对像的父原型]

这个原型属性本身又是一个Object类型的对像,因此可以给这个原型属性添加任意的属性和方法 让实例对像来继承它们

如: 一个String类型的对像的原型为String.prototype,如果我们想要给String类型的对像添加一些自定义的方法,那我们可以这样来实现(这里以添加一个类式VBscript中的trim方法为例)

String.prototype.trim=function(){ 
return this.replace(/^\s*|\s*$/g,"") 
} 
// " jiangsk540 ".trim();//return "jiagnsk540"

原型除了提供以上的特性之外,它还提供了一群同类实例对像共享属性和方法的机制 [也就相当于静态属性或静态函数,无论用构造函数创建了多少个实例对像,在原型上定义的属性和方法从头到尾只定义了一次,所有实例对像都共享使用这一个属性或方法 但并非和C++或JAVA的静态属性或静态函数的概念相同]
function Class1(name){ 
this.name = name; 
} 
Class1.prototype.show=function(){ 
alert("name="+this.name); 
} 
var m1 = new Class1("jiangsk540"); 
var m2 = new Class1("毛狮子"); 
alert(m1.show===m2.show);//显示 true

动态给构造函数原型添加的属性或方法即可被先前建立的对像立即调用

function Class1(name){ 
this.name = name; 
} 
Class1.prototype.show=function(){ 
alert("name="+this.name); 
} 
var m1 = new Class1("jiangsk540"); 
Class1.prototype.say=function(){ 
alert("Hi"); 
} 
m1.say()//调用成功 
/* 
注意:只有为构造函数的原型添加的属性或方法才能被已经创建的对像立即调用 
如果是改变构造函数原型的引用那么就不能被已经创建的对像立即调用 
*/ 
Class1.prototype={newP:"jiangsk540"}; 
alert(m1.newP)//undefined
Javascript 相关文章推荐
javascript实现unicode和字符的互相转换
Jul 18 Javascript
判断客户端浏览器是否安装了Flash插件的多种方法
Aug 11 Javascript
DIY jquery plugin - tabs标签切换实现代码
Dec 11 Javascript
angularjs 中$apply,$digest,$watch详解
Oct 13 Javascript
JavaScript使用原型和原型链实现对象继承的方法详解
Apr 05 Javascript
Angular 2父子组件之间共享服务通信的实现
Jul 04 Javascript
ant-design-vue 实现表格内部字段验证功能
Dec 16 Javascript
微信小程序全选多选效果实现代码解析
Jan 21 Javascript
Taro UI框架开发小程序实现左滑喜欢右滑不喜欢效果的示例代码
May 18 Javascript
jQuery HTML获取内容和属性操作实例分析
May 20 jQuery
JavaScript实现缓动动画
Nov 25 Javascript
JS Canvas接口和动画效果大全
Apr 29 Javascript
用JQuery调用Session的实现代码
Oct 29 #Javascript
基于jquery 的一个progressbar widge
Oct 29 #Javascript
JQuery开发的数独游戏代码
Oct 29 #Javascript
Web前端设计模式  制作漂亮的弹出层
Oct 29 #Javascript
10个基于Jquery的幻灯片插件教程
Oct 29 #Javascript
jQuery.ajax 用户登录验证代码
Oct 29 #Javascript
Jquery Autocomplete 结合asp.net使用要点
Oct 29 #Javascript
You might like
php多维数组去掉重复值示例分享
2014/03/02 PHP
php自定义函数截取汉字长度
2014/05/15 PHP
PHP实现中文圆形印章特效
2015/06/19 PHP
关于PHP通用返回值设置方法
2017/03/31 PHP
php设计模式之装饰模式应用案例详解
2019/06/17 PHP
当鼠标滑过文本框自动选中输入框内容的JS代码分享
2013/11/26 Javascript
jQuery设置Cookie及删除Cookie实例分析
2016/04/15 Javascript
jQuery实现可展开折叠的导航效果示例
2016/09/12 Javascript
BootStrap中Table分页插件使用详解
2016/10/09 Javascript
JavaScript之DOM插入更新删除_动力节点Java学院整理
2017/07/03 Javascript
JavaScript中一些特殊的字符运算
2017/08/17 Javascript
详解create-react-app 自定义 eslint 配置
2018/06/07 Javascript
详解vue2.0+axios+mock+axios-mock+adapter实现登陆
2018/07/19 Javascript
vue-cli3搭建项目的详细步骤
2018/12/05 Javascript
原生JavaScript实现随机点名表
2021/01/14 Javascript
微信小程序canvas实现签名功能
2021/01/19 Javascript
python访问mysql数据库的实现方法(2则示例)
2016/01/06 Python
Python模拟三级菜单效果
2017/09/11 Python
Python 十六进制整数与ASCii编码字符串相互转换方法
2018/07/09 Python
Django分页功能的实现代码详解
2019/07/29 Python
Flask教程之重定向与错误处理实例分析
2019/08/01 Python
如何使用python实现模拟鼠标点击
2020/01/06 Python
基于python计算滚动方差(标准差)talib和pd.rolling函数差异详解
2020/06/08 Python
python将字典内容写入json文件的实例代码
2020/08/12 Python
python爬取微博评论的实例讲解
2021/01/15 Python
python Autopep8实现按PEP8风格自动排版Python代码
2021/03/02 Python
意大利拉斐尔时尚购物网:Raffaello Network(支持中文)
2018/11/09 全球购物
美国在线肉类和海鲜配送:Crowd Cow
2020/10/02 全球购物
运动会广播稿100字
2014/01/11 职场文书
年会活动策划方案
2014/01/23 职场文书
处级领导班子全部召开专题民主生活会情况汇报
2014/09/27 职场文书
老公婚前保证书
2015/02/28 职场文书
2016社区平安家庭事迹材料
2016/02/26 职场文书
如何将numpy二维数组中的np.nan值替换为指定的值
2021/05/14 Python
利用Python多线程实现图片下载器
2022/03/25 Python
详解Anyscript开发指南绕过typescript类型检查
2022/09/23 Javascript