prototype原型和原型链的一个例子

65 阅读1分钟
<script>
  // 定义一个函数
  // 人类
  function People(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
  }
  // 为人类添加一个自我介绍方法
  People.prototype.introduce = function () {};

  // 学生类
  function Student(name, age, sex, hobby) {
    this.name = name;
    this.age = age;
    this.sex = sex;
    this.hobby = hobby;
  }
  // 定义好的student继承自人类
  Student.prototype = new People();
  // 为学生类添加一个自我介绍方法
  Student.prototype.introduce = function () {};
  //   老师类
  function Teacher(name, age, sex, rank, salary) {
    this.name = name;
    this.age = age;
    this.sex = sex;
    this.rank = rank;
    this.salary = salary;
  }
  // 老师类继承自人类
  Teacher.prototype = new People();
  // 老师类添加一个自我介绍方法
  Teacher.prototype.introduce = function () {
    console.log(
      "我是" +
        this.name +
        "老师, 性别" +
        this.sex +
        ", " +
        this.age +
        "岁, 现担任" +
        this.rank +
        "一职, 工资到手" +
        this.salary +
        ", 我很幸福"
    );
  };
  // 小学生类
  var Pupil = function Pupil(name, age, sex, hobby, birthday) {
    this.name = name;
    this.age = age;
    this.sex = sex;
    this.hobby = hobby;
    this.birthday = birthday;
  };
  // 小学生类继承自学生类
  Pupil.prototype = new Student();
  //   为小学生类加一个自我介绍方法
  Pupil.prototype.introduce = function () {
    console.log(
      "您好,我叫" +
        this.name +
        this.age +
        "岁了" +
        this.sex +
        "生" +
        this.hobby +
        "是我的爱好" +
        this.birthday +
        "是我的生日"
    );
  };

  // 大学生类
  function Undergraduate(name, age, sex, hobby, major, school, loverName) {
    this.name = name;
    this.age = age;
    this.sex = sex;
    this.hobby = hobby;
    this.major = major;
    this.school = school;
    this.loverName = loverName;
  }
  // 大学生类继承自学生类
  // 大学生类的原型   构造一个对象,student
  // 这样继承以后,学生类里面有的所有属性和方法,都可以被大学生用,
  // 因为之前大学生里面没有,顺着原型链往上找
  Undergraduate.prototype = new Student();
  // 大学类里面添加一个自我介绍方法
  Undergraduate.prototype.introduce = function () {};
  // 构造函数,执行introduce()方法
  // 构造了一个pupil赋值给了xiaoming,这个pupil已经有了introduce方法,传参数就可以调用了

  var xiaoming = new Pupil("小明", "男", 5, "看《奥特曼》", " 2016年4月1日");
  xiaoming.introduce();
  // 老师也一样,调用老师的自我介绍方法
  var zhangsanqiang = new Teacher("张三强", 53, "男", "系主任", 1800);
  // 然后调用
  zhangsanqiang.introduce();
</script>