练习题 - js函数
代码贴出来
1 function Cat() {
2 getColor = function(){ console.log(1);}
3 return this;
4 }
5 Cat.getColor = function(){console.log(2);}
6 Cat.prototype.getColor = function(){console.log(3);}
7 var getColor = function(){console.log(4);}
8 function getColor() {console.log(5);}
9
10 // 输出结果
11 Cat.getColor();
12 getColor();
13 Cat().getColor();
14 getColor();
15 new Cat.getColor();
16 new Cat().getColor();
17 new new Cat().getColor();
首先我们来理理这些代码的执行顺序:
先声明
1、var getColor [7]
2、function Cat(){...} [1]
3、function getColor(){...} [8]
接下来顺序执行代码
4、Cat.getColor = function(){...} [5]
5、Cat.prototype.getColor = function(){...} [6]
6、getColor = function(){console.log(4);} [7]
7、Cat.getColor(); [11]
8、getColor(); [12]
9、Cat().getColor(); [13]
10、getColor(); [14]
11、new Cat.getColor(); [15]
12、new Cat().getColor(); [16]
13、new new Cat().getColor(); [17]
所以,
Cat.getColor() //2
∵根据4,Cat.getColor被赋值了一个function,现在执行这个function则打印出2.
【涉及对象的静态方法】
getColor() //4
∵根据6,getColor被赋值了一个function,现在执行这个function则打印出4.
【涉及变量的声明和赋值】
Cat().getColor() //1
∵这个是先运行Cat(),再点上getColor的;Cat()之后是返回this,Cat没有被实例化,所以this是window,同时因为Cat()执行之后getColor被重新赋值,所以打印出1.
【涉及函数的运行、变量作用域、this】
getColor() //1
∵前面的代码把getColor改变了,所以打印了1
【涉及变量的赋值】
new Cat.getColor();//2
这个先执行Cat.getColor()
可以这么理解:
var a = Cat.getColor; // a = Cat.getColor = function(){console.log(2);}
new a(); //打印2
【涉及变量的赋值、对象的实例化】
new Cat().getColor();//3
这个先new Cat(),实例化了,实例化的getColor()是Cat.prototype.getColor = function(){console.log(3);}
可以这么理解:
var a = new Cat(); // 实例化Cat
a.getColor(); // 实例执行这个:Cat.prototype.getColor = function(){console.log(3)}
【涉及对象的实例化,实例的原型方法】
new new Cat().getColor();//3
这个先new Cat(),实例化了,实例化的getColor()是Cat.prototype.getColor = function(){console.log(3);},再new
可以这么理解:
var a = new Cat(); // 实例化Cat
var b = a.getColor; // 实例执行这个:b = Cat.prototype.getColor = function(){console.log(3)}
new b(); // 打印3
【涉及变量的赋值,对象的实例化,实例的原型方法】