js中的prototype
第一次看过这个知识点,一个个实例走过去,觉得理解的挺透彻的,可是回头一看,这东西到底是什么啊?感觉真的还挺绕的。现在如果要讲给别人听,理解肯定要更深,那么就谈谈我的理解,不到位的地方欢迎批评指正。
首先当然得看定义不是:
【Javascript中对象的prototype属性的解释是:返回对象类型原型的引用。】
看懂没?反正我是一眼望去没多大懂。
那么就撇开这个定义,谈谈原型的思想:
【原型法的主要思想是,现在有1个类A,我想要创建一个类B,这个类是以A为原型的,并且能进行扩展。我们称B的原型为A。】
这个看过去该睡醒了吧,其实也就这层意思的样子。
好了,在彻底搞明白这个prototype之前,我们先补充下弹药
1、javascript的方法可以分为三类:
a 类方法;b 对象方法;c 原型方法
网上搜了个实例:
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); } //测试 var p1=new People("Windking"); p1.Introduce(); People.Run(); p1.IntroduceChinese();
2、obj1.func.call(obj)中的call
call的诠释:意思是将obj看成obj1,调用func方法
那么现在就开始谈prototype的含义了吧
首先映入我眼帘的是这么句话:
JavaScript 不包含传统的类继承模型,而是使用 prototype 原型模型。虽然被当做JavaScript 的缺点所提及,其实基于原型的继承模型比传统的类继承还要强大。那么当然实现 JavaScript 中的原型继承要比类继承模型要困难的多。
不管怎样,可以理解两点:不是传统的类继承,是原型模。那么原型模型又长什么样子呢?
这时自然又搜咯,又来了这么段话:
理解prototype不应把它和继承混淆。A的prototype为B的一个实例,可以理解A将B中的方法和属性全部克隆了一遍。A能使用B的方法和属性。这里强调的是克隆而不是继承。
可以出现这种情况:A的prototype是B的实例,同时B的prototype也是A的实例。
第一句话我是看懂了,克隆不是,说白了就是复制嘛,第二句前半句我明白,后半句(同时B的prototype也是A的实例)就只能呵呵了,只好再花时间请教去了(后半句当然现在也不影响我们之后的理解)
这回直接给个完整的实例,各种理解我就直接写在注释中,请详看注释哈
//声明一个baseClass对象 function baseClass() { //对象方法 this.showMsg = function() { alert("baseClass::showMsg"); } this.baseShowMsg = function() { alert("baseClass::baseShowMsg"); } } //类方法 baseClass.showMsg = function() { alert("baseClass::showMsg static"); } //声明一个extendClass对象 function extendClass() { this.showMsg =function () { alert("extendClass::showMsg"); } } extendClass.showMsg = function() { alert("extendClass::showMsg static");} //原型方法 //可以理解为extendClass是以baseClass的一个实例为原型克隆创建的 extendClass.prototype = new baseClass(); var instance = new extendClass(); instance.showMsg(); //显示extendClass::showMsg 【函数运行时会先去本体的函数中去找,如果找到则运行,找不到则去prototype中寻找函数。或者可以理解为prototype不会克隆同名函数】 instance.baseShowMsg(); //显示baseClass::baseShowMsg 【这个就执行克隆的对象方法,无异议】 instance.showMsg(); //显示extendClass::showMsg 【不解释】 baseClass.showMsg.call(instance);//显示baseClass::showMsg static 【将instance(extendClass)看成baseClass,调用baseClass的类方法showMsg,好像也可以叫做静态方法】 var baseinstance = new baseClass(); baseinstance.showMsg.call(instance);//显示baseClass::showMsg 【将instance当做baseinstance来调用,调用baseinstance的对象方法showMsg】
以上就是我现在的理解了,这时候应该大体明白些许了吧!
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。