#### 原型
[**\_\_proto\_\_**](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/proto)
- `__proto__` 是每个 JavaScript 对象（除了 null）都有的一个内部属性，它指向该对象的构造函数的原型对象（即 prototype 属性）。这是一种隐式原型
- `__proto__` 决定了对象的原型链。如果我们访问一个对象的属性或方法，而该对象本身没有这个属性或方法，JavaScript 会沿着 `**proto**` 指向的原型链向上查找，直到找到该属性或方法，或者到达原型链的顶端 `null`
```javascript title="__proto__"
const obj = {}
console.log(obj.__proto__ === Object.prototype) // true
const arr = []
console.log(arr.__proto__ === Array.prototype) // true
```
[**prototype**](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype)
- `prototype` 是函数对象的一个属性。每当我们定义一个函数时，JavaScript 引擎会为这个函数自动创建一个 `prototype` 属性，该属性是一个对象（默认情况下只包含一个 constructor 属性，指向这个函数本身）
- `prototype` 是用于实现 JavaScript 继承的关键机制。当一个函数被用作构造函数来创建对象时，所有通过该构造函数创建的对象都将共享这个 `prototype` 对象中的属性和方法
- 简单来说，该函数实例化的所有对象的 `proto` 的属性指向这个对象，它是该函数所有实例化对象的原型
```javascript title="prototype"
function Person(name) {
this.name = name
}
Person.prototype.sayHello = function () {
console.log(`Hello, my name is ${this.name}`)
}
const person1 = new Person('Alice')
const person2 = new Person('Bob')
person1.sayHello() // "Hello, my name is Alice"
person2.sayHello() // "Hello, my name is Bob"
```
#### 原型链
原型链是由对象通过 `__proto__` 连接形成的链条。当你访问一个对象的属性或方法时，如果这个对象本身没有该属性或方法，JavaScript 会沿着 `__proto__` 指向的原型链向上查找，直到找到该属性或方法，或到达原型链的顶端 `null`
原型链使得 JavaScript 的继承机制成为可能。通过原型链，一个对象可以继承另一个对象的属性和方法
```javascript title="对象的原形链"
const obj = {}
obj.__proto__ === Object.prototype // true
//原型链是: obj -> Object.prototype -> null
obj.__proto__ (或 Object.prototype)
|
|--> Object.prototype (如 toString, hasOwnProperty 等方法)
|
|--> null
```
```javascript title="数组的原型链"
const arr = []
arr.__proto__ === Array.prototype // true
//原型链是 arr -> Array.prototype -> Object.prototype -> null
arr.__proto__ (或 Array.prototype)
|
|--> Array.prototype (如 push, pop, forEach 等数组方法)
|
|--> Object.prototype (如 toString, hasOwnProperty 等方法)
|
|--> null
```
```javascript title="字符串的原型链"
const str = 'str'
str.__proto__ === String.prototype // true
//原型链是 str -> String.prototype -> Object.prototype -> null
str.__proto__ (或 String.prototype)
|
|--> String.prototype (如 toUpperCase, toLowerCase 等字符串方法)
|
|--> Object.prototype (如 hasOwnProperty, toString 等方法)
|
|--> null
```
```javascript title="原型链"
function Animal() {}
Animal.prototype.eat = function() {
console.log('Eating');
};
function Dog(name) {
this.name = name;
}
Dog.prototype = new Animal(); // Dog 继承了 Animal
Dog.prototype.constructor = Dog;
const dog = new Dog('Buddy');
dog.eat(); // "Eating"
dog.__proto__ (Dog.prototype)
|
|--> Animal.prototype (包含 eat 方法)
|
|--> Object.prototype (包含 toString, hasOwnProperty 等方法)
|
|--> null
```
#### 总结
- `__proto__` ：是对象的隐式原型，指向其构造函数的 `prototype` ，用于实现属性和方法的查找。
- prototype：是函数对象的属性，用于定义构造函数创建的实例共享的属性和方法。
- 原型链：通过 `__proto__` 连接多个对象形成的链条，实现对象属性和方法的继承。
通过这三个概念，JavaScript 实现了灵活的继承机制，使得对象可以共享和继承其他对象的属性和方法。这种机制与基于类的继承有所不同，但同样提供了强大的继承能力