Outils pour utilisateurs

Outils du site

Piste:
devweb:javascript (lu 42333 fois)

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision 		Révision précédente
Dernière révision Les deux révisions suivantes
devweb:javascript [18-03-2014 23:17]
edmc73 		devweb:javascript [12-05-2015 11:54]
edmc73
Ligne 82: Ligne 82:
     [doSomething, doSomethingElse, doSomethingUsefulThisTime], 10);</code>     [doSomething, doSomethingElse, doSomethingUsefulThisTime], 10);</code>
 In summary, if you have asynchronous functions that you want to execute syncronously, use callbacks, and if you have synchronous functions that you want to execute asynchronously, use timeouts. In summary, if you have asynchronous functions that you want to execute syncronously, use callbacks, and if you have synchronous functions that you want to execute asynchronously, use timeouts.
 +
 +==== Exemple plus complexe ====
 +
 +Supposons 4 fonctions qui exécutent de l'ajax. On veut exécuter une 5ème fonction uniquement lorque les 4 autres auront bien reçu leur réponse ajax
 +
 +<code javascript>
 +function update_var1(){
 +  updated_var1=false;
 +  $.ajax({...}).done(function(){
 +    // du code
 +    updated_var1=true;
 +  });
 +}
 +</code>
 +Ici on sait que tant que la variable updated_var1 est false, la ré^pnse ajax n'a pas été reçu.
 +
 +Comme on a 4 fonctions, on va créer une fonction regroupant tout ça avec un callback
 +<code javascript>
 +function update_all_var(callback){
 +  update_var1();
 +  update_var2();
 +  update_var3();
 +  update_var4();
 +  
 +  var interval = setInterval(function () {
 +    if(updated_var1 && updated_var2 && updated_var3 && updated_var4){
 +      clearInterval(interval); 
 +      callback();
 +    }
 +  }, 100);
 +}</code>
 +Plutot que de faire une boucle infini qui fait généralement planter le navigateur, on utilise un setInterval qui va ici exécuter une fonction anonyme toutes les 100ms.\\
 +Si nos 4 variables updated... sont true, alors nos 4 appels ajax ont répondu, on arrête l'exécution de l'interval et on exécute la fonction callback.
 +
 +Y'a plus qu'a inclure ce code dans le main
 +<code javascript>
 +update_all_var(function(){
 +  update_resultat();
 +});
 +</code>
  
  
Ligne 88: Ligne 128:
  
   * https://github.com/matthieua/WOW Permet d'animer l'affichage d'éléments qui apparaissent lors d'un scroll   * https://github.com/matthieua/WOW Permet d'animer l'affichage d'éléments qui apparaissent lors d'un scroll
 +
 +===== Réécrire l'url sans recharger la page =====
 +
 +<code javascript>
 +if(history.pushState)
 +  history.pushState({}, '', $(this).attr("href"));
 +</code>
 +
 +===== Les prototypes =====
 +
 +http://blog.xebia.fr/2013/06/10/javascript-retour-aux-bases-constructeur-prototype-et-heritage/
 +
devweb/javascript.txt · Dernière modification: 30-06-2016 10:17 de edmc73

Outils de la page

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki