In JavaScript ist alles ein Objekt! Aber auch die Objekte sind unterschiedlich. Unterteilt in gewöhnliche Objekte und Funktionsobjekte, sind Objekt und Funktion Funktionsobjekte, die mit JS geliefert werden. Das folgende Beispiel veranschaulicht
var o1 = {}; var o2 =new Object(); var o3 = new f1(); function f1(){}; var f2 = function(){}; var f3 = new Function('str','console.log(str)'); console.log(typeof Object); //function console.log(typeof Function); //function console.log(typeof f1); //function console.log(typeof f2); //function console.log(typeof f3); //function console.log(typeof o1); //object console.log(typeof o2); //object console.log(typeof o3); //object
Im obigen Beispiel ist o1 o2 o3 ein gewöhnliches Objekt und f1 f2 f3 ein Funktionsobjekt. Die Unterscheidung ist eigentlich sehr einfach. Alle durch new Function() erstellten Objekte sind Funktionsobjekte, andere sind gewöhnliche Objekte. f1, f2 werden letztendlich alle durch new Function() erstellt. Funktionsobjekte werden auch durch New Function() erstellt.
Achten Sie darauf, zwischen gewöhnlichen Objekten und Funktionsobjekten zu unterscheiden. Wir werden es im Folgenden häufig verwenden.
Lassen Sie uns zunächst die Kenntnisse des Konstruktors überprüfen:
function Person(name, age, job) { this.name = name; this.age = age; this.job = job; this.sayName = function() { alert(this.name) } } var person1 = new Person('Zaxlct', 28, 'Software Engineer'); var person2 = new Person('Mick', 23, 'Doctor');
Das obige Beispiel Person1 und person2 sind beide Instanzen von Person. Beide Instanzen haben eine constructor
(Konstruktor)-Eigenschaft, die auf Person verweist. Das heißt:
console.log(person1.constructor == Person); //true console.log(person2.constructor == Person); //true
Wir müssen uns zwei Konzepte merken (Konstruktor, Instanz): Person1 und Person2 sind beide Instanzen des Konstruktors Person Eine Formel: Das Konstruktorattribut der Instanz zeigt auf den Konstruktor.
In JavaScript wird jedes Mal, wenn ein Objekt (eine Funktion ist auch ein Objekt) definiert, das Objekt definiert Enthält einige vordefinierte Eigenschaften. Jedes Funktionsobjekt verfügt über ein prototype
-Attribut, das auf das Prototypobjekt der Funktion verweist. (Verwenden Sie zuerst das, was __proto__
ist, und analysieren Sie es im Detail in der zweiten Lektion)
function Person() {} Person.prototype.name = 'Zaxlct'; Person.prototype.age = 28; Person.prototype.job = 'Software Engineer'; Person.prototype.sayName = function() { alert(this.name); } var person1 = new Person(); person1.sayName(); // 'Zaxlct' var person2 = new Person(); person2.sayName(); // 'Zaxlct' console.log(person1.sayName == person2.sayName); //true
Wir haben das erste „Gesetz“ dieses Artikels erhalten:
每个对象都有 __proto__ 属性,但只有函数对象才有 prototype 属性
Was ist also ein Prototypobjekt? Wenn wir das obige Beispiel ändern, werden Sie verstehen:
Person.prototype = { name: 'Zaxlct', age: 28, job: 'Software Engineer', sayName: function() { alert(this.name); } }
Prototypobjekt, wie der Name schon sagt, ist es ein gewöhnliches Objekt (Unsinn = =!). Von nun an müssen Sie bedenken, dass das Prototypobjekt Person.prototype ist. Wenn Sie immer noch Angst davor haben, stellen Sie es sich als den Buchstaben A vor: var A = Person.prototype
Oben haben wir A vier Attribute hinzugefügt: Name, Alter, Job, sayName. Tatsächlich verfügt es auch über ein Standardattribut: constructor
Standardmäßig werden alle Prototypenobjekte automatisch erhalten ein
constructor
(Konstruktor)-Attribut, das (ein Zeiger) auf die Funktion (Person) zeigt, in der sich dasprototype
-Attribut befindet
Der obige Satz ist etwas schwer auszusprechen: A hat ein Standardattribut constructor
, das ein Zeiger ist, auf den es zeigt Person. Das heißt: Person.prototype.constructor == Person
Im zweiten Abschnitt „Konstruktor“ oben wissen wir, dass das Konstruktorattribut (Konstruktor) der -Instanz auf den Konstruktor < verweist 🎜> : person1.constructor == Person
Diese beiden „Formeln“ scheinen irgendwie verwandt zu sein:
person1.constructor == Person Person.prototype.constructor == Person
Warum hat person1 das Konstruktorattribut? Das liegt daran, dass person1 eine Instanz von Person ist. Warum hat Person.prototype dann ein Konstruktorattribut? ? Ebenso ist Person.prototype (stellen Sie sich A vor) ebenfalls eine Instanz von Person. Das heißt, wenn eine Person erstellt wird, wird ein Instanzobjekt davon erstellt und seinem Prototyp zugewiesen. Der grundlegende Prozess ist wie folgt:
var A = new Person(); Person.prototype = A; // 注:上面两行代码只是帮助理解,并不能正常运行
结论:原型对象(Person.prototype)是 构造函数(Person)的一个实例。
原型对象其实就是普通对象(但 Function.prototype 除外,它是函数对象,但它很特殊,他没有prototype属性(前面说道函数对象都有prototype属性))。看下面的例子:
function Person(){}; console.log(Person.prototype) //Person{} console.log(typeof Person.prototype) //Object console.log(typeof Function.prototype) // Function,这个特殊 console.log(typeof Object.prototype) // Object console.log(typeof Function.prototype.prototype) //undefined
Function.prototype
为什么是函数对象呢?
var A = new Function (); Function.prototype = A;
Function.prototype
是函数对象。那原型对象是用来做什么的呢?主要作用是用于继承。举个例子:
var Person = function(name){ this.name = name; // tip: 当函数执行时这个 this 指的是谁? }; Person.prototype.getName = function(){ return this.name; // tip: 当函数执行时这个 this 指的是谁? } var person1 = new person('Mick'); person1.getName(); //Mick
从这个例子可以看出,通过给 Person.prototype
设置了一个函数对象的属性,那有 Person 的实例(person1)出来的普通对象就继承了这个属性。具体是怎么实现的继承,就要讲到下面的原型链了。
小问题,上面两个 this 都指向谁?
var person1 = new person('Mick'); person1.name = 'Mick'; // 此时 person1 已经有 name 这个属性了 person1.getName(); //Mick
故两次 this 在函数执行时都指向 person1。
推荐教程:《JS教程》
Das obige ist der detaillierte Inhalt vonDie ausführlichste Erklärung des JS-Prototyps und der Prototypenkette. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!