首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

js原型链与继承

在JavaScript中,每个对象都有一个内部属性[[Prototype]],它指向另一个对象,即该对象的原型。当试图访问一个对象的属性时,如果该对象自身没有这个属性,那么JavaScript就会在这个对象的原型上查找这个属性,如果还没有,就会继续查找原型的原型,直到找到这个属性或者到达原型链的末端(即null),这就是原型链。

基础概念

  1. 构造函数:用于创建和初始化对象的函数。通常首字母大写来区分普通函数。
  2. 原型对象:每个函数都有一个prototype属性,这个属性指向一个对象,这个对象就是原型对象。
  3. 实例:通过构造函数创建的对象。
  4. [[Prototype]]:实例对象内部的一个属性,指向其构造函数的原型对象。

继承

JavaScript中的继承主要是通过原型链来实现的。子类的原型可以指向父类的一个实例,这样子类就可以继承父类的属性和方法。

优势

  • 代码复用:子类可以复用父类的代码。
  • 扩展性:可以很容易地扩展已有的类。

类型

  1. 构造函数继承:通过调用父类的构造函数来继承属性。
  2. 原型链继承:子类的原型指向父类的实例。
  3. 组合继承:结合构造函数继承和原型链继承。
  4. ES6类继承:使用class和extends关键字实现继承。

应用场景

  • 当你想创建一个新类,但它与另一个类有很多相似之处时,可以使用继承。
  • 当你想复用现有类的代码时。

问题与解决方案

问题:原型链继承中,所有子类实例共享父类原型上的引用类型属性。

原因:因为子类的原型指向父类的一个实例,所以所有子类实例都会共享这个实例上的引用类型属性。

解决方案:使用组合继承或者ES6类继承,在子类构造函数中调用父类构造函数来继承属性,同时使用原型链来继承方法。

示例代码(ES6类继承):

代码语言:txt
复制
class Parent {
  constructor(name) {
    this.name = name;
  }

  sayName() {
    console.log(this.name);
  }
}

class Child extends Parent {
  constructor(name, age) {
    super(name); // 调用父类构造函数
    this.age = age;
  }

  sayAge() {
    console.log(this.age);
  }
}

const child = new Child('Tom', 10);
child.sayName(); // 输出 "Tom"
child.sayAge(); // 输出 10

在这个例子中,Child类通过extends关键字继承了Parent类。Child类的实例可以访问Parent类的属性和方法,同时还可以有自己的属性和方法。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券