Remerciez-le!

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

CHAPITRE I : Production électronique avancée MR G.AHMED P a g e 1 | 14 I. Intro

CHAPITRE I : Production électronique avancée MR G.AHMED P a g e 1 | 14 I. Introduction: Qu’est-ce que le JavaScript ? Le JavaScript est une extension du langage HTML qui est incluse dans le code. Ce langage est un langage de programmation qui permet d'apporter des améliorations au langage HTML en permettant d'exécuter des commandes, il permet de rendre les pages web plus interactives. Le code JavaScript est interprété par le navigateur client et n’a aucune interaction avec le serveur. C’est un langage de programmation de scripts orienté objet qui permet de manipuler des objets qui possèdent des caractéristiques (propriétés)ainsi que des manières de les utiliser(méthodes). Le langage fournit des objets de base comme des images, des dates, des chaînes de caractères, la fenêtre de navigation… Le langage JavaScript est parfaitement adapté pour des traitements sur le poste du navigateur. Quelques exemples : o Vérification de saisie dans des formulaires (Adresse, email). o Calculs simples suite à des saisies de formulaire (Tarifs, calculatrice). o Gestion des dates et des heures (Date du jour, Date de mise à jour, Calendriers). o Gestion des cookies (Sauvegarde d'information : nombre de visites). o Gestion de la navigation (Menus dynamique, popup). o Animations graphiques (bannières, jeux, ..) o ….  JavaScript est sans relation directe avec Java, malgré que sa naissance est inspirée du langage Java Emplacement du code JavaScript : Le code JavaScript peut être insérer à plusieurs endroits : o Le plus souvent dans la page HTML elle-même. o On peut insérer du code JavaScript en faisant appel à un fichier externe qui a pour extension(.js). Il y a plusieurs endroits dans une page web où il est possible d'intégrer du code JavaScript :  Dans le corps de la page.  En entête de page.  Dans un événement d'un objet de la page. Pour inclure du JavaScript dans une page HTML, on utilise La balise <SCRIPT language="Javascript"> /*Placez ici le code de votre script */ </SCRIPT> PAGES WEB STATIQUES CHAPITRE I : Production électronique avancée MR G.AHMED P a g e 2 | 14 <html> <head> <title>Javascipt</title> </head> <body> <script language="javascript"> alert("Bonjour tout le monde!"); </script> </body></html> On saisit le code JavaScript dans le corps de notre document html. <html> <head> <title>Javascipt</title> <script language="javascript"> alert("Bonjour tout le monde!"); </script> </head> <body> </body></html> On saisit le code JavaScript dans l’entête de notre document html. <html> <head> <title>Javascipt</title> <script language="javascript"> function affiche() { alert("bonjour tout le monde!!");} </script> </head> <body> <a href="" onclick="affiche()" > Cliquer ici!</a> </body></html> Le code JavaScript s’exécute en cliquant sur le lien hypertexte. <html> <head> <title>Javascipt</title> </head> <body> <script language="javascript" src= ‘’fich.js’’> </script> </body> </html> le code JavaScript exécuter se trouve dans un fichier externe nommé fiche.js CHAPITRE I : Production électronique avancée MR G.AHMED P a g e 3 | 14 II. Programmer en JavaScript : Pour réussir votre code JavaScript, il faut savoir que : o JavaScript est extrêmement sensible à la casse, il faut respecter la majuscule et la minuscule. o Bien que ce n’est pas obligatoire mais chaque commande doit être terminée par un point-virgule (;). o En JavaScript un nombre à virgule doit être séparés par un point (.). Exemple : var pi=3.14 ; o On peut ajouter des commentaires dans le script en utilisant : //voici un commentaire ou bien /*Voici un commentaire*/ o JavaScript permet de manipuler des objets (window, document, button, string, math, date, navigator, …) 1) LES VARIABLES ET TYPES DE VALEURS JAVASCRIPT : a) Les types de valeurs : Le langage JavaScript reconnaît plusieurs types de valeurs :  Les nombres entiers ou à virgule flottante comme "42" ou "3.14159".  Les valeurs logiques (Booléennes), true (vrai) et false (faux).  Les chaînes de caractères comme "Bonjour !".  Null, un mot-clé spécial symbolisant une valeur nulle.  Undefined, est une propriété dont la valeur est non définie. b) Déclaration et affectation : Le mot-clé var permet de déclarer une ou plusieurs variables. Après la déclaration de la variable, il est possible de lui affecter une valeur par l'intermédiaire du signe d'égalité (=). Exemple : //Déclaration de i, de j et de k. var i, j, k; //Affectation de i. i = 1; //Déclaration et affectation de prix. var prix = 0; //Déclaration et affectation d’une chaine de caractère var ch = "bnjr"; Remarque : Le nom d’une variable doit obligatoirement commencer par une lettre ou un underscore (_), ne doit pas commencer par un chiffre et ne doit contenir que des lettres, des chiffres et des underscores mais pas de caractères spéciaux. Le nom d’une variable ne doit pas contenir d’espace.  Une particularité du langage JavaScript est d'avoir des variables sans type (untyped), c'est-à-dire que le type comme les nombres entiers ou à virgule flottante, est automatiquement affecté à la variable. Exemple : /* i est du type entier. */ var i = i + 1; /*taux est du type réel. */ var taux = 0.66; /*texte est du type string. */ var texte = "Une chaîne de caractère quelconque"; CHAPITRE I : Production électronique avancée MR G.AHMED P a g e 4 | 14  Eviter d’utiliser les mots réservés à JavaScript comme nom des variables. Voici une liste de ces mots : Application1 : créer un script qui permet d’afficher les types des variables. c) Les opérateurs prédéfinis :  Les opérateurs arithmétiques : +, -, *, / et % (modulo). typeof : est une fonction qui permet de retourner le type d’une variable. document.write : write() est une méthode de l’objet document qui permet d’écrire dans le document html. + : permet de concaténer une chaine avec le contenue d’une variable. CHAPITRE I : Production électronique avancée MR G.AHMED P a g e 5 | 14 Si l'un de ses opérateurs est placé avant la variable, alors la valeur de la variable sera incrémentée (++) ou décrémentée (--) avant son utilisation. Par exemple pour i=0, i++ donnera 0 et ++i donnera 1 de même que i-- donnera 0 et --i donnera -1  Les opérateurs de comparaison :  Les opérateurs d’affectation :  Les opérateurs logique(booléen) : opérateurs nom rôle syntaxe || OU logique Vérifie qu'une des conditions est réalisée ((condition1)||(condition2)) && ET logique Vérifie que toutes les conditions sont réalisées ((condition1)&&(condition2)) ! NON logique Inverse l'état d'une variable booléenne (retourne la valeur true si la variable vaut false, false si elle vaut true) !(condition) Application2 : écrire un script qui permet d’afficher la somme de deux entiers x et y. CHAPITRE I : Production électronique avancée MR G.AHMED P a g e 6 | 14 Le fichier app2.js contient le script suivant : Remarque :  Number() : Cette fonction convertit l'objet spécifié en valeur numérique.  isNaN() : Cette fonction évalue un argument pour déterminer s'il ne s'agit pas d'un nombre (NaN : Not a Number). Elle retourne true ou false.  prompt() :c’est une méthode de l’objet window qui permet de saisir des données à travers une boite de dialogue.  alert() :c’est une méthode de l’objet window qui permet d’afficher un message dans une boite de dialogue.  \n : permet de faire un saut de ligne dans un message d’une boite de dialogue. Number() ne fait pas la différence entre entier et nombre décimal alors autre solution : Remarque :  parseInt() : Cette fonction analyse une chaîne de caractères et retourne un nombre entier de la base spécifiée sinon renvoie NaN (Not a Number).  parseFloat() : Cette fonction analyse une chaîne de caractères et retourne un nombre décimal sinon renvoie NaN (Not a Number). Exemple : var prix=30.5 ; var x= parseInt(prix) //renvoie x=30 CHAPITRE I : Production électronique avancée MR G.AHMED P a g e 7 | 14 2) Les chaines de caractères : les chaines de caractères sont gérer par l’objet String en JavaScript, une chaine de caractère est une suite de caractère encadré par des guillemets ou apostrophes et son premier caractère possède la position 0. ch L’objet string possède une seule propriété celle qui permet de retourner la longueur de la chaine. Exemple : var n=ch.length ; on obtient n=7. Les méthodes de l’objet string : Méthodes Rôle Exemples ch.charAt (position) Retourne le caractère situé à la position donnée en paramètre Var ch= “bnjr” ; Ch.charAt(0) donne “b” ch.indexOf (“sous_chaine”) permet de retourner la position de la première occurrence d’un caractères ou d’une chaine de caractères dans une chaîne de caractères de base sinon elle retourne -1. Var ch= “bnjr” ; Ch.indexOf(“b”) donne 0 Ch.indexOf(“a”) donne -1 ch.substring(position1, position2) Retourne une sous-chaîne de la chaîne courante à partir d’un indice de départ. L’indice d’arrivé est facultative. var ch= “bnjr” ; ch1=substring(2) ; donne “jr” ch2=substring(0,1) donne “bn” ch. toLowerCase() Convertit tous les caractères d'une chaîne en minuscule var ch= “bNjR” ; ch=ch. toLowerCase() donne “bnjr” ch. toUpperCase() Convertit tous les caractères d'une chaîne en majuscule var ch= “bNjR” ; ch=ch. toLUpperCase() donne “BNJR” .charCodeAt(0) Permet de retourner le code ASCII d’ caractère. "A".charCodeAt(0) donne 65 String.fromCharCode(x) Permet de retourner le uploads/S4/ ch3-tic.pdf