js 解决原型问题的方案：构造器和原型的组合

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title></title>
 6 
 7     <script type="text/javascript">
 8 
 9         /**
10          * 为了解决原型带来的所有问题，此时需要通过组合构造函数和原型来实现对象的创建
11          * 将属性在构造函数中定义，将方法在原型中定义
12          * 这种有效集合了两者的有点，是目前最为有效的一种方式
13          * @constructor
14          */
15         function Person(name , age , friends){
16 
17             this.name = name;
18             this.age = age;
19             this.friends = friends;
20         }
21         Person.prototype = {
22             constructor : Person,
23             //方法在原型中定义
24             say : function(){
25                 console.info(this.name + "[" + this.friends + "]");
26             }
27         }
28         //此时所有的属性都保存在自己的空间
29         var p1 = new Person("leon" , 23 , ["Ada" , "Chris"]);
30         p1.name  = "John";
31         p1.say();  //John[Ada,Chris]
32         p1.friends.push("Mike");
33         p1.say();  //John[Ada,Chris,Mike]
34         var p2 = new Person("Ada" , 33 , ["Leon"]);
35 
36         p2.say();//Ada[Leon]
37 
38 
39     </script>
40 
41 </head>
42 <body>
43 
44 </body>
45 </html>

为了让定义的方法更加符合java的写法，如下：

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title></title>
 6 
 7     <script type="text/javascript">
 8 
 9         /**
10          * 为了让定义的方式更加符合java的需求，就需要把定义方法的原型代码放置到Person这个构造函数中
11          */
12         function Person(name , age , friends){
13 
14             //属性在构造器中定义
15             this.name = name;
16             this.age = age;
17             this.friends = friends;
18             /**
19              * 不能使用重写的方式定义
20              *   Person.prototype = {
21                      constructor : Person,
22                      //方法在原型中定义
23                      say : function(){
24                           console.info(this.name + "[" + this.friends + "]");
25                      }
26                   }
27              */
28 
29             console.info(Person.prototype.say);   //undefined
30             //每次new一个对象 将再次定义该方法
31             Person.prototype.say = function(){
32                 console.info(this.name + "[" + this.friends + "]");
33             }
34             console.info(Person.prototype.say);  //function()
35             /**
36              *  解决每次创建对象将再次定义该方法的方案：
37              *  判断Person.prototype.say是否凑在，如果不存在就标识创建，
38              *  当存在之后就不再创建
39              */
40             if(!Person.prototype.say){
41                 Person.prototype.say = function(){
42                     console.info(this.name + "[" + this.friends + "]");
43                 }
44             }
45 
46 
47         }
48 
49         //此时所有的属性都保存在自己的空间
50         var p1 = new Person("leon" , 23 , ["Ada" , "Chris"]);
51         p1.name  = "John";
52         p1.say();  //John[Ada,Chris]
53         p1.friends.push("Mike");
54         p1.say();  //John[Ada,Chris,Mike]
55         var p2 = new Person("Ada" , 33 , ["Leon"]);
56 
57         p2.say();//Ada[Leon]
58 
59 
60     </script>
61 
62 </head>
63 <body>
64 
65 </body>
66 </html>

js 解决原型问题的方案 ： 构造器和原型的组合

js 解决原型问题的方案：构造器和原型的组合