关于Javascript 的 prototype问题。


Posted in Javascript onJanuary 03, 2007

prototype

1、prototype是与Clone联系起来的,
也就是说,当创建实例时,prototype会把成员clone到该Class(function)的实例上。
Detail: 最常见的几个内置内对象里的prototype,如:Array原型有join, split方法,
当创建数组a时var a=[1,2],原型里的所有方法都被clone到a上。

2、this是该类的实例指针(该指针为"动态联编")。如何理解js this的动态联编,请参考我写的这篇文章:http://blog.never-online.net/article.asp?id=117
当创建该类实例时,实例具有预先定义的所有以this.p类似的成员。也具有prototype原型里定义的成员,如果类内部定义与prototype里的一个定义相同,则不是重写:

看这个例子,jsclass定义的this.func,还有prototype里定义的func,如果jsclass内部有成员与原型里的相同,实例化时优先权为this.func,但注意,原型里并不是重写func,而是jsclass实例共有的,虽然其优先权没有this.func高,与此同时,我们也可以以这种方式来理解prototype与类内部定义成员:

<script>
function jsclass() {
  this.p = "never-online";
  this.func = function () {
    alert('func');
  }
}
jsclass.prototype = {
  func : function () {
  alert(this.p);
  }
}
var a = new jsclass();
a.func();
delete a.func;
a.func();
</script>

我们再把上面的代码修改一下。这样看:

<script>
function jsclass() {
  this.p = "never-online";
  this.func = function () {
    alert('func');
  }
}
jsclass.prototype = {
  func : function () {
  alert(this.p?this.p:'no value');
  }
}
var a = new jsclass();
a.func();//调用内部成员
delete a.func;//此处删除是的类内部定义的func
a.func();//调用prototype成员
delete a.func;//试图再次删除func(prototype)
a.func();//删除无效(内部的func已经被删除),依然可打印输出
</script>

注释:类内部的成员可以用delete删除,而原型里定义的,则不能用delete 实例名.成员名来删除的。
如果用prototype定义后,实例化时:用原型实例指定创建对象的种类,并且通过拷贝这些原型创建新的对象
也就是在上面的
delete a.func;//此处删除是的类内部定义的func
a.func();//调用prototype成员
之后,再次调用a.func(),调用时,通过调用prototype.func来实现的。而并非a.func(),这也解释了为什么在jsclass内部定义func与在prototype定义func时不会有重写现象。

Javascript 相关文章推荐
AlertBox 弹出层信息提示框效果实现步骤
Oct 11 Javascript
JavaScript ( (__ = !$ + $)[+$] + ({} + $)[_/_] +({} + $)[_/_] )
Feb 25 Javascript
javascript变量作用域使用中常见错误总结
Mar 26 Javascript
JQuery加载图片自适应固定大小的DIV
Sep 12 Javascript
用jquery等比例控制图片宽高的具体实现
Jan 28 Javascript
JS 打印界面的CSS居中代码适用所有浏览器
Mar 19 Javascript
js父页面与子页面不同时显示的方法
Oct 16 Javascript
BootStrap3学习笔记(一)之网格系统
May 20 Javascript
AngularJS表单详解及示例代码
Aug 17 Javascript
canvas绘制表盘时钟
Jan 23 Javascript
jquery.form.js异步提交表单详解
Apr 25 jQuery
vuex的module模块用法示例
Nov 12 Javascript
彻底搞懂JS无缝滚动代码
Jan 03 #Javascript
经典的解除许多网站无法复制文字的绝招
Dec 31 #Javascript
对象的类型:本地对象(1)
Dec 29 #Javascript
JavaScript高级程序设计
Dec 29 #Javascript
JavaScript 参考教程
Dec 29 #Javascript
js自带函数备忘 数组
Dec 29 #Javascript
slice函数的用法 之不错的应用
Dec 29 #Javascript
You might like
用PHP发电子邮件
2006/10/09 PHP
再次研究下cache_lite
2007/02/14 PHP
一个简单的网页密码登陆php代码
2012/07/17 PHP
UTF-8正则表达式如何匹配汉字
2015/08/03 PHP
php实现的双色球算法示例
2017/06/20 PHP
PDO::inTransaction讲解
2019/01/28 PHP
js控制框架刷新
2008/08/01 Javascript
jquery中的 $(&quot;#jb51&quot;)与document.getElementById(&quot;jb51&quot;) 的区别
2011/07/26 Javascript
Enter转换为Tab的小例子(兼容IE,Firefox)
2013/11/14 Javascript
jQuery实现列表内容的动态载入特效
2015/08/08 Javascript
JavaScript中字面量与函数的基本使用知识
2015/10/20 Javascript
Windows下用PyCharm和Visual Studio开始Python编程
2015/10/26 Javascript
javascript实现2016新年版日历
2016/01/25 Javascript
jQuery实现横向带缓冲的水平运动效果(附demo源码下载)
2016/01/29 Javascript
jquery ajax局部加载方法详解(实现代码)
2016/05/12 Javascript
angular+ionic 的app上拉加载更新数据实现方法
2017/01/16 Javascript
Vue实现web分页组件详解
2017/11/28 Javascript
vue绑定事件后获取绑定事件中的this方法
2018/09/15 Javascript
vue主动刷新页面及列表数据删除后的刷新实例
2018/09/16 Javascript
浅谈vue中$bus的使用和涉及到的问题
2020/07/28 Javascript
Python常见数据结构详解
2014/07/24 Python
Pycharm远程调试openstack的方法
2017/11/21 Python
python利用Opencv实现人脸识别功能
2019/04/25 Python
浅析Python与Mongodb数据库之间的操作方法
2019/07/01 Python
django url到views参数传递的实例
2019/07/19 Python
python修改FTP服务器上的文件名
2019/09/11 Python
python base64库给用户名或密码加密的流程
2020/01/02 Python
python实现模拟器爬取抖音评论数据的示例代码
2021/01/06 Python
ZINVO手表官网:男士和女士手表
2019/03/10 全球购物
电气工程及其自动化自我评价四篇
2013/09/24 职场文书
产品质量承诺书范文
2014/03/27 职场文书
就业协议书的作用
2014/04/11 职场文书
保护动物的标语
2014/06/11 职场文书
MySQL千万级数据表的优化实战记录
2021/08/04 MySQL
Ruby处理CSV数据方法详解
2022/04/18 Ruby
Spring中的@Transactional的工作原理
2022/06/05 Java/Android