1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <title></title>
6 <script type="text/javascript">
7
8 /*
9 * 10 * 创建一个Person构造函数 11 * - 在Person构造函数中，为每一个对象都添加了一个sayName方法，目前我们的方法是在构造函数内部创建的， 12 * 也就是构造函数每执行一次就会创建一个新的sayName方法，也就是所有实例的sayName都是唯一的。 13 * 这样就导致了构造函数执行一次就会创建一个新的方法， 14 * 执行10000次就会创建10000个新的方法，而10000个方法都是一摸一样的 15 * 这是没有必要的，完全可以使所有的对象共享同一个方法 16 * 17 */
18
19 function PersonOne(name , age , gender){ 20 this.name = name; 21 this.age = age; 22 this.gender = gender; 23 //向对象中添加一个方法
24 this.sayName = function(){ 25 alert("Hello大家好，我是："+this.name); 26 } 27 } 28
29 //创建一个Person的实例
30 var per = new PersonOne("孙悟空",18,"男"); 31 var per2 = new PersonOne("猪八戒",28,"男"); 32 per.sayName(); 33 per2.sayName(); 34
35 //------------------------------------------------------------------------------------
36
37 //那怎么办呢？试着将sayName方法在全局作用域中定义
38
39 function PersonTwo(name , age , gender){ 40 this.name = name; 41 this.age = age; 42 this.gender = gender; 43 //向对象中添加一个方法
44 this.sayName = fun; 45 } 46
47 function fun(){ 48 alert("Hello大家好，我是:"+this.name); 49 }; 50
51 //创建一个Person的实例
52 var per = new PersonTwo("孙悟空",18,"男"); 53 var per2 = new PersonTwo("猪八戒",28,"男"); 54 per.sayName(); 55 per2.sayName(); 56
57 /*
58 * 可是将函数定义在全局作用域，污染了全局作用域的命名空间 59 * 而且定义在全局作用域中也很不安全 60 */
61
62 //------------------------------------------------------------------------------------
63
64 //那么可以怎么改呢？向原型中添加sayName方法
65
66 /** 67 * 以后我们创建构造函数时，可以将这些对象共有的属性和方法，统一添加到构造函数的原型对象中， 68 * 这样不用分别为每一个对象添加，也不会影响到全局作用域，就可以使每个对象都具有这些属性和方法了 69 */
70
71 function PersonThree(name , age , gender){ 72 this.name = name; 73 this.age = age; 74 this.gender = gender; 75 } 76 //向原型中添加sayName方法
77 PersonThree.prototype.sayName = function(){ 78 alert("Hello大家好，我是:"+this.name); 79 }; 80
81 //创建一个Person的实例
82 var per = new PersonThree("孙悟空",18,"男"); 83 var per2 = new PersonThree("猪八戒",28,"男"); 84 per.sayName(); 85 per2.sayName(); 86
87
88
89 </script>
90 </head>
91 <body>
92 </body>
93 </html>
