关于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 相关文章推荐
使用jQuery轻松实现Ajax的实例代码
Aug 16 Javascript
jQuery Ajax使用 全解析
Dec 15 Javascript
jQuery LigerUI 插件介绍及使用之ligerDrag和ligerResizable示例代码打包
Apr 06 Javascript
利用javascript实现web页面中指定区域打印
Oct 30 Javascript
jquery 取子节点及当前节点属性值的方法
Aug 24 Javascript
jQuery通过扩展实现抖动效果的方法
Mar 11 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
Sep 16 Javascript
js表单提交和submit提交的区别实例分析
Dec 10 Javascript
基于AngularJS+HTML+Groovy实现登录功能
Feb 17 Javascript
JS排序算法之冒泡排序,选择排序与插入排序实例分析
Dec 13 Javascript
vue项目搭建以及全家桶的使用详细教程(小结)
Dec 19 Javascript
详解javascript中var与ES6规范中let、const区别与用法
Jan 11 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函数utf8转gb2312编码
2006/12/21 PHP
php 归并排序 数组交集
2011/05/10 PHP
PHP程序开发范例学习之表单 获取文本框的值
2011/08/08 PHP
PHP服务器页面间跳转实现方法
2012/08/02 PHP
php页码形式分页函数支持静态化地址及ajax分页
2014/03/28 PHP
php使用PDO操作MySQL数据库实例
2014/12/30 PHP
利用php_imagick实现复古效果的方法
2016/10/18 PHP
简单解决微信文章图片防盗链问题
2016/12/17 PHP
PHP count()函数讲解
2019/02/03 PHP
JavaScript 判断浏览器是否支持SVG的代码
2013/03/21 Javascript
Javascript前端UI框架Kit使用指南之kitjs的对话框组件
2014/11/28 Javascript
AngularJS入门教程之AngularJS指令
2016/04/18 Javascript
JS判断字符串变量是否含有某个字串的实现方法
2016/06/03 Javascript
localStorage实现便签小程序
2016/11/28 Javascript
JQuery学习总结【一】
2016/12/01 Javascript
Bootstrap modal 多弹窗之叠加引起的滚动条遮罩阴影问题
2017/02/27 Javascript
JS实现闭包中的沙箱模式示例
2017/09/07 Javascript
javascript回调函数详解
2018/02/06 Javascript
js统计页面上每个标签的数量实例代码
2018/05/29 Javascript
微信小程序文章详情页面实现代码
2018/09/10 Javascript
Vue源码探究之虚拟节点的实现
2019/04/17 Javascript
javascript面向对象三大特征之继承实例详解
2019/07/24 Javascript
解决layer.confirm快速点击会重复触发事件的问题
2019/09/23 Javascript
[01:00]DOTA2 store: Collection of Artisan's Wonders
2015/08/12 DOTA
[02:22]2018DOTA2亚洲邀请赛VG赛前采访
2018/04/03 DOTA
wxpython 学习笔记 第一天
2009/02/09 Python
Python实现的中国剩余定理算法示例
2017/08/05 Python
python爬虫_微信公众号推送信息爬取的实例
2017/10/23 Python
Python使用pickle模块实现序列化功能示例
2018/07/13 Python
Python使用enumerate获取迭代元素下标
2020/02/03 Python
python实现发送邮件
2021/03/02 Python
如何给HTML标签中的文本设置修饰线
2019/11/18 HTML / CSS
SCHIESSER荷兰官方网站:德国内衣专家
2020/10/09 全球购物
DataReader和DataSet的异同
2014/12/31 面试题
学生会主席竞聘书
2014/03/31 职场文书
2015年教师党员自我评价材料
2015/03/04 职场文书