Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

Bac Informatique : TIC Tarek Ben Ammar Le langage JavaScript I- Introduction :

Bac Informatique : TIC Tarek Ben Ammar Le langage JavaScript I- Introduction : Le langage JavaScript est un langage de programmation orienté objet permettant d’écrire des scripts embarqués à l’intérieure d’un code HTML qui seras interpréter par le navigateur Il permet de dynamiser une page web (afficher / masquer un test, défiler des images…) On dit que le langage JavaScript est un langage Client/side c'est-à-dire le programme est exécuter par le navigateur. II- Initialisation : 1. Les délimiteurs Pour commencer un script il faut signaler HTML par la balise script et l’attribut langage qui prend pour valeurs JavaScript et le délimiter par la fermeture de cette balise <script language= « JavaScript »> Ecriture du code du script </Script> 2. Les commentaires Les commentaires sont insérés après : // Commentaire Si les commentaires sont écrits sur une seule ligne Ou bien /* commentaire Si les commentaires sont écrits sur plusieurs lignes */ 3. Hiérarchie des éléments JavaScript divise une page web en objets. Il permet d’accéder à ces objets, d’en retirer des informations et les manipuler. Exemple : pour accéder à un bouton radio : window.document.nom_de_formulaire.nom_de_BoutonRadio Bac Informatique : TIC Tarek Ben Ammar 4. Les emplacements du code JavaScript Il est possible de mettre le code JavaScript dans plusieurs emplacements : Dans l’entête (entre <Head> et </Head>) Pour définir des fonctions dés le chargement Entre l’entête et le corps Dans le corps Dans un fichier externe : l’appel de ce code se fait à l’aide de l’attribut src de la balise <script> <script language="JavaScript" src=" fichier.js">……..</script> III- Les variables : Les identificateurs doivent commencer par une lettre ou un( _ ) suivi par des lettres, des chiffres suivis par des lettres. Les variables peuvent se déclarer soit d’une façon explicite (var x=1 ;) soit d’une façon implicite(x=1 ;) 1. les types JavaScript reconnaît les types primitifs suivants : Les nombres : « Number » Il n’y a pas de distinction entre entier et réels. Exemple : 42 ou 3,356 Les booléens : « Boolean » Les mots true (pour vrai) et false (pour faux). Les chaines : « string » Toute suite de caractère comprise entre guillemets. Exemple : "Je vous aime" NULL : window (la page courante) document history document les signets les formulaires Elément de formulaire (les zones de saisies, les boutons radios...) les images les liens location Bac Informatique : TIC Tarek Ben Ammar Mot spécial qui indique l’absence d’une valeur 2. Visibilité des variables a. Variable globale : La variable est visible depuis n’importe quel endroit. Ce sont les variables déclaré au début du script, en dehors et avant toute fonction b. Variable locale : La variable n’est visible que dans la fonction courante. Pour d´déclarer une variable locale `a une fonction il faut utiliser le mot-clé var 3. Conversion de type : La fonction isNaN (): Fonction booléenne permettant de vérifier le contenu d’une variable donnée en paramètre est numérique ou non. Elle retourne true si la conversion est possible et false sinon exemple : x=5 ; isNaN(x) retourne false La fonction eval() : x=eval(variable) Elle permet d’évaluer une chaine de caractère sous forme de valeur numérique ; on peut stocker dans la chaine des opérations numérique, des opérations de comparaison, des instructions et mêmes des fonctions exemple : ch=’5+3’; x=eval(ch);x=8 String et Number: Ces fonctions permettent de spécifier explicitement la conversion à spécifier expl : x=5 et ch= “ 5 ” ;Number(ch)=5 ;string(x)= “5” IV- les opérateurs prédéfinis : Soit x=4 et y=3 dans ce qui suit de cette partie. 1- les opérateurs de calcul : Signe Opération Exemple Résultat + Addition x+y 7 - Soustraction x-y 1 * Multiplication x*y 12 / Division x/y 1,33 % Modulo x%y 1 = Affectation x=y x=3 2- les opérateurs de comparaison : Signe Signification Exemple Résultat == Egalité x==4 true < Inférieure x<4 False <= Inférieure ou égal x<=4 True > Supérieure x>4 False >= Supérieure ou égal x>=4 True != différent x !=4 false 3- les opérateurs associatifs : Signe Nom Exemple && ET (condition 1) && (condition 2) | | OU (condition 1) | | (condition 2) ! NON ! condition Bac Informatique : TIC Tarek Ben Ammar 4- les opérateurs logiques : Signe Signification Résultat Exemple x++ ou ++x Incrémentation y=x++ x=5 x- - ou --x Décrémentation y=x- - x=3 += Addition X+=Y x=x+y X=7 -= Soustraction X-=Y x=x-y X=1 *= Multiplication X*=Y x=x*y X=12 /= Division X/=Y x=x/y X=1.33 %= Reste de la division (modulo) X%=Y x=x%y X=1 V- les entrées sorties : 1. Entrée  à l’aide de la méthode prompt de l’objet window Nom_variable=Window.prompt("message "," valeurs par défaut") ; 2. Sortie À l’aide de la méthode alert de l’objet window Window.alert (" message "+nom_variable) ; À l’aide de la méthode write de l’objet document document.write (" message "+nom_variable) ; La méthode confirm() est similaire à la méthode alert(), si ce n'est qu'elle permet un choix entre "OK" et "Annuler". Lorsque l'utilisateur appuie sur "OK" la méthode renvoie la valeur true. Elle renvoie false dans le cas contraire...Elle admet comme alert() un seul paramètre: une chaîne de caractères... Ok=Window.confirm (" message ") ; VI- les structures de contrôles 1. les structures conditionnelles Les structures conditionnelle sont utilisé quand il y a une condition imposer par le problème (implicitement ou explicitement) deux traitement(ou plus) différentes selon la validité de l’expression ou de la condition a. la structure if Permet de réalise une instruction conditionnelle. Deux formes syntaxiques possibles : Simple choix : if (condition) {instruction-ou-bloc ;} //forme réduite Double choix : if (condition) {instruction-ou-bloc1 ;} else {instruction-ou-bloc2 ;} Autre forme de double choix : Bac Informatique : TIC Tarek Ben Ammar (expression) ? instruction1 :instruction2 ; Si l’expression entre parenthèse est vraie, l’instruction1 est exécutée. Si l’expression entre parenthèse est fausse, l’instruction2 est exécuté. b. la structure Switch C’est un branchement multiple permettant d’exécuter des instructions s´sélectionnées par la valeur d’une expression. En effet selon la valeur d’une expression on a différent choix d’instruction. Switch (variable) { Case valeur_1 : instruction-ou-bloc1 ; break ; Case valeur_2 : instruction-ou-bloc1 ; break ; Case valeur_n : instruction-ou-bloc1 ; break ; Default : instruction-ou-bloc1 ; break ; } L’instruction break permet d’arrêter l’exécution du reste du code Switch après l’exécution du bloc convenable. Si la valeur de la variable de Switch n’existe dans aucunes valeurs des cases, alors c’est l’instruction de default qui sera exécuté (cette instruction est facultative). 2. les structures itératives Les structures itératives sont utilisées dans le cas où on a un traitement (une instruction ou bloc d’instructions) qui doit s’exécuté répétitivement un nombre de fois que ce soit connue ou non connue. a. la structure for C’est une structure itérative complète c'est-à-dire dont en connaît d’avance le nombre d’itération du fait la connaissance du début et de fin de l’itération for (initialisation ; condition d’arrêt ; progression) { instruction-ou-bloc1 ; } Avec : initialisation : c’est une initialisation du compteur de nombre d’itération condition d’arrêt : c’est la condition d’arrêt du boucle for c'est-à-dire arrêt du compteur d’itération progression : c’est l’incrémentation du compteur définissons le pas du compteur b. la structure do…while C’est une structure itérative incomplète c'est-à-dire dont on ne connaît pas le nombre d’itération en avance. Cette structure ressemble ; en langage pascal ; à la structure repeat …until. Do { instruction-ou-bloc1 ; } While (condition) L’instruction ou le bloc d’instruction s’exécute tant que la condition est vraie. En effet cette condition est une condition de continuité, contrairement à la structure repeat…until en pascal. c. la structure while C’est une structure répétitive incomplète. while (condition) { instruction-ou-bloc1 ; } Bac Informatique : TIC Tarek Ben Ammar Tant qu’une certaine condition est vérifiée une instruction ou un bloc est exécuté. VII- les fonctions en JavaScript 1. Les fonctions prédéfinis en JavaScript Soit : ch= « bonjour » fonction Signification Instruction Résultat charAt(i) Caractère de l’indice i Ch.charAt(3) j charCodeAt(i) Code ASCII du caractère correspondant à l’indice i Ch.charCodeAt(3) 106 Ch+= ch1 Concaténation de ch1 à ch. Ch+= " tout le monde" Bonjour tout le monde indexOf(c) Index de la 1ére occurrence à partir de l’indice i Ch.indexOf ("ou") 4 indexOf(c,i) Ch.indexOf ("ou",5) 9 lastIndexOf(c) Index de la dernière occurrence à partir de l’indice i (recherches arrière) Ch.lastIndexOf ("ou") 9 lastIndexOf(c, i) Ch.lastIndexOf ("ou",8) 4 Slice (d, f) Sous chaine qui commence à partir de la position d jusqu'à la position f Ch.slice(3,7) Jour Substr (d, l) Sous chaine de longueur l commençant par la position d Ch.substr(3,7) Jour to toUpperCase () Donner la chaine majuscule Ch.toUpperCase () BONJOUR TOUT LE MONDE toLowerCase() Donner la chaine minuscule Ch.toLowerCase () bonjour tout le monde Fontcolor (‘couleur’) Insérer la chaine encapsuler dans <font color= « couleur »>...</font> Ch.fontcolor (‘red’) Bonjour tout le monde Remarque : Une chaine de caractère commence par la position 0 Dans le cas des méthodes IndexOf et substr ne trouve pas une chaine elles retournent -1. Si la chaine est vide length retourne 0. Les méthodes de l’objet Maths : Méthode Exemple Resultat Math.abs(x) Y= Math.abs(-5) Y=5 Math.round(x) Y= uploads/Ingenierie_Lourd/ le-langage-javascript-i-introduction.pdf