Heim > Artikel > Web-Frontend > Eine ausführliche Diskussion über JavaScript-Konstruktoren
Der Inhalt dieses Artikels ist eine ausführliche Diskussion über den JavaScript-Konstruktor. Ich hoffe, dass er für Freunde hilfreich ist.
Wir haben heute einen Termin, um den Javascript-Konstruktor zu besprechen. Vielen Dank, dass Sie wie geplant gekommen sind.
Wir haben gestern die Konstruktorfunktion besprochen und sind zu einem Ergebnis gekommen
Konstruktor ist ein Attribut für das Prototypobjekt, das standardmäßig auf den Konstruktor dieses Prototyps verweist
Diese Schlussfolgerung scheint in unserer täglichen Arbeit nützlich zu sein Es nützt nichts. Ist der Konstruktor also wirklich nutzlos?
Funktionen in JS können entweder Konstruktoren sein oder als normale Funktionen aufgerufen werden. Wenn Sie new zum Erstellen eines Objekts verwenden, ist die entsprechende Funktion ein Konstruktor und wenn sie aufgerufen wird Durch ein Objekt ist es eine normale Funktion.
In unserer täglichen Arbeit müssen wir oft ein Objekt erstellen, und wir verwenden zum direkten Erstellen meist Objekt-Direktmengen. Der Code lautet beispielsweise wie folgt
var person = { name:'postbird', address:'earth', sayHello:function(){console.log('Hello,I am ' + this.name);} };
Wenn es sich nur um ein einzelnes Objekt handelt, ändern sich die Eigenschaften und Methoden des Objekts grundsätzlich nicht. Wenn Ihr Objekt jedoch viele Instanzen hat oder Vererbungs- oder Konstruktorparameter beinhaltet, achten Sie auf die Codekommentare
//创建了一个构造函数 function Person(name,address){ this.name = name; this.address = address; } //为构造函数的原型对象添加一个方法sayHello Person.prototype.sayHello = function(){ console.log('Hi I am ' + this.name); } //通过构造函数Person实例化一个p1,并传参 var p1 = new Person('postbird','earth'); //通过构造函数Person实例化一个p2,并传参 var p2 = new Person('ptbird','month'); console.log(p1);//{name: "postbird", address: "earth"} console.log(p2);//{name: "ptbird", address: "month"} // p1和p2 继承了Person的sayHello方法 p1.sayHello()//Hi I am ptbird p2.sayHello()//Hi I am postbird
Geduld und Geschmack des obigen Codes, auf diese Weise wird die Skalierbarkeit besser, Sie können N Instanzen erstellen und die Wiederverwendung von Code realisieren
Über die Konstruktorstruktur der js-Funktion , es gibt eine sehr klassische Demo
function Person(area){ this.type = 'person'; this.area = area; } Person.prototype.sayArea = function(){ console.log(this.area); } var Father = function(age){ this.age = age; } Father.prototype = new Person('Beijin'); console.log(Person.prototype.constructor===Person) //true console.log(Father.prototype.constructor===Person); //true Father.prototype.constructor = Father;//修正 console.log(Father.prototype.constructor===Father); //true var one = new father(25); console.log(one.constructor===Father) // true
Achten Sie auf diese Codezeile
Father.prototype.constructor = Father;//修正
Warum sollte sie korrigiert werden? Bedeutet das nicht, dass constructor ein Attribut für das Prototypobjekt ist und standardmäßig auf den Konstruktor dieses Prototyps verweist ?
Lassen Sie uns diese Codezeile auskommentieren
function Person(area){ this.type = 'person'; this.area = area; } Person.prototype.sayArea = function(){ console.log(this.area); } var Father = function(age){ this.age = age; } Father.prototype = new Person('Beijin'); console.log(Person.prototype.constructor===Person) //true console.log(Father.prototype.constructor===Person); //true //Father.prototype.constructor = Father;//修正 console.log(Father.prototype.constructor===Father); //false var one = new Father(25); console.log(one.constructor===Person) // true
So klug Sie auch sind, ich glaube, Sie haben es bereits getan. Wenn das Problem gelöst wird
Father.prototype = new Person('Beijin');
, zeigt der Prototyp auf ein neues Objekt und der Konstruktor dieses neuen Objekts zeigt auf Person.
console.log((new Person('Beijin')).__proto__ === Person.prototype) //true
Wir haben zuvor gesagt, dass das neue Person('Beijin')-Objekt keinen Prototyp hat und nur Funktionen über Prototypen verfügen. Father.prototype.constructor wird der Prototypenkette von new Person('Beijin') folgen. Suchen Sie unten nach dem Konstruktor. Wenn new Person('Beijin') keinen Konstruktor hat, gehen Sie zu seinem __proto__, um ihn zu finden, denn (new Person('Beijin'))._proto_ === Person.prototype und Person.prototype.constructor == function Person(), also Father.prototype.constructor == Person.prototype.constructor //function Person() wenn wir var one = new Father(25), one.constructor = Father.prototype.constructor, also one.constructor zeigt auf die Funktion Person(), also muss es korrigiert werden, sonst wird die Prototypenkette chaotisch
Das obige ist der detaillierte Inhalt vonEine ausführliche Diskussion über JavaScript-Konstruktoren. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!