JavaScript 中继承机制怎么使用实例继承-js教程-PHP中文网

javascript 中实现实例继承的核心做法是使用 object.create() 方法创建一个以父类原型为原型的对象，并通过 call() 或 apply() 在子类构造函数内部调用父类构造函数，从而将父类的实例属性绑定到当前实例上。这样做可以让子类实例同时拥有父类的实例属性和自己的实例属性，且每个实例都拥有独立的属性副本。

JavaScript 中继承机制怎么使用实例继承

如何正确组合使用 Object.create 和 call 实现继承

要实现标准的实例继承，需要分两步走：第一步通过 Object.create(Parent.prototype) 建立原型链连接，第二步在子类函数体内执行 Parent.call(this, ...args) 完成实例属性的初始化。这种模式确保了子类实例可以访问父类原型上的方法，同时拥有独立的实例数据。

JavaScript 中继承机制怎么使用实例继承

function Parent(name) {
  this.name = name;
}

Parent.prototype.sayName = function() {
  console.log('My name is ' + this.name);
};

function Child(name, age) {
  // 1. 继承实例属性
  Parent.call(this, name);
  // 2. 添加子类特有实例属性
  this.age = age;
}

// 3. 继承原型方法
Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;

Child.prototype.sayAge = function() {
  console.log('I am ' + this.age + ' years old');
};

const child = new Child('Alice', 10);
child.sayName(); // My name is Alice
child.sayAge();  // I am 10 years old

运行上述代码，控制台会依次输出 "My name is Alice" 和 "I am 10 years old"。这验证了 child 实例既继承了 Parent 的 name 属性和 sayName 方法，又拥有了自己的 age 属性和 sayAge 方法。

实例继承与原型链继承在内存占用上有何区别

实例继承（如上述组合模式）会为每个子类实例创建一份父类实例属性的副本，而纯原型链继承则共享这些属性。这意味着实例继承在内存占用上略高，但避免了引用类型属性（如数组或对象）被所有实例共享导致的修改冲突问题。

javascript-typescript-typescript-scaffold

你是 TypeScript 项目架构专家，专注于脚手架搭建生产就绪的 Node.js 和前端应用。生成包含现代工具链（pnpm、Vite、Next.js）、类型

下载

JavaScript 中继承机制怎么使用实例继承

// 对比：纯原型链继承的问题
function Parent() {
  this.colors = ['red', 'blue'];
}

function Child() {}
Child.prototype = new Parent(); // 原型链继承

const c1 = new Child();
const c2 = new Child();
c1.colors.push('green');
console.log(c2.colors); // ['red', 'blue', 'green'] - 污染了c2

// 修正：使用实例继承
function ChildFixed() {
  Parent.call(this); // 每个实例独立拥有colors数组
}
ChildFixed.prototype = Object.create(Parent.prototype);

const c3 = new ChildFixed();
const c4 = new ChildFixed();
c3.colors.push('green');
console.log(c4.colors); // ['red', 'blue'] - 互不影响

通过对比可以看出，当父类包含引用类型属性时，纯原型链继承会导致所有实例共享该属性，修改一个实例会影响其他实例。而使用 Parent.call(this) 的实例继承方式，每个子类实例都会获得自己独立的 colors 数组副本，从而保证了数据的隔离性。

如果父类构造函数需要参数，子类该如何传递这些参数

当父类构造函数需要接收参数时，子类必须在调用 Parent.call(this) 时将相应的参数显式传递过去。通常子类的构造函数也会接收这些参数，并在内部转发给父类构造函数，以确保父类能正确初始化其所需的实例属性。

function Parent(name, hobby) {
  this.name = name;
  this.hobby = hobby;
}

Parent.prototype.introduce = function() {
  console.log(`Hi, I'm ${this.name}, I like ${this.hobby}`);
};

function Child(name, hobby, grade) {
  // 必须将 name 和 hobby 传递给 Parent
  Parent.call(this, name, hobby);
  this.grade = grade;
}

Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;

Child.prototype.showGrade = function() {
  console.log(`I'm in grade ${this.grade}`);
};

const student = new Child('Bob', 'reading', 5);
student.introduce(); // Hi, I'm Bob, I like reading
student.showGrade(); // I'm in grade 5

在上述代码中，Child 构造函数接收 name、hobby 和 grade 三个参数。它通过 Parent.call(this, name, hobby) 将前两个参数传递给父类，确保 Parent 能正确设置 this.name 和 this.hobby。如果不传递这些参数，父类初始化将失败或得到默认值（如 undefined），导致后续行为异常。

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南