关于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 相关文章推荐
如何判断图片地址是否失效
Feb 02 Javascript
js tab 选项卡
Apr 26 Javascript
jquery ajax学习笔记2 使用XMLHttpRequest对象的responseXML
Oct 16 Javascript
js实现图片放大缩小功能后进行复杂排序的方法
Nov 08 Javascript
jquery 卷帘效果实现代码(不同方向)
Feb 05 Javascript
原生Js页面滚动延迟加载图片实现原理及过程
Jun 24 Javascript
Ajax清除浏览器js、css、图片缓存的方法
Aug 06 Javascript
JS排序方法(sort,bubble,select,insert)代码汇总
Jan 30 Javascript
bootstrap 模态框(modal)实现水平垂直居中显示
Jan 23 Javascript
JavaScript 点击触发复制功能实例详解
Nov 02 Javascript
vue实现父子组件之间的通信以及兄弟组件的通信功能示例
Jan 29 Javascript
微信小程序移动拖拽视图-movable-view实例详解
Aug 17 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文件怎么打开 如何执行php文件
2011/12/21 PHP
微博短链接算法php版本实现代码
2012/09/15 PHP
深入PHP与浏览器缓存的分析
2013/06/03 PHP
PHP设计模式之模板模式定义与用法详解
2018/12/20 PHP
PHP配置ZendOpcache插件加速
2019/02/14 PHP
Javascript的匿名函数小结
2009/12/31 Javascript
JS实现星星评分功能实例代码(两种方法)
2016/06/09 Javascript
完美实现js选项卡切换效果(一)
2017/03/08 Javascript
详解JS中的柯里化(currying)
2017/08/17 Javascript
利用babel将es6语法转es5的简单示例
2017/12/01 Javascript
Node.js引入UIBootstrap的方法示例
2018/05/11 Javascript
vue 路由嵌套高亮问题的解决方法
2018/05/17 Javascript
js滚轮事件 js自定义滚动条的实现
2020/01/18 Javascript
js实现点赞按钮功能的实例代码
2020/03/06 Javascript
JS实现网页烟花动画效果
2020/03/10 Javascript
解决vue.js中settimeout遇到的问题(时间参数短效果不稳定)
2020/07/21 Javascript
python九九乘法表的实例
2017/09/26 Python
使用Py2Exe for Python3创建自己的exe程序示例
2018/10/31 Python
解决django前后端分离csrf验证的问题
2019/02/03 Python
python微信聊天机器人改进版(定时或触发抓取天气预报、励志语录等,向好友推送)
2019/04/25 Python
python爬虫增加访问量的方法
2019/08/22 Python
浅析Python __name__ 是什么
2020/07/07 Python
Python如何读写二进制数组数据
2020/08/01 Python
python如何写个俄罗斯方块
2020/11/06 Python
ASP.NET中的身份验证有那些
2012/07/13 面试题
水产养殖学应届生求职信
2013/09/29 职场文书
优秀学生自我鉴定范例
2013/12/18 职场文书
机电专业个人求职信范文
2013/12/30 职场文书
导师工作推荐信范文
2014/05/17 职场文书
私用公车造成事故检讨书
2014/11/16 职场文书
经理助理岗位职责
2015/02/02 职场文书
2015小学师德工作总结
2015/07/21 职场文书
2019年浪漫婚礼证婚词
2019/06/27 职场文书
详解TypeScript中的类型保护
2021/04/29 Javascript
Python办公自动化之教你如何用Python将任意文件转为PDF格式
2021/06/28 Python
jdbc中自带MySQL 连接池实践示例
2022/07/23 MySQL