原型和原型链：深入浅出的面试知识全览
2023-09-10 21:34:02
前言
对于 Javascript 开发者来说，理解原型和原型链是至关重要的。它们是面向对象编程的基础，也是面试中常见的考察点。然而，这些概念并不总是容易理解。本文旨在通过深入浅出的讲解，帮助大家全面掌握原型和原型链，从而提升面试表现。
什么是原型
在 Javascript 中，每个函数都具有一个 prototype 属性，指向一个对象。这个对象被称为该函数的原型。原型对象包含着该函数创建的对象的共有属性和方法。
例如，考虑以下 Person 函数：
function Person(name) {
this.name = name;
}
Person 函数的原型对象可以这样访问：
Person.prototype
这个原型对象包含了所有 Person 实例共享的属性和方法。例如，我们可以向原型对象添加一个 greet 方法：
Person.prototype.greet = function() {
console.log(`Hello, my name is ${this.name}`);
};
现在，所有 Person 实例都可以使用 greet 方法：
const person = new Person('John');
person.greet(); // 输出：Hello, my name is John
什么是原型链
原型链是一个对象的查找路径。当一个对象试图访问一个不存在的属性或方法时，它会沿着原型链向上查找，直到找到该属性或方法，或者到达 null。
例如，考虑以下代码：
const person = new Person('John');
person.age; // undefined
age 属性在 person 对象中不存在。因此，Javascript 会沿着原型链向上查找。Person.prototype 中也没有 age 属性。因此，Javascript 会继续向上查找，直到到达 Object.prototype。Object.prototype 中有 age 属性，但它是 undefined。因此，person.age 的值为 undefined。
原型继承
在 Javascript 中，对象可以通过原型继承来继承其他对象的属性和方法。当一个对象被创建时，它的原型链指向其构造函数的原型对象。
例如，考虑以下 Employee 构造函数，它继承自 Person 构造函数：
function Employee(name, salary) {
Person.call(this, name);
this.salary = salary;
}
Employee 构造函数通过 call 方法继承了 Person 构造函数的属性和方法。因此，Employee 实例不仅拥有自己的属性（如 salary），还拥有 Person 实例的所有属性和方法（如 name 和 greet）。
instanceof 运算符
instanceof 运算符用于检查一个对象是否属于某个构造函数的实例。它返回一个布尔值，表示对象是否在该构造函数的原型链上。
例如，以下代码检查 person 对象是否为 Person 实例：
person instanceof Person; // true
面试技巧
在面试中，原型和原型链是常见的考察点。以下是一些面试技巧：
- 能够解释原型的概念及其作用。
- 能够原型链的运作方式。
- 能够解释原型继承是如何工作的。
- 能够使用
instanceof运算符来检查对象的类型。 - 能够提供有关原型和原型链的具体示例。
总结
原型和原型链是 Javascript 面向对象编程的基础。通过深入理解这些概念，你可以显着提高你的面试表现。本文提供了原型和原型链的全面讲解，包括基础概念、拓展知识和面试技巧。通过掌握这些知识，你将能够自信地回答面试官有关原型和原型链的问题，并脱颖而出。
