javascript之prototype
来源:互联网 发布:海贼王启航礼包淘宝 编辑:程序博客网 时间:2024/06/01 12:41
先看下W3C给出的解释:
有能力向对象添加属性和方法。
javascript的三种方法:类方法,对象方法,原型方法。先看下例子:
function People(name){ this.name=name; //对象方法 this.Introduce=function(){ alert("My name is "+this.name); }}//类方法People.Run=function(){ alert("I can run");}//原型方法People.prototype.IntroduceChinese=function(){ alert("我的名字是"+this.name);}
prototype是什么含义?
javascript中的每个对象都有prototype属性,Javascript中对象的prototype属性的解释是:返回对象类型原型的引用。
A.prototype = new B();
理解prototype不应把它和继承混淆。A的prototype为B的一个实例,可以理解A将B中的方法和属性全部克隆了一遍。A能使用B的方法和属性。这里强调的是克隆而不是继承。举例说明:
function baseClass(){ this.showMsg = function() { alert("baseClass::showMsg"); }}function extendClass(){}extendClass.prototype = new baseClass();var instance = new extendClass();instance.showMsg(); // 显示baseClass::showMsg
我们首先定义了baseClass类,然后我们要定义extentClass,但是我们打算以baseClass的一个实例为原型,来克隆的extendClass也同时包含showMsg这个对象方法。
extendClass.prototype = new baseClass()就可以阅读为:extendClass是以baseClass的一个实例为原型克隆创建的。
那么就会有一个问题,如果extendClass中本身包含有一个与baseClass的方法同名的方法会怎么样?
下面是扩展实验2:
function baseClass(){ this.showMsg = function() { alert("baseClass::showMsg"); }}function extendClass(){ this.showMsg =function () { alert("extendClass::showMsg"); }}extendClass.prototype = new baseClass();var instance = new extendClass();instance.showMsg();//显示extendClass::showMsg
实验证明:函数运行时会先去本体的函数中去找,如果找到则运行,找不到则去prototype中寻找函数。或者可以理解为prototype不会克隆同名函数。
那么又会有一个新的问题:
如果我想使用extendClass的一个实例instance调用baseClass的对象方法showMsg怎么办?
答案是可以使用call:
extendClass.prototype = new baseClass();var instance = new extendClass();var baseinstance = new baseClass();baseinstance.showMsg.call(instance);//显示baseClass::showMsg
这里的baseinstance.showMsg.call(instance);阅读为“将instance当做baseinstance来调用,调用它的对象方法showMsg”
好了,这里可能有人会问,为什么不用baseClass.showMsg.call(instance);
这就是对象方法和类方法的区别,我们想调用的是baseClass的对象方法
- Javascript之prototype
- Javascript 之prototype属性
- javascript 之 prototype
- javascript之prototype
- javascript之prototype详解
- JavaScript加强之Prototype
- javascript之prototype
- Javascript 之 Prototype
- javascript必知必会之prototype
- javascript必知必会之prototype
- JavaScript之prototype
- javascript必知必会之prototype
- javascript必知必会之prototype
- javascript 之prototype详解
- javascript必知必会之prototype
- javascript之prototype
- javascript之Prototype
- javascript 之prototype
- 设计练习:汽车经销商互动平台的页面界面设计
- 安卓开发网址导航(持续添加)
- "ora-01502 索引或这类索引的分区处于不可用状态"的解决方案
- Anaconda 4.2 ---conda使用(Windows)
- 条件随机场及其应用
- javascript之prototype
- 教您使用java爬虫gecco抓取JD全部商品信息(一)
- 【Leetcode】118. Pascal's Triangle
- css样式的使用一
- 【腾讯优测干货分享】如何降低App的待机内存(五)——优化dex相关内存及本章总结
- PAT BASIC LEVEL 1008. 数组元素循环右移问题 (20)
- python调用window dll和linux so例子
- Miktex 2.9 + Texmaker 中文显示
- ERROR: Exception when publishing, exception message [Failure] Build step 'Send files or execute comm