Un petit message en passant :

Je regarde pas mal sur internet et sur des docs javascript ces derniers temps pour arriver à pouvoir utiliser des objets, les faire hériter, avoir l’équivalent de l'utilisation de "super" dans java...

Ce n'est pas forcément facile de trouver des docs qui soient bien écrites c'est à dire accessibles... Enfin, il me semble avoir trouvé enfin !

.. Ceci sans utiliser des bibliothèques supplémentaires puisque mon objectif n'est pas seulement de trouver une façon qui fonctionne mais aussi de comprendre les outils que j'utilise !

... et d'avoir un code le plus simple et le plus clair possible.

... donc je teste ça et j'en recause ici bientôt !



P.S. et désolé Makio135 d'avoir oublié de te remercier de ta réponse !

Dernière modification par EricRG (2016-05-30 18:20:11)

Et l'eau !,

Finalement, ce que je trouve le plus intéressant et le plus simple est ce qu'il y a sur ce site : https://javascript.info/



Pour utiliser des objets, ce que j'ai trouvé de plus simple (dans le sens de compréhensible, sans bibliothèques annexes avec un code simple) est :
ceci : https://javascript.info/tutorial/pseudo … al-pattern

(simple = aussi simple que possible )

La seule "bibliothèque" à ajouter est :

And finally, the whole suppa-mega-oop framework.

01
	function extend(Child, Parent) {
02
	  Child.prototype = inherit(Parent.prototype)
03
	  Child.prototype.constructor = Child
04
	  Child.parent = Parent.prototype
05
	}
06
	function inherit(proto) {
07
	  function F() {}
08
	  F.prototype = proto
09
	  return new F
10
	}

D'ailleurs, je n'ai pas encore  compris pourquoi, dans la fonction inherit(proto) on a return new F ! Pourquoi return F ne suffit pas ?

Je n'ai pas encore eu le temps de vraiment m'interroger là-dessus !

P.S. je reviendrai pour faire la liste des autres choses que j'ai trouvées (et regardées puisque il y a pléthore d'informations !)

Dernière modification par EricRG (2016-05-31 15:00:18)

Ca y est !!!!!!!!!!!

j'y suis ENFIN arrivé !!!!!!!!

Voici, ci-dessous, mon code de test qui fonctionne enfin sans générer aucun message d'erreur dans la console web.

