每个JavaScript对象都有一个名为[[Prototype]]的内部“槽”，其值要么为null，要么为对象。您可以将槽视为对象的属性，在JavaScript引擎内部，隐藏在编写的代码中。[[Prototype]]周围的方括号是故意的，是表示内部插槽的ECMAScript规范约定。

一个对象的[[Prototype]]所指向的值，通俗地说就是“该对象的原型”

如果您通过点（obj.propName）或括号（obj['propName']）表示法访问属性，并且对象没有直接具有这样的属性（即自己的属性，可通过obj.hasOwnProperty（'propName'）检查），则运行时会在[[Prototype]]引用的对象上查找具有该名称的属性。如果[[Prototype]]也没有这样的属性，则依次检查其[[Prototype]]，依此类推。这样，将遍历原始对象的原型链，直到找到匹配项或到达其终点。原型链的顶部是空值。

现代JavaScript实现允许通过以下方式对[[Prototype]]进行读和/或写访问：

新运算符（在从构造函数返回的默认对象上配置原型链），extends关键字（使用类语法时配置原型链），Object.create将提供的参数设置为结果对象的[[Prototype]]，Object.getPrototypeOf和Object.setPrototype Of（在创建对象后获取/设置[[Prototype]]），以及名为__proto__（类似于4）的标准化访问器（即getter/setter）属性

Object.getPrototypeOf和Object.setPrototype of优于__proto__，部分原因是当对象的原型为null时，o.__proto__的行为是不寻常的。

对象的[[Prototype]]最初是在创建对象期间设置的。

如果通过new Func（）创建新对象，则默认情况下，对象的[[Prototype]]将设置为Func.Prototype引用的对象。

因此，请注意，所有类和所有可以与新运算符一起使用的函数，除了它们自己的[[prototype]]内部槽之外，还有一个名为.prototype的属性。这种“原型”一词的双重使用是该语言新来者无尽困惑的根源。

在构造函数中使用new允许我们模拟JavaScript中的经典继承；尽管正如我们所见，JavaScript的继承系统是原型的，而不是基于类的。

在JavaScript引入类语法之前，构造函数是模拟类的唯一方法。我们可以将构造函数的.prototype属性引用的对象的财产视为共享成员；即每个实例相同的成员。在基于类的系统中，方法对每个实例的实现方式相同，因此方法在概念上被添加到.prototype属性中；然而，对象的字段是特定于实例的，因此在构造过程中会添加到对象本身。

如果没有类语法，开发人员必须手动配置原型链，以实现与经典继承类似的功能。这导致了实现这一目标的多种方式的优势。

这里有一种方法：

function Child() {}
function Parent() {}
Parent.prototype.inheritedMethod = function () { return 'this is inherited' }

function inherit(child, parent) {
  child.prototype = Object.create(parent.prototype)
  child.prototype.constructor = child
  return child;
}

Child = inherit(Child, Parent)
const o = new Child
console.log(o.inheritedMethod()) // 'this is inherited'

…还有另一种方法：

function Child() {}
function Parent() {}
Parent.prototype.inheritedMethod = function () { return 'this is inherited' }

function inherit(child, parent) {
    function tmp() {}
    tmp.prototype = parent.prototype
    const proto = new tmp()
    proto.constructor = child
    child.prototype = proto
    return child
}

Child = inherit(Child, Parent)
const o = new Child
console.log(o.inheritedMethod()) // 'this is inherited'

ES2015中引入的类语法简化了事情，通过提供extends作为配置原型链的“一种真正的方式”，以模拟JavaScript中的经典继承。

因此，与上面的代码类似，如果您使用类语法创建一个新对象，如下所示：

class Parent { inheritedMethod() { return 'this is inherited' } }
class Child extends Parent {}

const o = new Child
console.log(o.inheritedMethod()) // 'this is inherited'

…结果对象的[[Prototype]]将被设置为Parent的一个实例，其[[Prototype]]又是Parent.Prototype。

最后，如果您通过object.create（foo）创建一个新对象，则生成的对象的[[Prototype]]将设置为foo。

Javascript没有通常意义上的继承，但它有原型链。

原型链

如果在对象中找不到对象的成员，它会在原型链中查找它。链由其他对象组成。可以使用__proto__变量访问给定实例的原型。每个对象都有一个，因为javascript中的类和实例之间没有区别。

向原型中添加函数/变量的优点在于，它只需在内存中存在一次，而不是针对每个实例。

它对于继承也很有用，因为原型链可以由许多其他对象组成。

让我告诉你我对原型的理解。我不会将这里的继承与其他语言进行比较。我希望人们不要再比较语言了，而只把语言理解为语言本身。理解原型和原型继承非常简单，我将在下面向您展示。

原型就像一个模型，你可以根据它来创建产品。要理解的关键点是，当您使用另一个对象作为原型创建一个对象时，原型和产品之间的联系是持久的。例如：

var model = {x:2};
var product = Object.create(model);
model.y = 5;
product.y
=>5

每个对象都包含一个名为[[prototype]]的内部属性，可以通过object.getPrototypeOf（）函数访问该属性。create（model）创建一个新对象，并将其[[prototype]]属性设置为对象模型。因此，当您执行Object.getPrototypeOf（产品）时，您将获得对象模型。

产品中的财产按以下方式处理：

当访问属性以读取其值时，将在范围链中查找该属性。变量的搜索从产品开始，一直到其原型。如果在搜索中找到了这样的变量，搜索将立即停止，并返回值。如果在作用域链中找不到这样的变量，则返回undefined。当写入（更改）属性时，该属性将始终写入产品对象。如果产品还没有这样的属性，则会隐式创建和编写它。

