javascript中的原型继承是什么_它如何实现代码复用？-js教程-PHP中文网

javascript中的原型继承是什么_它如何实现代码复用？

狼影

发布： 2025-12-20 14:33:57

原创

571人浏览过

JavaScript原型继承通过[[Prototype]]链实现对象间属性和方法的共享复用，构造函数prototype、实例__proto__、Object.create()及ES6 class均基于此机制，本质是对象委托。

javascript中的原型继承是什么_它如何实现代码复用？

JavaScript 中的原型继承是一种基于对象的继承机制，它不依赖类（class）结构，而是通过对象内部的 [[Prototype]] 链将一个对象与另一个对象关联起来，使前者可以访问后者的属性和方法。这种机制天然支持代码复用：多个实例共享同一个原型对象上的方法，避免重复创建函数，节省内存，也便于统一维护。

原型链是怎么工作的？

每个 JavaScript 对象都有一个隐式原型（可通过 __proto__ 访问，或更规范地用 Object.getPrototypeOf()），指向它的构造函数的 prototype 属性所引用的对象。当访问一个对象的属性时，如果该对象自身没有这个属性，引擎会沿着 [[Prototype]] 链向上查找，直到找到或到达 null。

函数的 prototype 是一个对象，供其实例共享方法
实例的 __proto__ 指向其构造函数的 prototype
所有普通对象最终都继承自 Object.prototype

如何用构造函数 + prototype 实现复用？

这是最经典的原型继承写法：把可复用的方法定义在构造函数的 prototype 上，而非每次在构造函数体内 this.xxx = function(){...}，从而让所有实例共用同一份函数。

function Person(name) {
  this.name = name;
}
Person.prototype.sayHello = function() {
  return `Hello, I'm ${this.name}`;
};

const a = new Person('Alice');
const b = new Person('Bob');
console.log(a.sayHello === b.sayHello); // true —— 同一个函数，复用成功

登录后复制

ES6 class 只是语法糖，底层仍是原型

class 写法看起来像传统面向对象语言，但本质没变：它只是对原型继承的封装。所有 method 仍被添加到类的 prototype 上，static 方法则挂载在类本身。

Opus

AI生成视频工具

查看详情

立即学习“Java免费学习笔记（深入）”；

class A { method(){} } → A.prototype.method 存在
extends 会设置子类的 prototype.__proto__ 指向父类的 prototype，构成继承链
super 在方法中实际访问的是 [[Prototype]] 链上的上层方法

Object.create() 是更直接的原型继承方式

它跳过构造函数，直接以指定对象为原型创建新对象，适合纯对象间的委托复用。

const animal = {
  eats: true,
  walk() { console.log('walking...'); }
};

const rabbit = Object.create(animal);
rabbit.jumps = true;

console.log(rabbit.eats); // true —— 来自原型
rabbit.walk(); // walking... —— 复用原型方法

登录后复制

这种方式清晰体现了“对象委托”思想，也是实现组合式复用的常用手段。

以上就是javascript中的原型继承是什么_它如何实现代码复用？的详细内容，更多请关注php中文网其它相关文章！