Eine detaillierte Einführung in die Geburt von allem in der JavaScript-Welt

1. Aus dem Nichts etwas erschaffen

Zuerst war da nichts.

Der Schöpfer sagte: Nichts ist selbst ein Ding, also gibt es Null:

Jetzt müssen wir etwas erschaffen. Doch was tun, wenn Rohstoffe fehlen?

Eine Stimme sagte: Ist da nicht null?

Eine andere Stimme sagte: Aber null bedeutet nichts.

Der Schöpfer sagte: Dann mach etwas aus dem Nichts!

Also:

Objekt Nr. 1 in JavaScript wird generiert.

Dieses Objekt Nr. 1 ist unglaublich, es ist der wahre Vorfahre aller Dinge. Es hat Eigenschaften, die alle Objekte haben.

Was ist __proto__? Es bedeutet „Geburt“ oder Erbe.

2. Die Maschine zur Herstellung von Objekten

Da Sie bereits ein Objekt haben, ist der Rest einfach zu handhaben, denn eins ist zwei, zwei ist drei und drei ist alles.

Aber der Schöpfer ist sehr faul, er möchte keine Objekte einzeln mit seinen eigenen Händen erschaffen. Also baute er eine Maschine, die Objekte herstellen konnte:

Er gab der Maschine einen Namen: Objekt.

Diese Maschine kann keine Objekte aus dem Nichts erstellen. Sie benötigt ein Vorlagenobjekt, um Objekte gemäß diesem Vorlagenobjekt zu erstellen. Natürlich wird das einzige Objekt Nr. 1 als Vorlage verwendet. Der Prototyp im Bild stellt das Vorlagenobjekt der Maschine dar.

Wie starte ich die Maschine? Durch den neuen Befehl. Sie rufen der Maschine „Neu!“ zu und das Objekt wird erstellt.

Das Aufkommen von Maschinen hat die automatisierte Massenproduktion von Objekten ermöglicht und die Hände des Schöpfers befreit. Dann machte sich der Schöpfer daran, andere Dinge zu tun.

Es wäre zu dumm, wenn die Maschine genau das gleiche Objekt einfach mechanisch nach der Vorlage kopieren würde.

Auf der Grundlage der Vererbung der Merkmale ihrer Eltern können menschliche Nachkommen Merkmale entwickeln, die ihre Eltern nicht haben. Wenn eine Maschine ein Objekt herstellt, kann sie nicht nur die Eigenschaften des Vorlagenobjekts erben, sondern auch neue Eigenschaften hinzufügen. Dadurch wird die JavaScript-Welt immer vielfältiger.

Zum Beispiel erstellt die Objektmaschine eines Tages ein Objekt mit einem speziellen Attribut namens Flag und dem Attributwert 10. Die grafische Darstellung sieht so aus:

Im Code geschrieben:

var obj = new Object({ flag: 10 });

Die kraftvolle Bewegung der Schöpfung hat begonnen...

Drei. Weitere Maschinen zur Herstellung von Objekten

Im Laufe der Tage kam der Schöpfer, um die Arbeit zu inspizieren. Er war sehr erfreut zu sehen, dass Object viele Objekte erstellt hatte.

Gleichzeitig entdeckte er auch, dass diese Objekte nach dem Prinzip „Vogelgleiche scharen sich zusammen“ in viele Kategorien eingeteilt werden können. Der kluge Schöpfer dachte: Warum baue ich nicht noch ein paar Maschinen und lasse jede Maschine für die Herstellung eines bestimmten Objekttyps verantwortlich sein? Also baute er mehrere Maschinen und gab ihnen Namen. Dies sind:

String: Wird zum Erstellen von Objekten verwendet, die einen Text darstellen.
Zahl: Wird zum Erstellen eines Objekts verwendet, das eine Zahl darstellt.
Boolescher Wert: Wird zum Erstellen von Objekten verwendet, die Ja und Nein darstellen.
Array: Wird zum Erstellen geordneter Warteschlangenobjekte verwendet.
Datum: Wird zum Erstellen eines Objekts verwendet, das ein Datum darstellt.
Fehler: Wird verwendet, um ein Objekt zu erstellen, das einen Fehler darstellt.
...

Viele Maschinen werden gleichzeitig gestartet, jede erfüllt ihre eigenen Aufgaben, und die Schöpfungsbewegung ist in eine neue Phase eingetreten...

Der Schöpfer begann Denken Sie noch einmal darüber nach: Obwohl die Maschine zur Herstellung eines Objekts verwendet wird, ist die Maschine selbst tatsächlich ein besonderes Objekt. Da es nun so viele Maschinen gibt, muss ich ihre gemeinsamen Merkmale zusammenfassen und in das Objektsystem integrieren.

Auf der Grundlage des Objekts Nr. 1 erstellte der Schöpfer also ein Objekt Nr. 2 und nutzte es, um die gemeinsamen Eigenschaften aller Maschinen darzustellen. Mit anderen Worten: Verwenden Sie es als Prototypobjekt für alle Maschinen.

(Hinweis: __proto__ ist zu mühsam zu schreiben, wir werden stattdessen später [p] verwenden)

Natürlich, wie Object, diese Maschinen Sie auch Sie benötigen jeweils ein Vorlagenobjekt, d. h. das Objekt, auf das ihr Prototypattribut zeigt. Offensichtlich sollten ihre Vorlagenobjekte vom Objekt Nr. 1 erben, also

