怎么解释方法的覆盖关系?

Question

http://www.cnblogs.com/yjf512/archive/2011/06/03/2071914.html#!comments
我在读这篇解释原型的博客时产生了这么个问题:

代码如图:

function baseClass()
{
    this.showMsg = function()
    {
        console.log("baseClass::showMsg");   
    }
   
    this.baseShowMsg = function()
    {
        console.log("baseClass::baseShowMsg");
    }
}
baseClass.showMsg = function()
{
    console.log("baseClass::showMsg static");
}
var baseInstance = new baseClass();
baseInstance.showMsg();    //输出baseClass::showMsg
baseClass.showMsg.call(baseClass);    //输出baseClass::showMsg static

在这里我通过call的方法来将新定义的showMsg()方法显示了出来,不过就不懂为什么产生了这种感觉会覆盖却不会覆盖的这种关系(本来想着应该都是有static的).这个和原型prototype能扯上关系吗?

想了一下确实和方法覆盖没有半毛钱关系了,因为这个例子只是凑巧名字一样,关键是类方法是一个静态方法,了解静态方法的概念就能懂了233

Answer 1

function baseClass()
{
    this.showMsg = function()//[A]
    {
        console.log("baseClass::showMsg");   
    }
   
    this.baseShowMsg = function()//[B]
    {
        console.log("baseClass::baseShowMsg");
    }
}
baseClass.showMsg = function()//[C]
{
    console.log("baseClass::showMsg static");
}
var baseInstance = new baseClass();//D
baseInstance.showMsg();//[E] //输出baseClass::showMsg 
baseClass.showMsg.call(baseClass); //[F]   //输出baseClass::showMsg static

这里不存在覆盖的问题

1.函数也是对象
2.baseClass作为普通函数调用时，A处this为函数调用的上下文，可以通过函数对象的call/apply方法指定，或者不指定此时的this就是全局对象
3.baseClass通过new操作符调用时，baseClass作为一个构造函数使用，此时A处的this为通过new操作符生成的对象实例，也就是[D]中声明的baseInstance变量指向的对象
4.[E]处调用的showMsg为[A]处声明的函数对象
5.[F]baseClass.showMsg属性指向的[C]处创建的函数对象，其实在这里使不使用call方法都不影响其输出结果。

baseClass.showMsg();//输出baseClass::showMsg static

继续:

baseClass();//全局对象上将有showMsg函数和baseShowMsg
showMsg();//输出baseClass::showMsg 

接上面代码:

var myObject={
    showMsg:function()//[A]
    {
        console.log("myObject::showMsg");   
    }
}
myObject.showMsg();//输出myObject::showMsg 
baseClass.call(myObject);//全局对象上将有showMsg函数和baseShowMsg
showMsg();//输出baseClass::showMsg 
myObject.showMsg();//baseClass::showMsg 

Answer 2

我是这么理解的，把baseClass看成一个对象，
baseClass.showMsg只是这个对象的一个属性。

Object.getOwnPropertyNames(baseClass);
// ["length", "name", "arguments", "caller", "prototype", "showMsg"]

函数体存放在baseClass.[[ECMAScriptCode]]中，
参考ECMAScript Function Objects

在使用 new 创建实例对象时，如果函数体内 return 的不是对象，则返回this。
而这个实例对象的原型链是构造函数的prototype属性，和函数本身无关。
所以如果要覆盖的话，需要写成baseClass.prototype.showMsg

Answer 3

自己写了这么多,还是给一下刚才索引的几个链接好了~

JS的一个静态方法
JavaScript类方法，对象方法(this)，原型方法(prototype)

var BaseClass = function() {}; // var BaseClass=new Function();  
BaseClass.f1 = function(){//定义静态方法  
     alert(' This is a static method ');  
}  
BaseClass.f1();//This is a static method  
var instance1 = new BaseClass();  
instance1.f1();//instance1.f1 is not a function 

这段代码解释了第一个showMsg()为什么不会出现static

一楼的回答中我也尝试了一下,不过那个原型覆盖自己测试不出来0. 0,查了好多,基本上也都是使用了apply和call来解决这个问题.[收下Object.getOwnProperty(clazssName))这个使用方法了嘿嘿:P]

再加上一个实例解释吧:

var BaseClass = function() {
    this.f1 = function(){
        console.log(' This is a object function.');
    }
}; // var BaseClass=new Function();  
BaseClass.f2 = function(){//定义静态方法  
 console.log(' This is a static method ');  
}  
BaseClass.f2();//This is a static method  

var instance1 = new BaseClass();  
instance1.f1();

try{
    instance1.f2();//instance1.f2 is not a function  
}catch(err){
    console.log('---Error:---\n' + err + '\n----');
}

console.log(Object.getOwnPropertyNames(instance1));    //f1

也不是很清楚自己写的对不对,希望能得到其他解答..

待会儿写一篇博客放上去..>_<

Answer 4

不是很清楚 就是覆盖 对象覆盖