当前位置：首页 > JavaScript

实现一种js原型继承

2026-04-05 03:10:35JavaScript

原型继承的基本概念

JavaScript中的原型继承是通过原型链实现的。每个对象都有一个内部属性[[Prototype]]，指向其原型对象。当访问对象的属性时，如果对象本身没有该属性，JavaScript会沿着原型链向上查找。

实现一种js原型继承

构造函数模式实现原型继承

定义一个父构造函数，通过new关键字创建实例。子构造函数通过调用父构造函数并设置子构造函数的原型为父构造函数的实例来实现继承。

实现一种js原型继承

function Parent(name) {
  this.name = name;
}
Parent.prototype.sayName = function() {
  console.log(this.name);
};

function Child(name, age) {
  Parent.call(this, name);
  this.age = age;
}
Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;

const child = new Child('Alice', 10);
child.sayName(); // 输出: Alice

`Object.create()`实现原型继承

使用Object.create()方法创建一个新对象，并将新对象的原型指向指定的对象。这种方法更简洁，适用于不需要构造函数的场景。

const parent = {
  name: 'Parent',
  sayName: function() {
    console.log(this.name);
  }
};

const child = Object.create(parent);
child.name = 'Child';
child.sayName(); // 输出: Child

ES6 `class`语法实现继承

ES6引入了class语法，通过extends关键字实现继承。这种方式更接近传统面向对象语言的语法。

class Parent {
  constructor(name) {
    this.name = name;
  }
  sayName() {
    console.log(this.name);
  }
}

class Child extends Parent {
  constructor(name, age) {
    super(name);
    this.age = age;
  }
}

const child = new Child('Bob', 12);
child.sayName(); // 输出: Bob