javascript原型链是什么_它如何实现继承呢

12次阅读

javaScript原型链的本质是基于[[prototype]]内部属性的对象属性查找机制:访问属性时若对象自身不存在,则沿__proto__向上查找直至NULL

javascript原型链是什么_它如何实现继承呢

javascript 原型链的本质是什么

原型链不是语法结构,而是一套基于 [[Prototype]] 内部属性的对象查找机制。每个对象在创建时都会关联一个原型对象(通常是其构造函数prototype 属性),当访问一个属性或方法时,如果该对象自身没有,js 引擎会沿着 __proto__(即 [[Prototype]] 的可访问别名)一层层向上查找,直到找到或抵达 null —— 这条链条就是原型链。

如何用 function 构造函数实现经典继承

这是最贴近“类继承”直觉的方式,但需手动连接原型并修复 constructor 指向:

function Animal(name) {   this.name = name; } Animal.prototype.speak = function() {   console.log(this.name + ' makes a sound'); };  function Dog(name, breed) {   Animal.call(this, name); // 继承实例属性   this.breed = breed; } Dog.prototype = Object.create(Animal.prototype); // 关键:设置原型链 Dog.prototype.constructor = Dog; // 修复 constructor  Dog.prototype.bark = function() {   console.log(this.name + ' barks'); };
  • Animal.call(this, name) 确保 this 上有 name,不依赖原型共享
  • Object.create(Animal.prototype) 是安全方式,避免直接赋值 Dog.prototype = Animal.prototype(会污染父类原型)
  • 漏掉 constructor = Dog 会导致 new Dog().__proto__.constructor === Animal,影响 instanceof 和调试

class 语法下原型链怎么工作

class 只是语法糖,底层仍靠原型链。所有方法都定义在 ClassName.prototype 上,extends 会自动设置子类prototype.__proto__ 指向父类的 prototype,同时让子类构造函数的 __proto__ 指向父类构造函数(实现静态方法继承):

class Animal {   constructor(name) {     this.name = name;   }   speak() {     console.log(this.name + ' makes a sound');   } }  class Dog extends Animal {   constructor(name, breed) {     super(name);     this.breed = breed;   }   bark() {     console.log(this.name + ' barks');   } }
  • new Dog().__proto__ === Dog.prototype,且 Dog.prototype.__proto__ === Animal.prototype
  • Dog.__proto__ === Animal,所以能继承 Animal 的静态方法(如 Animal.create()
  • super() 必须在 this 使用前调用,否则报错 ReferenceError: Must call super constructor

原型链继承的常见陷阱

多数问题源于对“共享引用”和“构造时机”的误判:

立即学习Java免费学习笔记(深入)”;

  • 在父类 prototype 上定义数组/对象属性(如 Animal.prototype.tags = []),所有实例会共享同一份引用,修改会影响其他实例
  • for...in 遍历时会遍历整个原型链上的可枚举属性,需用 hasOwnProperty() 过滤
  • instanceof 依赖的是原型链中是否存在某个构造函数的 prototype,若手动改写 __proto__ 或使用 Object.setPrototypeOf(),可能破坏预期行为
  • 箭头函数没有自己的 thisprototype,不能用作构造函数,也无法被继承

原型链本身很轻量,但一旦涉及多层继承、动态修改 __proto__ 或混用 class 与旧式构造函数,链路就容易断裂或变得难以追踪。

text=ZqhQzanResources