使用原型属性的对象链接称为原型继承。这很简单，同意吗？

这个“.prototype”属性的确切用途是什么？

标准类的接口变得可扩展。例如，您正在使用Array类，还需要为所有数组对象添加自定义序列化程序。你会花时间编写一个子类，还是使用合成或。。。prototype属性通过让用户控制类可用的成员/方法的精确集合来解决这个问题。

将原型视为一个额外的vtable指针。当原始类中缺少一些成员时，将在运行时查找原型。

原型继承的概念对于许多开发人员来说是最复杂的概念之一。让我们试着理解问题的根源，以便更好地理解原型继承。让我们从一个简单的函数开始。

如果我们在Tree函数上使用一个新运算符，我们将其作为构造函数调用。

每个JavaScript函数都有一个原型。当你记录Tree.prototype时，你会。。。

如果查看上面的console.log（）输出，您可以看到Tree.prototype上的构造函数属性和__proto__属性。__proto__表示这个函数所基于的原型，由于这只是一个普通的JavaScript函数，还没有设置继承，所以它引用的是Object原型，它是JavaScript中刚刚内置的东西。。。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype

这包括.toString、.toValue、.hasOwnProperty等。。。

__我的mozilla带来的proto__已被弃用，取而代之的是Object.getPrototypeOf方法来获取对象的原型。

Object.getPrototypeOf(Tree.prototype); // Object {} 

让我们向Tree原型添加一个方法。

我们修改了Root并向其添加了一个函数分支。

这意味着当您创建Tree实例时，可以调用它的分支方法。

我们还可以向原型中添加原语或对象。

让我们在树中添加一个子树。

在这里，Child从Tree继承了它的原型，我们在这里做的是使用Object.create（）方法根据您传递的内容创建一个新对象，这里是Tree.prototype。在这种情况下，我们正在做的是将Child的原型设置为一个看起来与Tree原型相同的新对象。接下来，我们将Child的构造函数设置为Child，如果不设置，它将指向Tree（）。

孩子现在有了自己的原型，它的__proto__指向Tree，Tree的原型指向base Object。

Child  
|
 \
  \
   Tree.prototype
   - branch
   |
   |
    \
     \
      Object.prototype
      -toString
      -valueOf
      -etc., etc.

现在您创建了一个最初在Tree中可用的Child和call分支的实例。我们还没有在Child原型上定义分支。但是，在Child继承的Root原型中。

在JS中，一切都不是对象，一切都可以像对象一样。

Javascript有字符串、数字、布尔值、未定义、null等原语。它们不是对象（即引用类型），但肯定可以充当对象。让我们看一个例子。

在该列表的第一行中，为name指定了一个基本字符串值。第二行将名称视为对象，并使用点表示法调用charAt（0）。

这是幕后发生的事情：//JavaScript引擎的作用

String对象在被销毁之前只存在一个语句（一个称为自动装箱的过程）。让我们再次回到我们的原型继承。

Javascript支持基于原型。每个函数都有一个原型属性，该属性引用另一个对象财产/函数是从对象本身或通过原型链（如果不存在）

JS中的原型是一个对象，它使您成为另一个对象的父对象。授权意味着如果你不能做某事，你会告诉别人帮你做。

https://jsfiddle.net/say0tzpL/1/

如果您查找上面的fiddle，dog可以访问toString方法，但它在其中不可用，但可以通过委托给Object.prototype的原型链使用

如果您查看下面的一个，我们正在尝试访问每个函数中可用的调用方法。

https://jsfiddle.net/rknffckc/

如果您查找上面的fiddle，Profile Function可以访问调用方法，但它在其中不可用，但可以通过委托给Function.prototype的原型链使用

注意：prototype是函数构造函数的属性，而__proto__是从函数构造函数构造的对象的属性。每个函数都有一个原型属性，其值为空对象。当我们创建函数的实例时，我们得到一个内部属性[[Prototype]]或__proto__，其引用是function构造函数的原型。

上图看起来有点复杂，但展示了原型链接工作原理的全貌。让我们慢慢来：

有两个实例b1和b2，其构造函数是Bar，父实例是Foo，并且有两个来自原型链的方法通过Bar和Foo识别和说话

https://jsfiddle.net/kbp7jr7n/

如果你查阅上面的代码，我们有Foo构造函数，它有方法identify（），Bar构造函数有speak方法。我们创建了两个Bar实例b1和b2，它们的父类型是Foo。现在，在调用Bar的speak方法时，我们能够通过原型链识别谁在调用speak。

Bar现在拥有Foo的所有方法，这些方法都在其原型中定义。让我们进一步了解Object.prototype和Function.prototype以及它们之间的关系。如果您查找Foo的构造函数，Bar和Object是Function构造函数。

Bar的原型是Foo，Foo的原型是Object，如果仔细观察，Foo原型与Object.prototype相关。

在结束之前，让我们在这里用一小段代码来总结上面的内容。我们在这里使用instanceof运算符来检查对象的原型链中是否包含构造函数的prototype属性，该属性在下面概括了整个大型图。

我希望这是一些信息，我知道这类信息可能很难掌握。。。简单地说，它只是链接到对象的对象！！！！

面向对象JavaScript的最终指南-一个非常简洁和清晰的30分钟视频解释（原型继承主题从5:45开始，尽管我更愿意听整个视频）。这段视频的作者还制作了JavaScript对象可视化工具网站http://www.objectplayground.com/.