Maintenant (qu'il me semble) avoir compris ce dont il retourne dans l’organisation de javascript, je ne trouve plus cela compliqué du tout !!! En fait, je trouve plutôt que ce sont les explications que l'on trouve ici ou là qui le sont. C'est comme si les programmeurs habitués aux systèmes de Classes et d'Instances avaient du mal à vraiment comprendre le système par prototypes et qu'ils ,'arrivaient pas du coup à l'expliquer !!!

Je vais essayer de pondre ma propre explication. Je la mettrai par ici et vous pourrez me dire ce que vous en pensez.

Le code d'essai :

"use strict" // Indispensable pour que javascript donne des informations correctes dans la console web en cas d'erreurs

function extend(Child, Parent) {
  Child.prototype = inherit(Parent.prototype);
  Child.prototype.constructor = Child;
  Child.parent = Parent.prototype;
}

function inherit(proto) {
  function F() {};
  F.prototype = proto;
  return new F();
}


function Animal(nom) { // "Constructeur" de la  "Classe" Animal
    this.nom=nom;
    this.genre="Animal";
}

Animal.prototype.action=function () { // méthode de la "Classe" Animal
        alert(this.nom+" avance ! ("+this.genre+")");
}

Animal.prototype.genre="Animal.prototype"; // Variable dans l'objet Animal.prototype

var unAnimal=new Animal("un cerf"); // new fabrique une copie de l'objet Ainimal et l'exécute donc passe les paramètres : "un Cerf" dans this.nom

unAnimal.action(); // pas de "méthode" action() dans unA,imal, donc la trouve dans son prototype qui est l'objet Animal.prototype

function Chat(nom) {
    Animal.call(this,nom); // le "super" : exécute le "constructeur" de Animal dans le contexte du nouvel objet Chat (=this)
    this.genre="Chat"; // cette variable genre se trouve dans l'objet Chat
}

extend(Chat,Animal); // le protoype du prototype de Chat devient le prototype de Animal : Chat---(prototype)--->Chat.prototype-----(prototype)----->Animal.prototype

Chat.prototype.action=function () {
    Animal.prototype.action.call(this); // le "super" de la "méthode"
    alert("en miaulant !");
}

var unChat=new Chat("Peluche");

// unChat---(prototype)--->Chat.prototype-----(prototype)----->Animal.prototype

Chat.prototype.genre="chat.prototype";

unChat.action();

var chat2=new Chat("Minnie");

chat2.genre="chatte"; // ce genre se trouve uniquement dans l'objet chat2 lui-même

chat2.action();

Dernière modification par EricRG (2016-06-06 15:20:39)

.... genre  ="genre.prototype"

Il y a des guillemets !!!!  C'était juste pour savoir quel objet précis est pris en compte pour la réponse !

(je réponds au reste de ton message dès que je peux là je n'ai que cinq minutes   )

Ca y est, j'ai lu ton code.   

L'objet de ma petite recherche était de trouver une façon de faire de "l'héritage de Classe" avec Javascript.

Alors, évidemment, il n'y a pas de classes en Javascript mais un système de prototypes ce qui est complétement différent. Tous les objets sont dynamiques, en mémoire et modifiables à tout moment.

Il est possible de garder les concepts de Classes et d'instances pour programmer en javascript à condition de bien comprendre comment fonctionne le système par prototypes.

Tu n'utilises pas la fonciton extend() donc tu es obligé de recréer la "méthode" action() ( je mets bien le mot méthode entre guillemets : c'est une fonction que j'utilise en tant que méthode par référence à la façon de programmer par Classes/Instances comme dans Java ou autre). Alors, même si tu recrée la "méthode" action()  dans l'obejt Chat en utilisant la méthode action() de l'objet Animal.prototype, tu es quand même obligé de la recréer dans Chat. Imagine si tu as une dizaine de "méthodes" à recréer ainsi !!! De même, imagine que tu doive rajouter à un code existant, une "méthode" dans la "classe parente" pour que tes "classes" filles déjà écrites en bénificient : tu devrais les recréer dans toutes les "classes filles".

L'utilisation de cette fonction extend() n'est pas la seule façon de s'y prendre. Il semble qu'il y ait une fonction Objetct.create() qui peut être utilisée mais elle ne fonctionne pas partout.... et il y a peutêtre encore d'autres façons de s'y prendre.

Alors, d'après d'autres informations que j'ai pu voir, en Javascript, il n'est pas nécessaire d'utiliser les concepts de l'héritage etc puisque n'importe quelle fonction peut être appelée dans n'importe quel contexte avec les fonctions call et apply.

C'est une question de choix.

Pour ma part, je souhaite programmer en Javascript avec les concepts de Classes etc car, j'aurais tendance à formuler mes obejts en utilisant UML puis en programmant en Javascript (avec P5.js) et/ou en Java (avec Processing) (tout en gardant les même shémas UML pour m'y retrouver).

------------------------------

Dans Javaxript, on pourrait (en s'y prenant comme dans mon exemple) écrire que :

uneInstanceDeLaClasseTruc-----(prototype)---->ClasseTruc.prototype-------(prototype)----->ClasseParenteDeTruc.prototype

En se rendant compte que : uneClasse.prototype va contenir les valeurs par défaut des variables + les méthodes de la "Classe" mais pas le constructeur qui lui se trouve dans l'objet uneClasse proprement dit (et d'ailleurs dans toutes les instances puisque new crée une copie de uneClasse )

Si on veut pousser le bouchon plus loin pour que le code du constructeur soit aussi dans uneClasse.prototype on pourrait écrire un code de ce genre :

function Machin(<arguments éventuels>) {
_constructeur(<arguments éventuels = les même !!!>);
}

var Machin.prototype._constructeur = function(<...>) {
-------le constructeur ici-----
}

Le caractère souligné _ devant une fonction ou une variable indiquant au programmeur qu'il s'agit d'une variable ou méthode privée/protégée (même si elle 'nest pas réellement privée /protégée pusique qu'on peut l'utiliser techniquement quand don veut).

Bon, mais le gain en mémoire ne justifie pas forcément cette petite complication du code.

Remarque : je sait qu'il existe un attiribut constructor mais je n'ai pas encore bien compris cet aspect !

Coucou,

je pense qu'il y a plusieurs "bonnes façons" de s'y prendre !

Je vais étudier ton message précédent et je reviens

Salut,

Tous les arguments passé à une fonction sont dans l'objet arguments
ex :

function affiche(){
  for(i in arguments) alert(i);
}