js prototype继承

JavaScript中的原型继承是一种基于原型的面向对象编程模型。每个JavaScript对象都有一个内部属性[[Prototype]]，它指向另一个对象，即原型对象。当试图访问对象的属性或方法时，如果对象本身没有这个属性或方法，JavaScript会沿着原型链向上查找，直到找到该属性或方法，或者到达原型链的末端（即null）。

基础概念

1. 原型（Prototype）：每个函数都有一个prototype属性，它指向一个对象，这个对象包含可以被特定类型的所有实例共享的属性和方法。
2. 构造函数（Constructor）：用于创建和初始化新对象的函数。通常，构造函数的名称以大写字母开头。
3. 实例（Instance）：通过new关键字和构造函数创建的对象。
4. 原型链（Prototype Chain）：当访问对象的属性或方法时，JavaScript引擎会沿着对象的原型链向上查找，直到找到该属性或方法。

示例代码

function Animal(name) {
  this.name = name;
}

Animal.prototype.sayName = function() {
  console.log('My name is ' + this.name);
};

function Dog(name, breed) {
  Animal.call(this, name); // 继承属性
  this.breed = breed;
}

// 设置Dog的原型为Animal的实例，实现继承方法
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog; // 修复构造函数指向

Dog.prototype.sayBreed = function() {
  console.log('My breed is ' + this.breed);
};

var myDog = new Dog('Buddy', 'Golden Retriever');
myDog.sayName(); // My name is Buddy
myDog.sayBreed(); // My breed is Golden Retriever

优势

1. 代码复用：通过原型继承，可以将共享的方法和属性放在原型上，避免每个实例都创建一份副本，节省内存。
2. 灵活性：可以在运行时动态地向原型添加新的属性和方法，这些更改会立即反映在所有实例上。

类型

• 原型链继承：通过设置子类的原型为父类的实例来实现继承。
• 构造函数继承：在子类构造函数中调用父类构造函数来继承属性。
• 组合继承：结合原型链继承和构造函数继承的优点。
• 寄生组合继承：优化组合继承，避免两次调用父类构造函数。

应用场景

• 创建具有相似行为的对象：例如，创建一系列具有共同属性和方法的UI组件。
• 框架和库的设计：许多JavaScript框架和库利用原型继承来构建可扩展和可维护的代码结构。

常见问题及解决方法

问题：原型链过长导致性能问题。

解决方法：尽量保持原型链的简洁，避免不必要的继承层次。

问题：忘记设置子类的constructor属性。

解决方法：在设置子类原型后，显式地将constructor属性指向子类构造函数。

Dog.prototype.constructor = Dog;

问题：原型污染。

解决方法：避免直接修改内置对象的原型，使用Object.create()来创建新的原型对象。

通过理解这些基础概念和实践，可以有效地利用JavaScript的原型继承机制来编写高效、可维护的代码。