Signification de prototype en javascript

J'ai essayé de comprendre la signification du prototype en javascript

J'ai écrit un code court d'héritage du lecteur de Personne

<script> /* Class Person. */ function Person(name) { this.name = name; } Person.prototype.getName = function() { return this.name; } var reader = new Person('John Smith'); alert(reader.getName()); </script> 

Quel est le diffrerent, j'ai été supprimer la ligne de Person.prototype.getName = function () {return this.name; } Et créez-le dans l'objet Personne par exemple

 <script> /* Class Person. */ function Person(name) { this.name = name; this.getName = function() { return this.name;} } var reader = new Person('John Smith'); alert(reader.getName()); </script> 

J'ai obtenu le même résultat de getName ()

Lorsque vous mettez quelque chose sur le prototype, chaque instance de l'objet partage le même code pour la méthode. Ils utilisent tous la même instance de fonction.

Lorsque vous mettez simplement une méthode à this , chaque instance d'objet a sa propre copie de la même méthode.

L'utilisation d'un prototype est beaucoup plus efficace. Notez que c'est pourquoi les méthodes sont généralement placées sur le prototype, car vous souhaitez généralement que toutes les instances utilisent la même méthode, mais les propriétés sont placées sur l'instance elle-même, car généralement, vous ne souhaitez pas que toutes les instances partagent les mêmes propriétés.

Pour votre commentaire, si vous mettez une méthode sur la fonction constructeur d'un objet, vous avez effectivement créé une méthode «statique». Aucune instance de l'objet n'aura cette méthode, ils doivent tous accéder à la fonction constructeur. Dans votre cas, Person.someMethod() .

Lorsque vous mettez la méthode dans le constructeur et créez un objet hors de ce constructeur, chaque objet porte sa propre fonction getName . Pour les instances de 10 Person , chacune porte son propre getName , donc 10 fonctions getName distinctes.

Si vous placez getName dans le prototype du constructeur, cette même fonction getName est partagée / héritée dans toutes les instances. Donc, pour 10 instances de Person , chacune a getName mais ne se réfère qu'à 1 fonction getName .

L'utilisation de prototypes permet d'enregistrer la mémoire car la méthode est partagée entre les instances, donc une seule est utilisée.

La différence est que lorsque vous le mettez sur le prototype, toutes les instances de Person partagent le même code pour getName : vous pouvez modifier getName sur toutes les instances de Person en assignant autre chose:

 Person.prototype.getName = function() { return 'Mr Jones' }; 

De plus, puisqu'ils partagent le même code, cela nécessite moins de mémoire: vous ne disposez que d'une seule copie de la fonction getName , au lieu d'une copie par instance.

Une autre différence est que vous pouvez ensuite définir la Person comme le prototype d'une autre classe, disons Man , et il héritera des propriétés / méthodes.

Mise à jour: Voici un bon article expliquant d'autres propriétés des prototypes: https://stackoverflow.com/a/1534286/295262

La différence est que si vous étendez davantage la classe Personne, les sous-classes n'hériteront pas de la méthode getName ()

Modifier: Je n'étais pas correct dans l'énoncé ci-dessus. Juste testé sur jsfiddle. Quoi qu'il en soit, si nous définissons une méthode sur le prototype ou sur l'instance de fonction elle-même, elle est disponible pour les sous-classes de la chaîne.

Voici la preuve: http://jsfiddle.net/u8qrd/

Je comprends qu'il existe un avantage de performance / mémoire pour attacher les méthodes au prototype. Il n'y a pas de différence de comportement en ce qui concerne l'héritage?

(J'espère que je ne suis pas en train de violer les règles SO en posant une question ici)

Dans les mots basés sur la classe, la différence entre déclarer une fonction via un prototype et this serait quelque chose comme ceci:

prototype:

La fonction de l'instance ressemblerait à ceci:

 somefunc = function(){super()/*call the function of the super-class*/}; 

ce:

La fonction de l'instance ressemblerait à ceci:

 somefunc = function(){/* Do same stuff as in the prototype func declared */}; 

Maintenant, changer la fonction sur le prototype n'aura aucun effet sur l'instance.