langue

APPRENDRE JAVA SCRIPT ;-)) http://germanlinux.blogspot.com/2011/05/cours-101-javascript-apprendre.html?m=1

http://germanlinux.blogspot.com/2011/05/cours-101-javascript-apprendre.html?m=1
Le blog d'eric German
Ruby, Rails, javascript, node.js, cloud ,NoSQL bref que des bonnes choses
Contacter le robot germanlinux: german.eric AT gmail.com

dimanche 8 mai 2011

cours 101 javascript: apprendre javascript
ce post n'a pas pour vocation d'etre un tutorial javascript,  mais plutot une série de conseil.
Pour apprendre javascript:
Un livre (gratuit) : Eloquent javascript.
Des sites: suivre le lien.

Bon, commençons par le niveau 0 en javascript.

0: Javascript est un langage interprété, orienté objet.

1: Comment tester votre code javacript ?
Le moyen le plus simple est de l'exécuter dans votre navigateur. Tous les navigateurs intègrent un moteur (interpreteur) javascript (dont le fameux V8 de chrome). Vous pouvez aussi utiliser du javascript en ligne de commande. L'exécution d'un javascript dans un terminal se fait  avec 'js'  qui est un interpreteur javascript en JAVA issu du projet Rhino. Le projet spidermonkey de Mozilla propose lui aussi un 'js' en C. Enfin, le projet node.js propose un serveur d'exécution pour du javascript

2: Comment debugger du javascript.
Réponse simple: utilisez firebug qui est une extension  de firefox. Firebug est indispensable pour un  développeur, c'est le couteau suisse de web.

vous pouvez ajouter l'appel à la fonction alert() pour afficher une popup de mise au point. Mais, il faut prendre l'habitude d'écrire  les messages de mise aupoint sur la console par l'appel  à la méthode  console.log() . Vous pouvez ainsi avoir plusieurs messages en sortie. La console est disponible sur tous les navigateurs

3: Faire un javascript affiché par  un navigateur.
Cela commence par la création d'un fichier d'extension html. Cette page sera minimaliste: une balise de page html et une balise pour le script.
Le test se fera en ouvrant cette page dans un navigateur (fichier/ouvrir) . Cette méthode est suffisante pour commencer. Mais très vite il faudra isoler le javascript dans un fichier différent de celui  la page HTML.

1
2
3
4
5
6
7
<html>
<script type="text/javascript" >
var a;
a= "rien du tout";
console.log(a);
</script>
</html>
view rawpageminimale.html hosted with ❤ by GitHub

le résultat du script sera visible dans la console.

4: La base: les variables et leur portée (scope).
C'est l'élément clé de tous les langages informatiques. C'est lui qui provoque les effets de bords, les régressions de code et qui engendre des heures de recherche dans le code. On fait souvent la distinction entre  une variable globale et une variable locale. Ce classement ne s'applique pas tel quel à javascript.
Rien de plus facile pour créer une variable globale: il suffit de ne pas la déclarer.
ex:
var a= 10 // variable locale
b=10 // variable globale
 
Mais locale à quoi ?  question épineuse (réponse ultérieusement).
Une variable locale de peut etre locale qu'a l'intérieur d'une fonction.

Aussi : toujours déclarer les variables (c'est une bonne habitude).
Un bloc ({ ..} n'isole pas une variable.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
var a;
var b;
a = 5;
b = 1;

function scope(n) {
    a = n;
    var b = a + 1;
    var c = 3;
    console.log("a dans la fonction " + a);
    console.log("b dans la fonction " + b);
    console.log("c dans la fonction " + c);
    if (1) {
        var d = 4; // Le var la déclare comme locale A LA Fonction pas du bloc
        e = 6; // sans le var la variable est globale
        console.log("d dans la sous portee " + d);
        console.log("e dans la sous portee " + e);

    }
    console.log("d dans la fonction " + d);

}

console.log("a avant " + a);
console.log("b avant " + b);
scope(10);
console.log("a apres " + a);
console.log("b apres " + b);
console.log("e apres " + e);
//console.log("d apres  " +d);
//#console.log("c apres " +c); //erreur d 'execution c n'existe plus
view rawjavascript-scope hosted with ❤ by GitHub

Résultat d'exécution :

root@eric-1001PX:~# node essaiscopenode.js
a avant 5
b avant 1
a dans la fonction 10
b dans la fonction 11
c dans la fonction 3
d dans la sous portee 4
e dans la sous portee 6
d dans la fonction 4
a apres 10
b apres 1
e apres 6


5: Le passage de paramètre à une fonction.
C'est aussi un un point critique de programmation. Javascript utilise le passage par valeur pour certains types  de parametre et le passage par réference pour les autres. Les tableaux et les objets sont passés aux fonctions par référence.

Démonstration:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
var a;
var b;
a = 5;
b = "jesuisunechaine";
var tab = [1, 2, 3];

function passageParametre(a, b, tab) {
    a = 9;
    b = "chainelocale"
    tab[1] = 10;
    console.log("a dans la fonction " + a);
    console.log("b dans la fonction " + b);
    console.log("tab dans la fonction " + tab);

}


console.log("a avant " + a);
console.log("b avant " + b);
console.log("tab avant " + tab);

passageParametre(a, b, tab);
console.log("a apres " + a);
console.log("b apres " + b);
console.log("tab apres " + tab);
view rawjavascript-passage hosted with ❤ by GitHub

Résultat :

root@eric-1001PX:~# node essainode2.js
a avant 5
b avant jesuisunechaine
tab avant 1,2,3
a dans la fonction 9
b dans la fonction chainelocale
tab dans la fonction 1,10,3
a apres 5
b apres jesuisunechaine
tab apres 1,10,3

Pour terminer, il faut savoir qu'il n'y a pas d'espace de nommage natif en javascript, c'est au développeur à le prendre en charge.

Avec ces 6 elements vous avez franchi un niveau dans la maitrise du javascript.
eric german
Partager

Aucun commentaire:
Enregistrer un commentaire
Liens vers cet article
Créer un lien



Accueil
Afficher la version Web
Qui êtes-vous ?
Eric German 
Ruby, Rails , javacript , node.js ,python , perl ...
Afficher mon profil complet
Fourni par Blogger
id:[WMT-95212]djouko972 https://docs.google.com/file/d/0B74GQgH9cyVFMFdDRW5wU0g5STQ/preview