11521 sujets

JavaScript, DOM et API Web HTML5

bonjour
Je trouve que php et javascript bien qu'étant des langages faible/ non typé se comportent très différement concernant le type des objects , le contexte et la mémoire ( type de la variable et valeur) .
question memoire
Il semble qu il n existe pas d 'API pour gérer la mémoire ou passer une variable par référence.
1-Comment se fait le passage de valeur en argument de fonction ( valeur et pas référence ).
2-Est que mettre la valeur d'une variable a "" , null , undefined lance le garbage collector ?
3-Qu'est ce qui lance le garbage collector ?
4-Comment Jquery gère t il la mémoire ?


question sur nommage des arguments d une fonction
pourquoi utiliser les arguments si les variables sont globales ?
sur
http://www.alsacreations.com/article/lire/578-La-gestion-des-evenements-en-JavaScript.html
il y a le code suivant
function envoiForm(event) {
if (this.elements.adresse.value === "") {
alert("L'adresse est vide.");
event.preventDefault();
}
}
Que représente le terme event pour le moteur javascript ?
ce terme pourrait s'écrire event1 ? si oui comment le moteur javascript sait que event1 est de "type" Event et donc que preventDefault() existe ? . Est ce lors de l'éxécution que par la façon d'appeler la fonction que le moteur javascript connait le sens de event ?
<p id="p" onclick="envoiForm(event);">
le nom event est il le même pour chaque navigateur ?
est ce le terme onclick qui informe le moteur javascript que le 1er argument de la fonction sera toujours de type Event ? pourrais t on ecrire
<p id="p" onclick="envoiForm(event1);">
cordialement
Modifié par 75lionel (02 Aug 2015 - 15:54)
Administrateur
Oui en effet PHP et JavaScript sont très différents, il est bien difficile de les comparer et leur gestion de la mémoire bien qu'empruntant des concepts similaires aux langages "traditionnels" ne répond pas aux mêmes besoins.

Pour le point 1, cela dépend du type des données que l'on passe. Les objets sont passés par référence. Et comme les fonctions, les tableaux sont des objets cela s'applique aussi dans leur cas. Plusieurs tutoriels existent à ce sujet sur le web et l'expliqueront mieux qu'un résumé ici.

Pour les points 2+3 cela dépend du moteur qui va interpréter et/ou optimiser le code, et du contexte. Chaque navigateur dispose de son moteur d'interprétation JavaScript. Les valeurs "" , null , undefined sont des... valeurs tout à fait conventionnelles et dignes d'être stockées, par contre on peut effacer des membres d'objets avec delete par exemple.

Pour le point 4, jQuery ne gère pas directement la mémoire puisqu'il s'agit d'un framework construit sur JavaScript et qu'il n'a pas accès à ses méthodes de bas niveau, mais il utilise quelques bonnes pratiques (établies au fur et à mesure des années et diluées partout dans le code) pour ne pas gâcher la mémoire inutilement. Ce qui n'empêche pas d'en faire n'importe quoi.

Pourquoi utiliser les arguments si les variables sont globales ? Parce que ce n'est pas la même chose. Toutes les variables ne sont pas forcément globales, cela dépend là aussi du contexte dans lequel elles ont été initialisées et de l'emploi du mot-clé var.

Dans le cas de l'exemple, la variable "event" est locale à la fonction, et n'influe pas sur le reste du code (qui pourrait comporter une autre variable du même nom. Ceci reste à peu près équivalent aux autres langages. Son nom est purement arbitraire, on peut tout aussi bien utiliser "e", "event1", ou "bidulemachin" pour réceptionner un événement JavaScript. Le navigateur "sait" qu'il doit remplir ce premier argument dans la fonction de callback (qui traite l'événement) par un objet de type Event, mais il ne se soucie pas du nom qu'on lui donne.
salut,
je ne pense que JavaScript puisse offrir un accès à la gestion de mémoire, ce n'est pas le genre de langages où tu devras te soucier de ce genre de choses. Tu peux cependant faire en sorte de ne pas utiliser des variables à tout va : un bon exemple est le stockage de données provisoires que tu n'utiliseras qu'une seule fois.
Le passage de variables par référence n'est également pas un soucis dans le mesure où une variable déclarée dans un contexte global (ou "supérieur / extérieur") à la fonction dans laquelle tu vas l'utiliser, sera modifiable directement sans qu'elle ne soit passée en argument.

function foo(){
   x = 8;
}

var x = 2;

foo();

alert(x);  // Affiche 8


1 - Lorsque tu passes une valeur à une fonction et que tu la récupères en argument, le nom de l'argument choisi (qui est en somme une variable) sera considéré comme une variable locale à la fonction dans laquelle tu vas l'utiliser. C'est à dire que même si tu choisi le nom d'une variable déjà déclarée dans un contexte supérieure, cela n'aura aucune incidence :

function foo(x){
   x = 8;
}

var x = 2;

foo();

alert(x);  // Affiche 2

Pour travailler avec des valeurs par référence, il suffit de faire comme dans le premier exemple.

2-3-4 Je pense que c'est assez claire comme explications.

Je pense que la question concernant l'utilisation d'arguments alors que les variables sont globales sort un peu du "rationnel". Les deux choses n'ont pas réellement de relation concrète. Les arguments auront toujours leur utilité (ce ne sont pas les exemples qui manquent) et comme déjà expliqué, toutes les variables ne sont pas forcément globales.

