关于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 相关文章推荐
用prototype实现的简单小巧的多级联动菜单
Mar 24 Javascript
js 鼠标拖动对象 可让任何div实现拖动效果
Nov 09 Javascript
理解JSON:3分钟课程
Oct 28 Javascript
用JavaScript获取DOM元素位置和尺寸大小的方法
Apr 12 Javascript
jQuery阻止同类型事件小结
Apr 19 Javascript
如何用jquery控制表格奇偶行及活动行颜色
Apr 20 Javascript
js清空form表单中的内容示例
May 20 Javascript
JavaScript数组去重的两种方法推荐
Apr 05 Javascript
Bootstrap警告(Alerts)的实现方法
Mar 22 Javascript
php main 与 iframe 相互通讯类(js+php同域/跨域)
Sep 14 Javascript
详解如何使用微信小程序云函数发送短信验证码
Mar 13 Javascript
详解Vue 换肤方案验证
Aug 28 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 syntax error, unexpected $end 错误的一种原因及解决
2008/10/25 PHP
PHP使用get_headers函数判断远程文件是否存在的方法
2014/11/28 PHP
PHP图片加水印实现方法
2016/05/06 PHP
Laravel获取当前请求的控制器和方法以及中间件的例子
2019/10/11 PHP
Javascript 各浏览器的 Javascript 效率对比
2008/01/23 Javascript
js活用事件触发对象动作
2008/08/10 Javascript
javascript 限制输入和粘贴(IE,firefox测试通过)
2008/11/14 Javascript
JavaScript 事件的一些重要说明
2009/10/25 Javascript
javascript开发随笔二 动态加载js和文件
2011/11/25 Javascript
JS验证控制输入中英文字节长度(input、textarea等)具体实例
2013/06/21 Javascript
几种经典排序算法的JS实现方法
2016/03/25 Javascript
RequireJS多页面应用实例分析
2016/06/29 Javascript
HTML Table 空白单元格补全的简单实现
2016/10/13 Javascript
jQuery实现两个select控件的互移操作
2016/12/22 Javascript
零基础轻松学JavaScript闭包
2016/12/30 Javascript
[00:23]魔方之谜解锁款式
2018/12/20 DOTA
Python使用multiprocessing创建进程的方法
2015/06/04 Python
Python+Socket实现基于TCP协议的客户与服务端中文自动回复聊天功能示例
2017/08/31 Python
Python 多进程并发操作中进程池Pool的实例
2017/11/01 Python
Python从函数参数类型引出元组实例分析
2019/05/28 Python
PyTorch: 梯度下降及反向传播的实例详解
2019/08/20 Python
python安装gdal的两种方法
2019/10/29 Python
python_array[0][0]与array[0,0]的区别详解
2020/02/18 Python
Python中使用socks5设置全局代理的方法示例
2020/04/15 Python
使用keras实现Precise, Recall, F1-socre方式
2020/06/15 Python
python 线程的五个状态
2020/09/22 Python
python用tkinter实现一个简易能进行随机点名的界面
2020/09/27 Python
纯DOM+CSS3实现简单的小风车动画
2016/09/27 HTML / CSS
英国最大的汽车交易网站:Auto Trader UK
2016/09/23 全球购物
室内设计自我鉴定
2013/10/15 职场文书
最新的互联网创业计划书
2014/01/10 职场文书
索桥的故事教学反思
2014/02/06 职场文书
学校运动会广播稿
2014/10/11 职场文书
大学组织委员竞选稿
2015/11/21 职场文书
Python requests用法和django后台处理详解
2022/03/19 Python
什么是css原子化,有什么用?
2022/04/24 HTML / CSS