JS constructor属性

http://liuguofeng.iteye.com/blog/1287810

constructor属性始终指向创建当前对象的构造函数。比如下面例子：

Java代码  

1. var arr = [1, 56, 34, 12]; // 等价于 var foo = new Array(1, 56, 34, 12);  
2. document.writeln(arr.constructor === Array);// true  

var arr = [1, 56, 34, 12]; // 等价于 var foo = new Array(1, 56, 34, 12);document.writeln(arr.constructor === Array);// true

 

在看下面的例子

Js代码  

1. var foo = new Function();  
2. var Foo = function() { };  
3. document.writeln(Foo.constructor === Function); // true  
4.   
5. // 由构造函数实例化一个obj对象  
6. var obj = new Foo();  
7. document.writeln(obj.constructor === Foo); // true  
8.   
9. // 将上面两段代码合起来，就得到下面的结论    
10. document.writeln(obj.constructor.constructor === Function); // true  

var foo = new Function();var Foo = function() { };document.writeln(Foo.constructor === Function); // true// 由构造函数实例化一个obj对象var obj = new Foo();document.writeln(obj.constructor === Foo); // true// 将上面两段代码合起来，就得到下面的结论  document.writeln(obj.constructor.constructor === Function); // true

 

Js代码  

1. 但是当constructor遇到prototype时，有趣的事情就发生了。   
2. 我们知道每个函数都有一个默认的属性prototype，   
3. 而这个prototype的constructor默认指向这个函数。如下例所示：   
4. Java代码    
5. function Person(name) {     
6.     this.name = name;     
7. };     
8. Person.prototype.getName = function() {     
9.     return this.name;     
10. };     
11. var p = new Person("ZhangSan");     
12. document.writeln(p.constructor === Person);// true     
13. document.writeln(Person.prototype.constructor === Person); // true     
14. // 将上两行代码合并就得到如下结果     
15. document.writeln(p.constructor.prototype.constructor === Person); // true     
16.   
17. function Person(name) {  
18.     this.name = name;  
19. };  
20. Person.prototype.getName = function() {  
21.     return this.name;  
22. };  
23. var p = new Person("ZhangSan");  
24. document.writeln(p.constructor === Person);// true  
25. document.writeln(Person.prototype.constructor === Person); // true  
26. // 将上两行代码合并就得到如下结果  
27. document.writeln(p.constructor.prototype.constructor === Person); // true   
28.   
29. 当时当我们重新定义函数的prototype时（注意：和上例的区别，这里不是修改而是覆盖），   
30. constructor属性的行为就有点奇怪了，如下示例：   
31.   
32. Java代码    
33. function Person(name) {     
34.     this.name = name;     
35. };     
36. Person.prototype = {     
37.     getName: function() {     
38.         return this.name;     
39.     }     
40. };     
41. var p = new Person("ZhangSan");     
42. document.writeln(p.constructor === Person);  // false     
43. document.writeln(Person.prototype.constructor === Person); // false     
44. document.writeln(p.constructor.prototype.constructor === Person); // false    
45.   
46. function Person(name) {  
47.     this.name = name;  
48. };  
49. Person.prototype = {  
50.     getName: function() {  
51.         return this.name;  
52.     }  
53. };  
54. var p = new Person("ZhangSan");  
55. document.writeln(p.constructor === Person);  // false  
56. document.writeln(Person.prototype.constructor === Person); // false  
57. document.writeln(p.constructor.prototype.constructor === Person); // false  
58.   
59. 为什么呢？   
60. 原来是因为覆盖Person.prototype时，等价于进行如下代码操作：   
61.   
62. Java代码    
63. Person.prototype = new Object({     
64.     getName: function() {     
65.         return this.name;     
66.     }     
67. });    
68.   
69. Person.prototype = new Object({  
70.     getName: function() {  
71.         return this.name;  
72.     }  
73. });  
74.   
75. 而constructor属性始终指向创建自身的构造函数，   
76. 所以此时Person.prototype.constructor === Object，即是：   
77.   
78. Java代码    
79. function Person(name) {     
80.     this.name = name;     
81. };     
82. Person.prototype = {     
83.     getName: function() {     
84.         return this.name;     
85.     }     
86. };     
87. var p = new Person("ZhangSan");     
88. document.writeln(p.constructor === Object);  // true     
89. document.writeln(Person.prototype.constructor === Object); // true     
90. document.writeln(p.constructor.prototype.constructor === Object); // true     
91.   
92. function Person(name) {  
93.     this.name = name;  
94. };  
95. Person.prototype = {  
96.     getName: function() {  
97.         return this.name;  
98.     }  
99. };  
100. var p = new Person("ZhangSan");  
101. document.writeln(p.constructor === Object);  // true  
102. document.writeln(Person.prototype.constructor === Object); // true  
103. document.writeln(p.constructor.prototype.constructor === Object); // true   
104.   
105. 怎么修正这种问题呢？方法也很简单，重新覆盖Person.prototype.constructor即可：   
106.   
107. Java代码    
108. function Person(name) {     
109.     this.name = name;     
110. };     
111. Person.prototype = new Object({     
112.     getName: function() {     
113.         return this.name;     
114.     }     
115. });     
116. Person.prototype.constructor = Person;     
117.     
118. // 如此也可以     
119. /*   
120. Person.prototype = new Object({   
121.     constructor:Person,   
122.     getName: function() {   
123.         return this.name;   
124.     }   
125. });   
126. Person.prototype = {   
127.     constructor:Person,   
128.     getName: function() {   
129.         return this.name;   
130.     }   
131. };   
132. */    
133.     
134. var p = new Person("ZhangSan");     
135. document.writeln(p.constructor === Person);  // true     
136. document.writeln(Person.prototype.constructor === Person); // true     
137. document.writeln(p.constructor.prototype.constructor === Person); // true