Quant à l'objet Event, il est passé automatiquement à la fonction traitant l'évènement (pas seulement le click). Il existe des tas d'autres évènements en JS et tu n'as pas besoin de passer cet argument lorsque tu relie une écoute d'évènement à la fonction le traitant. Tu peux bien évidemment donner le nom que tu veux, tu récupéreras toujours un objet Event.
En fait, dans tous les navigateurs majeurs sauf Firefox, il n'est même pas nécessaire d'ajouter l'argument pour pouvoir le récupérer, cela se fait automatiquement sous le nom "event".

document.addEventListener("click", function (){
   alert(event); // Affichera [object MouseEvent] ou [object MSEventObj]
}, false);
Merci beaucoups pour vos réponses et surtout la notion de porté des variables passés en argument d'une fonction .



Dans le cas d'un environnement browser ( window /Frameset pas nodejs) ..Y a t il d'autres exemples ( jquery) ou le premier argument est ou peu être implicite ?

 A ( call hidden event  name ...anonymous ? ) 
function envoiForm([#red]event[/#]) {  event.preventDefault();}}
function envoiForm() {  event.preventDefault();}}
/*event n est il pas le second arguments implicite après this=windows  ?  n'a de sens que si attaché inline dans le code html en utilisant un gestionaire d'évènement onclick ....onBlur, onChange, onFocus ..........*/



 B ( force context  this to window ... ) 
function anyfunctionName.call(window,a,b) { alert("L'adresse est vide."); }
function anyfunctionName(a,b) { alert("L'adresse est vide."); }


C JQuery ( a étudier) mais il me semble que
c1 la mémoire est le DOM
c2 forEach de jquery semble avoir des arguments prédéféni auquels on donne un nom pour pourvoir l utiliser
c3 JQuery memory http://javascript.info/tutorial/memory-leaks#jquery-anti-leak-measures-and-leaks


=============================================
sinon voila l'explication ( la façon dont je comprend le ) code donné pour example par @Zelalsan

  1  function foo(){    x = 8;}
var x = 2;
foo();
alert(x);  // Affiche 8
/*signifie t il que l appel de foo créer ( initialise) une variable global x  qui comme elle existe déja ( initialiser par var x=2; ) en vérité jour le role d affectation  !!! **/


si le code avait été
  2  function foo(){    var x = 8; /*ajout de var */} 
var x = 2;
foo();
alert(x);  // Affiche 2
/* la variable x dans foo reste local caché dans { } car on utilise var qui reserve de l espace mémoire avec la valeur par defaut undefined initialisé a 8 ( 1ere affectation) et alert ne connait que la variable global x=2 */



Pour le code avec la variable x en argument ; comment se fait il qu il est possible d appeler une fonction défini avec un argument sans argument ?
ok j ai compris la logique derrière ceci ?
polypmorphisme java http://beginnersbook.com/2013/03/polymorphism-in-java/
polymorphisme javascript http://javascript.info/tutorial/arguments


 3 
function foo(x){   x = 8;} 
foo();
/*x en arguments signifie function foo(x){   var x , x = 8;} 
au lieu de var x ,  function foo(x){   x = 8;} 
les 3 termes "x" utilisent(a)  /existent(est) dans   le même espace mémoire et emplacement   local a foo {*}!!! ceux sont des alias !!! 
*/


comprendre un language est comprendre la partie implicite du language ou comment il a été implémenter !!!
Modifié par 75lionel (03 Aug 2015 - 23:04)
This est un mot-clé et non un argument. Sa valeur sera toujours relative à l'objet ayant appelé la fonction et il ne se réfère pas forcément à window (d'ailleurs quand tu débutes, dans la plupart des cas quand il se réfère à window c'est là où tu commences à t'arracher les cheveux Smiley langue ).


function foo(){
   alert(this);
}

foo(); // Affichera [object Window]

var obj = {};

obj.foo = foo;

obj.foo(); // Affichera [object Object] qui est en réalité l'objet "obj"

Si tu veux forcer le contexte de this à un objet précis, tu devras préférer la méthode bind.

function foo(){
   alert(this);
}

foo(); // Affichera [object Window]

var obj = {};

obj.foo = foo;

obj.foo.bind(window)(); // Affichera [object Window]

Tu peux ajouter des arguments en les passant après l'objet sensé représenté this

function foo(arg1, arg2){
   alert(this +":"+ arg1 +":"+ arg2);
}

var obj = {};

obj.foo = foo;

obj.foo.bind(window, "arg1", "arg2")();


JQuery n'est pas un langage est n'est qu'un simple framework basé sur JavaScript. Le lien que tu donnes parle de la gestion interne à JQuery et n'est en rien une gestion liée au langage JavaScript. De plus, il fait référence à des navigateurs morts et enterrés.

Pour les questions que tu te poses par rapport aux exemples :
1 - C'est exactement ça.
2 - C'est exactement ça.
1 - "x" en argument signifie que cette variable sera locale à la fonction.
Merci pour les précisions
un lien sur un article de lea verou et les commentaires sur le contexte d 'utilisation et de l'enseignement de jquery .
Modifié par 75lionel (13 Aug 2015 - 23:20)