/ / Pokúšame sa pochopiť pointu prototypov v JavaScripte - javascript, oop, class, prototype

Snažím sa pochopiť bod prototypov v jazyku JavaScript - javascript, oop, class, prototyp

Uvedomujem si, že toto bolo požiadané už stokrát,zdá sa mi však, že nerozumiem konceptu „prečo“, že prototypy v JavaScripte sú správne, tak ako je to v prípade napodobňovania tried (áno, viem, že JavaScript je jazyk založený na prototypoch - zhromaždil som toho toľko).

Rovnako ako mnoho ďalších ľudí, ktorí sa snažia dosiahnuťJavaScript, každodenný jazyk, ktorý používam, používam na bežný štýl triedy OOP, pretože som sa hrával v prostredí Java (a používal som triedy v jazykoch ActionScript a PHP). Avšak zatiaľ čo ja premýšľať Rozumiem, ako fungujú prototypy, „nedokážem pochopiť, prečo sú potrebné“.

Tu je môj ukážkový skript toho, ako momentálne chápem prototypy v JavaScripte:

var Apple = function() {
// An apple?
};

Apple.prototype.color = "red";

Apple.prototype.changeColor = function(new_color) {
this.color = new_color;
};
Apple.prototype.getColor = function() {
alert("color: "+this.color);
};

var apple1 = new Apple();
var apple2 = new Apple();
apple2.changeColor("green");
apple1.getColor();
apple2.getColor();

...Predpokladal som, že možno prototyp znamenal, že zdieľal ten istý objekt namiesto toho, aby zakaždým iba vytvoril nový objekt - samozrejme to tak nie je, pretože apple1 aj apple2 majú stále odlišné farby (po spustení uvedeného skriptu).

Potom som to napísal tým skôr, čo je to objektovo orientovaný skript:

var Apple = function() {
this.color = "red";

this.changeColor = function(new_color) {
this.color = new_color;
};
this.getColor = function() {
alert("color: "+this.color);
};
};

var apple1 = new Apple();
var apple2 = new Apple();
apple2.changeColor("green");
apple1.getColor();
apple2.getColor();

S úplne rovnakými výsledkami (podľa očakávania). ...Prečo sa tento kód neodporúča? Nemám problém s používaním prototypov (za predpokladu, že som ich použil správne), ale musím pochopiť pojem „prečo“.

...Nejaká pomoc?

odpovede:

31 pre odpoveď č. 1

... predpokladal som, že možno prototyp znamenal, že zdieľal rovnaký objekt namiesto toho, aby zakaždým vytvoril nový objekt ...

Robí. Existuje jeden prototypový objekt, ktorý je zdieľaný medzi všetky inštancie vytvorené z konštruktora.

... to však zjavne neplatí, pretože apple1 aj apple2 majú stále rôzne farby (po spustení uvedeného skriptu).

Pre určité typy (napríklad číslo, logická hodnota, nulová hodnota, nedefinované číslo alebo reťazec), keď zmeníte vlastnosť, ktorá existuje na objekte prototypu, pomocou this.color napríklad vytvorí color majetok na inštancii. Prototyp zostáva nedotknutý, takže nové inštancie budú mať predvolenú farbu definovanú v prototype.

Ak by ste aktualizovali člena poľa alebo objektu, na ktorý sa odkazovalo vlastnosťou prototypového objektu, zmena by sa prejavila vo všetkých inštanciách.

... Prečo sa tento kód neodporúča?

Pretože „rekonštruujete nové identické funkcie s vytvorením každej novej inštancie namiesto zdieľania jednej inštancie funkcií prostredníctvom prototypu objektu.


Aby som to ešte trochu rozšíril, zdôraznil by som, že keď sa vaša funkcia volá ako konštruktor pomocou new kľúčových slov, this v konštruktori je nová inštancia. Takže akákoľvek nehnuteľnosť, do ktorej pridáte this sa pridáva k inštancii.

var Apple = function() {
// Here "this" is the object being constructed. As such, we"re adding
//   a property "rotten" to every instance created
this.rotten = false;
};

// adding a "color" property to the prototype object
Apple.prototype.color = "red";

// set the property "color" on the instance to the value of "new_color"
Apple.prototype.changeColor = function(new_color) {
this.color = new_color;
};
// first check to see if this instance has its own "color" property. If so,
//    use it. If not, look at the prototype object to see if it exists.
Apple.prototype.getColor = function() {
alert("color: "+this.color);
};

// two new instances each have their own "rotten" property, and don"t have a
//    "color" property. Both share the prototype object, so if "color" is
//    requested, it will come from there
var apple1 = new Apple();
var apple2 = new Apple();

// This will add an "color" property to the "apple2" instance
apple2.changeColor("green");

// Doesn"t have a "color" property, so it looks to the prototype object
apple1.getColor();

// Has a "color" property, so it uses that instead of the "color" on the prototype
apple2.getColor();

5 pre odpoveď № 2

prototyp vám umožňuje pridať do triedy metódy a vlastnosti a použije ju nielen na triedu, ale aj na všetky aktuálne inštancie objektov tejto triedy.