关于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 相关文章推荐
dojo学习第一天 Tab选项卡 实现
Aug 28 Javascript
jquery打开直接跳到网页最下面、最低端实现代码
Apr 22 Javascript
js中的异常处理try...catch使用介绍
Sep 21 Javascript
js+html5绘制图片到canvas的方法
Jun 05 Javascript
JS制作手机端自适应缩放显示
Jun 11 Javascript
jquery实现隐藏在左侧的弹性弹出菜单效果
Sep 18 Javascript
JS实现的新浪微博大厅文字内容滚动效果代码
Nov 05 Javascript
AngularJs 动态加载模块和依赖
Sep 15 Javascript
JSON在Javascript中的使用(eval和JSON.parse的区别)详细解析
Sep 05 Javascript
React Native预设占位placeholder的使用
Sep 28 Javascript
微信小程序获取手机系统信息的方法【附源码下载】
Dec 07 Javascript
JS基于for语句编写的九九乘法表示例
Jan 04 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
Mysql中limit的用法方法详解与注意事项
2008/04/19 PHP
php url地址栏传中文乱码解决方法集合
2010/06/25 PHP
基于php权限分配的实现代码
2013/04/28 PHP
php版微信公众平台接口开发之智能回复开发教程
2016/09/22 PHP
yii插入数据库防并发的简单代码
2017/05/27 PHP
php压缩文件夹最新版
2018/07/18 PHP
很全的显示阴历(农历)日期的js代码
2009/01/01 Javascript
javascript 正则替换 replace(regExp, function)用法
2010/05/22 Javascript
javascript 45种缓动效果 非常酷
2011/06/28 Javascript
jQuery提交多个表单的小例子
2013/06/30 Javascript
Javascript优化技巧之短路表达式详细介绍
2015/03/27 Javascript
jQuery实现的简单折叠菜单(折叠面板)效果代码
2015/09/16 Javascript
jQuery的中 is(':visible') 解析及用法(必看)
2017/02/12 Javascript
html5+canvas实现支持触屏的签名插件教程
2017/05/08 Javascript
angular中实现li或者某个元素点击变色的两种方法
2017/07/27 Javascript
Angular4实现图片上传预览路径不安全的问题解决
2017/12/25 Javascript
Vue使用高德地图搭建实时公交应用功能(地图 + 附近站点+线路详情 + 输入提示+换乘详情)
2018/05/16 Javascript
基于iview-admin实现动态路由的示例代码
2019/10/02 Javascript
小程序如何自主实现拦截器的示例代码
2019/11/04 Javascript
如何在vue-cli中使用css-loader实现css module
2021/01/07 Vue.js
Python生成随机密码
2015/03/10 Python
python实现决策树ID3算法的示例代码
2018/05/30 Python
Python定义二叉树及4种遍历方法实例详解
2018/07/05 Python
Python面向对象程序设计类的封装与继承用法示例
2019/04/12 Python
java中的控制结构(if,循环)详解
2019/06/26 Python
python 使用递归实现打印一个数字的每一位示例
2020/02/27 Python
Python爬虫爬取有道实现翻译功能
2020/11/27 Python
C语言基础笔试题
2013/04/27 面试题
西部世纪.net笔试题面试题
2014/04/03 面试题
网站设计师的岗位职责
2013/11/21 职场文书
董事长秘书职责
2014/01/31 职场文书
班级学习计划书
2014/04/27 职场文书
副护士长竞聘演讲稿
2014/04/30 职场文书
道德演讲稿
2014/05/21 职场文书
员工薪酬激励方案
2014/06/13 职场文书
2014年行政后勤工作总结
2014/12/06 职场文书