Question

JS 类方法调用

在以下JS代码中调用对象方法、类方法和原型方法，浏览器先弹框出现"People"，然后再弹框出现"Windking undefined Windking"。出现"undefined"可以理解，但是第一次弹框出现"People" 是怎么回事？请诸位指教。
JS代码如下：
<script>
function People(name){
this.name = name;
//对象方法
this.getName1 = function(){
return this.name;
}
}
//类方法
People.getName2 = function(){
alert(this.name);
}
//原型方法
People.prototype.getName3 = function(){
return this.name;
}
var p = new People("Windking");
window.alert(p.getName1()+"\n" + People.getName2() + "\n" + p.getName3());
</script>





Answer 1

window.alert(p.getName1()+"\n" + People.getName2() + "\n" + p.getName3());

这里先执行括号里所有的内容,再执行最外层的window.alert,

所以读到 People.getName2()  时,函数内的alert就先弹出来了,

因为getName2只有一个alert方法,this.name是Object自带的方法,会返回当前对象的全名,

所以弹出显示People,

构造函数People里虽然有this.name,但是构造函数没实例化是无法调用内部的属性,

所以People.getName2() 返回的是undefined,

追问

谢谢你的回答，我想知道为什么第一次执行 People.getName2() 会弹出 People，这个People是函数名，为什么People.getName2()的 this.name 会返回函数名：People？另外，为什么第一次执行 People.getName2() 会返回 People，第二次执行 People.getName2() 返回undefined呢？

追答

比如:
function fun(){};
fun.name;//=>fun
name属性从Function继承而来的,所有函数对象都可调用,如果把name换成age或其他的就只有undefined了
People.getName2() 这个方法里没有return,所以得到的是undefined

Answer 2

分析this所在的函数是当做哪个对象的方法调用的，则该对象就是this所引用的对象。方法1首先赋值了，然后再调用，所以会弹出

追问

可是，我在方法People(name)中给name赋的值是Windking而非People。而且，既然第一次弹框People.getName2(）弹出了 People，为什么第二次弹框是undefined？

追答

首先，第一次弹框是初始化的时候弹出来的，就是在初始化类方法People.getName2的时候弹得，我测试的时候是undefined，然后后边三个的时候跟你的是一样的。

原型方法：一般用于对象实例共享，在原型上面添加该方法，就能实现共享。这样就不用每一次初始化一个实例的时候，为其分配相应的内存了。
对象方法需要通过实例化对象去调用
类方法不需要通过实例化对象去调用
原型方法也需要通过实例化对象去调用

追问

你用的IE或者IE内核的浏览器吧，我用的Chrome浏览器。不过我发现用IE浏览器会得到和你一样的结果，但是用Chrome浏览器会得到我图片上的结果。谢谢你的解答。