在继承中利用 call/apply 实现显式绑定属性-js教程-PHP中文网

javascript继承中需用call/apply显式调用父构造函数以继承实例属性，因原型链仅共享方法，无法自动获取this初始化的属性；必须在子类构造函数首行执行parent.call(this, ...args)并配合原型链继承方法。

在继承中利用 call/apply 实现显式绑定属性

在 JavaScript 继承中，用 call 或 apply 调用父构造函数，是实现“显式绑定实例属性”的常用方式。它让子类实例在创建时，直接执行父构造函数体，并把 this 指向当前子类实例，从而把父类中通过 this.xxx = xxx 定义的属性“复制”到子类实例上。

为什么不能只靠原型链继承属性？

原型链继承（如 Sub.prototype = Object.create(Super.prototype)）只能共享方法，无法继承父构造函数内部通过 this 初始化的实例属性（比如 this.name、this.age）。这些属性不会自动出现在子类实例上，必须在子类构造函数中主动调用父构造函数来初始化。

用 call/apply 显式绑定 this 并传参

在子类构造函数中，用 Super.call(this, ...args) 就能把父构造函数里的 this.xxx 赋值行为，应用到当前子类实例上。关键点：

银河易创

一款集AI对话、绘画、音乐、视频和PPT等能力于一体的一站式AIGC创作平台。

下载

call 和 apply 功能一致，区别仅在于参数传递方式：call(this, a, b) vs apply(this, [a, b])
必须在子类构造函数首行调用，确保实例属性尽早挂载
要传入子类接收到的参数，让父类逻辑能正确初始化

典型写法示例

例如：

function Animal(name, age) {
  this.name = name;
  this.age = age;
}
Animal.prototype.speak = function() {
  console.log(`${this.name} is speaking`);
};

function Dog(name, age, breed) {
  // ✅ 显式绑定：把 Animal 中的 this.name/this.age 挂到当前 Dog 实例
  Animal.call(this, name, age);
  this.breed = breed; // 子类自有属性
}
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

const dog = new Dog('Xiaohei', 3, 'Labrador');
console.log(dog.name);   // 'Xiaohei'
console.log(dog.breed);  // 'Labrador'
dog.speak();             // 'Xiaohei is speaking'