07.构造函数修改.html 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>Document</title>
  8. <script>
  9. /*
  10. 创建一个Person构造函数
  11. -在Person构造函数中,为每一个对象都添加了一个sayName方法,
  12. 目前我们的方法是在构造函数内部创建的,
  13. 构造函数每执行一次就会创建一个新的sayName方法
  14. 也就是说所有实例的sayName都是唯一的.
  15. 这样就导致了构造函数执行一次就会创建一个新的方法,
  16. 执行一万次就会创建一万个新的方法,而一万个方法都是一模一样的
  17. 这是完全没有必要的,完全可以使所有的对象共享同一个方法
  18. */
  19. function Person(name,age,gender){
  20. this.name = name;
  21. this.age = age;
  22. this.gender = gender;
  23. //向对象中添加一个方法
  24. this.sayName = fun;
  25. }
  26. //将sayName方法在全局作用域中定义
  27. /*
  28. 将函数定义在全局作用域,污染了全局作用域的命名空间
  29. 而且定义在全局作用域中也很不安全
  30. */
  31. function fun(){
  32. console.log('hello,大家好,我是'+this.name);
  33. }
  34. //创建一个Person的实例
  35. var per = new Person("孙悟空",28,"男");
  36. var per2 = new Person("猪八戒",38,"男");
  37. per.sayName();
  38. per2.sayName();
  39. console.log(per.sayName == per2.sayName);
  40. //创建一个Person的实例
  41. // var per = new Person("孙悟空",28,"男");
  42. // var per2 = new Person("猪八戒",38,"男");
  43. // // per2.sayName();
  44. // console.log(per.sayName == per2.sayName);
  45. </script>
  46. </head>
  47. <body>
  48. </body>
  49. </html>