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 相关文章推荐
如何取得中文输入的真实长度?
Jun 24 Javascript
javascript中利用数组实现的循环队列代码
Jan 24 Javascript
jquery滚动组件(vticker.js)实现页面动态数据的滚动效果
Jul 03 Javascript
快速查找数组中的某个元素并返回下标示例
Sep 03 Javascript
Javascript delete 引用类型对象
Nov 01 Javascript
node.js中的http.response.removeHeader方法使用说明
Dec 14 Javascript
jQuery固定元素插件scrolltofixed使用指南
Apr 21 Javascript
浅谈jquery的map()和each()方法
Jun 12 Javascript
vuejs在解析时出现闪烁的原因及防止闪烁的方法
Sep 19 Javascript
jQuery电话号码验证实例
Jan 05 Javascript
element-ui 文件上传修改文件名的方法示例
Nov 05 Javascript
JS自定义滚动条效果
Mar 13 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 获取本机外网/公网IP的代码
2010/05/09 PHP
php读取mysql乱码,用set names XXX解决的原理分享
2011/12/29 PHP
PHP中文字符串截断无乱码解决方法
2016/10/10 PHP
jquery插件制作教程 txtHover
2012/08/17 Javascript
HTML页面滚动时获取离页面顶部的距离2种实现方法
2013/09/05 Javascript
子页向父页传值示例
2013/11/27 Javascript
jquery实现动态菜单的实例代码
2013/11/28 Javascript
js实现iframe框架取值的方法(兼容IE,firefox,chrome等)
2015/11/26 Javascript
js图片上传前预览功能(兼容所有浏览器)
2016/08/24 Javascript
JavaScript中绑定事件的三种方式及去除绑定
2016/11/05 Javascript
jQuery生成假加载动画效果
2016/12/01 Javascript
DropDownList控件绑定数据源的三种方法
2016/12/24 Javascript
JS实现京东首页之页面顶部、Logo和搜索框功能
2017/01/12 Javascript
vue中mint-ui环境搭建详细介绍
2017/04/06 Javascript
JavaScript 中Date对象的格式化代码方法汇总
2017/09/06 Javascript
laravel5.3 vue 实现收藏夹功能实例详解
2018/01/21 Javascript
一步一步实现Vue的响应式(对象观测)
2019/09/02 Javascript
vue设置动态请求地址的例子
2019/11/01 Javascript
Python排序搜索基本算法之选择排序实例分析
2017/12/09 Python
Django 缓存配置Redis使用详解
2019/07/23 Python
python中调试或排错的五种方法示例
2019/09/12 Python
python飞机大战pygame游戏框架搭建操作详解
2019/12/17 Python
结束运行python的方法
2020/06/16 Python
Python selenium实现断言3种方法解析
2020/09/08 Python
Python三维绘图之Matplotlib库的使用方法
2020/09/20 Python
SmartBuyGlasses美国官网:太阳眼镜和眼镜
2017/08/20 全球购物
欧洲最大的球衣网上商店:Kitbag
2017/11/11 全球购物
PHP解析URL是哪个函数?怎么用?
2013/05/09 面试题
若干个Java基础面试题
2015/05/19 面试题
Unix/Linux开发面试题
2016/08/16 面试题
最受欢迎的自我评价
2013/12/22 职场文书
项目建议书怎么写
2014/05/15 职场文书
安全横幅标语
2014/06/09 职场文书
汽车转让协议书范本
2014/12/07 职场文书
让人瞬间清醒的句子,句句经典,字字如金
2019/07/08 职场文书
vue中div禁止点击事件的实现
2022/04/02 Vue.js