javascript 实现步骤图_一分钟打通JavaScript的继承

导读：

在ES6 之前js中是并没有extends继承，就像是java的单继承继承，我们通过多实现的方法模拟java的多继承，所以我们也可以同通过，利用构造函数和原型对象实现来实现JavaScript的继承机制。

---

1.1 借用构造函数继承父类属性

逻辑：在子类中利用call()方法将父类中的this指向子类的this，用来实现子类继承父类的属性

      // Father 父构造函数      function Father(uname,age){         this.uname = uname;        this.age = age;      }       // Son 子构造函数      function Son(uname,age,score){        //子类继承父类的属性        Father.call(this,uname,age);        //子类自己特有的属性        this.score = score;      }      var son = new Son('慕阳源码',20,100);      console.log(son);

• 控制台输出结果

图1-1 控制台输出结果

说明：从以上案例可以看出，子类创建的对象拥有了父类的属性，说明继承效果实现了

---

1-2 利用原型对象继承父类的方法

如果要实现子类继承父类的方法，可以将父类的实例对象作为子类的原型对象来使用，然后将这个

新的原型对象的属性指向父类

• 控制台输出结果

图1-2 控制台输出结果

说明：从以上案例可以看出，子类创建的对象调用了父类的方法

---

1-3 切记不可直接将父类的原型对象直接赋值给子类原型对象

• 控制台输出结果

图1-3 控制台输出结果

说明：此时父类中也有了子类自己定义的方法,这不是真正的继承

---

总结：

• 子类继承父类的属性使用call()方法
• 子类继承父类的方法步骤 :
  • 将父类的实例对象作为子类的原型对象
  • 将原型对象的constructor属性指向子类

---

来关注一起学技术和找女朋友的公众号 慕阳源码

明天讲解 JavaScript的String 常用类。

本周讲解JavaScript的面试难点

明天更新JavaScript的String 类中的方法，加油~。