这张图显示了JavaScript世界中那些最基本的机器本身的原型链，以及它们的模板对象的原型链。不过看起来太复杂了，所以后面我们就不再把它们完整地画出来了。

四. 制造机器的机器

造物主高兴地想：这下可好了，我造出了Object机器，实现了对象制造的自动化。然后又造出了String、Number等机器，实现了特定类别的对象制造的自动化。但是，为啥总感觉似乎还缺点什么呢？

对啦，还缺少一台制造机器的机器啊！

很快，万能的造物主就把它造了出来，并把它命名为Function。有了Function机器后，就可以实现自动化地制造机器了。
让我们来观察一下Function：

首先，Function是一台机器，所以它的原型对象也是No. 2对象。
其次，Function又是一台制造机器的机器，所以它的模板对象也是No. 2对象。
所以我们得到了Function的一个非常特别的性质：

Function.__proto__ === Function.prototype

哇，太奇妙了！

不要奇怪，这个性质不过是”Function是一台制造机器的机器“这个事实的必然结果。

从这张图中，我们发现：所有的函数(包括Function)的原型都是No. 2对象，而同时Function.prototype也是No. 2对象。这说明了：

从逻辑上，我们可以认为所有机器(包括Function自己)都是由Function制造出来的。

同时，如果再仔细瞧瞧，你会发现：

Object作为一个机器可以看做是有由Function制造出来的，而Function作为一个对象可以看做是由Object制造出来的。

这就是JavaScript世界的“鸡生蛋，蛋生鸡”问题。那么到底是谁生了谁呢？Whatever！

五. 让世界动起来

就像前面所说，机器用来制造某一类对象。正因如此，机器可以作为这类对象的标志，即面向对象语言中类(class)的概念。所以机器又被称为构造函数。在ES6引入class关键字之前，我们常常把构造函数叫做类。

然而，除了作为构造函数来制造对象外，函数通常还有另一个功能：做一件事情。正是有了这个功能，JavaScript的世界才由静变动，变得生机勃勃。

比如说，我们现在用Function机器制造了鸟类(即用来造鸟的机器)：

function Bird(color) {
    this.color = color;
}

然后，对着造鸟机说：“new！”，于是造鸟机发动起来，制造一个红色的鸟：

var redBird = new Bird('#FF0000');

如果现在我们想让鸟飞起来，该怎么办呢？我们需要再次用Function制造出一台机器，不过这台机器不是用来制造对象的，而是用来做事儿的，即“让鸟飞起来”这件事情：

// 这是一台通过晃动鸟的翅膀，让鸟飞起来的简陋的机器。
function makeBirdFly(bird) {
    shakeBirdWing(bird);
}

我们知道，让一台制造对象的机器发动，只需要对它喊“new”即可；那么怎样让一台做事情的机器发动呢？更简单，对它咳嗽一声就行了。咳咳咳，

makeBirdFly(redBird);

于是红鸟飞了起来，世界充满了生机。

从上面的Bird和makeBirdFly的定义可以看出：实际上，制造对象的机器和做事情的机器没什么明显区别，不同的只是它们的使用方式。在两种情况下，它们分别被叫做构造函数和普通函数。

说明1：function xxx语法可以看成new Function的等价形式。
说明2：用户自定义的函数通常既可以作为普通函数使用，又可以作为构造函数来制造对象。ES6新增的class语法定义的函数只能作为构造函数，ES6新增的=>语法定义的箭头函数只能作为普通函数。

六. 让世界立体起来

造物主对目前的世界还是不太满意，因为几乎所有的机器的模板对象都是No. 2，这使得JavaScript世界看起来有点扁。

于是造物主再次研究世界万物的分类问题。他发现有些对象会动、还会吃东西，于是把它们叫做动物，然后造了一台Animal机器来制造它们。他进一步发现，即使都是动物，也还是可以进一步分类，比如有些会飞、有些会游，他分别把它们叫做鸟类、鱼类。于是他想，我何不单独造几台机器，专门用来制造某一类动物呢。于是它造出了Bird、Fish等机器。

接下来，在选择这些机器的模板对象时碰到一个问题：如果还像之前那样直接复制一个No. 1对象作为Bird、Fish的模板，那么结果就是这样的：

这样可不好。首先没体现出鸟类、鱼类跟动物的关系，其次它们的模板对象存了重复的东西，这可是一种浪费啊。怎么办呢？简单，让Bird和Fish的模板对象继承自Animal的模板对象就好了。就是说

Bird.prototype.__proto__ === Animal.prototype
Fish.prototype.__proto__ === Animal.prototype

于是：

用同样的方法，造物主造出了一个立体得多的JavaScript世界。

然而这样还不够。虽然那些纯对象现在充满了层次感，但是那些机器对象之间的关系还是扁平的：

那又该怎么办呢？其实用类似的办法就行了：

为了更方便地做到这一点，造物主发明了class关键字。

七. 世界最终的样子

经过一番折腾，JavaScript世界发生了大变化。变得丰富多彩，同时变得很复杂。用一张图再也没法画出它的全貌，只能画出冰山一角：

JavaScript的世界还在不断进化中……

 以上就是JavaScript世界万物诞生记的详细介绍的内容，更多相关内容请关注PHP中文网（www.php.cn）！