10
0

19_继承.html 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <script>
  10. //Array Object Number
  11. // Person 他是一个构造函数
  12. // 通过 new 来实例化出一个新对象
  13. // 第一种方式:构造继承 他无法继承原型上的方法
  14. // function Person(userName,userAge){
  15. // this.userAge = userAge;
  16. // this.userName = userName;
  17. // this.sayName = function(){
  18. // console.log(this.userName);
  19. // }
  20. // }
  21. // var p1 = new Person('小明',18);
  22. // console.log(p1.userAge);
  23. // p1.sayName();
  24. // 创建一个新的构造函数 Student 去继承 Person
  25. // function Student(userName,userAge,school){
  26. // Person.call(this,userName,userAge);
  27. // this.school = school;
  28. // }
  29. // var s1 = new Student("小红",20,"黑大");
  30. // console.log(s1.userAge);
  31. // s1.sayName();
  32. // console.log(s1.school);
  33. // 方法二 原型继承 他无法实现属性的继承
  34. // function Person(userName,userAge){
  35. // this.userAge = userAge;
  36. // this.userName = userName;
  37. // // this.sayName = function(){
  38. // // console.log(this.userName);
  39. // // }
  40. // }
  41. // Person.prototype.sayName = function(){
  42. // console.log("你好");
  43. // }
  44. // var p1 = new Person("小李","22","黑大");
  45. // p1.sayName();
  46. // function Student(userName,userAge,school){
  47. // // Person.call(this,userName,userAge);
  48. // this.school = school;
  49. // }
  50. // Student.prototype = new Person();
  51. // var s1 = new Student("小红",20,"黑大");
  52. // s1.sayName();
  53. // console.log(s1.userName);
  54. // console.log(s1.school);
  55. // 方法三:组合继承
  56. function Person(userName,userAge){
  57. this.userAge = userAge;
  58. this.userName = userName;
  59. }
  60. Person.prototype.showName = function(){
  61. console.log(this.userName);
  62. }
  63. function Student(userName,userAge,school){
  64. Person.call(this,userName,userAge);
  65. this.school = school;
  66. }
  67. Student.prototype = new Person();
  68. Student.prototype.constructor = Student;
  69. var s1 = new Student("小明",18,"黑大");
  70. console.log(s1.userAge);
  71. s1.showName();
  72. console.log(s1.constructor);
  73. </script>
  74. </body>
  75. </html>