别再死记硬背！一文读懂JavaScript原型继承面试题本质

原型继承基础概念得先拎清

JavaScript里的原型继承，那可是个重要玩意儿。咱们先从基础说起，每个函数都有个prototype属性，这就是原型对象。比如说，你定义了一个构造函数Person：

function Person(name) {
    this.name = name;
}
Person.prototype.sayHello = function() {
    console.log('Hello, I'm'+ this.name);
};

这里Person.prototype就有了个sayHello方法。当你用new Person('Tom')创建实例时，这个实例就会通过__proto__属性链接到Person.prototype。就好比实例是个小孩，Person.prototype就是小孩的家谱，小孩能从家谱里找到一些共有的特性（方法）。理解这一点，是吃透原型继承面试题的第一步。

原型链是解题关键线索

原型链就像是一条串联起各种对象的线。接着上面的例子，当你调用let tom = new Person('Tom'); tom.sayHello()时，JavaScript引擎咋知道sayHello方法在哪呢？它会先在tom这个实例自身找，要是没找到，就顺着__proto__这条线，去Person.prototype里找。要是还没有，就继续往上找Object.prototype，直到找到或者到头（null）为止。这就像你要找某个东西，先在家里找，找不到就去邻居家，邻居家没有再去隔壁村找，一路找下去。面试题里常考对原型链查找机制的理解，比如问你修改原型对象上的属性，对已创建的实例有啥影响。理解了原型链，答案就很清晰啦。

常见面试题“陷阱”剖析

1. 原型对象修改与实例关系：题目可能会这么出，先创建一堆实例，然后修改原型对象上的属性或方法，问你实例的变化。例如：

   function Animal(name) {
   this.name = name;
   }
   Animal.prototype.speak = function() {
   console.log(this.name +'makes a sound');
   };
   let dog = new Animal('Dog');
   let cat = new Animal('Cat');
   Animal.prototype.speak = function() {
   console.log(this.name +'says something different');
   };

   这里修改了Animal.prototype的speak方法，dog和cat实例调用speak方法时，就会执行新的逻辑。因为它们是通过原型链找到speak方法的，原型对象一变，它们跟着变。

2. instanceof 操作符原理：instanceof也是常考点。比如问你dog instanceof Animal为啥返回true。这是因为instanceof就是检查右边构造函数的prototype属性，是否在左边对象的原型链上。dog的原型链上有Animal.prototype，所以返回true。搞懂这些“陷阱”，面试答题就能避开误区。

从面试题看实际应用场景

为啥面试老考原型继承呢？因为在实际开发中，它用途可广了。比如在开发一些框架或者类库时，用原型继承可以实现代码复用。像著名的JavaScript库jQuery，就大量运用了原型继承来创建可复用的方法和属性。通过理解原型继承面试题，能让你更好地理解这些优秀代码的设计思路，提升自己的开发能力。

JavaScript原型继承面试题，看似复杂，其实只要把基础概念、原型链以及常见陷阱搞明白，再结合实际应用场景思考，就能轻松应对啦。下次面试遇到相关题目，别慌，用这篇文章里的思路去拆解，稳稳拿下！