I Introduction au langage II Le formalisme de

  • Slides: 20
Download presentation
I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script Module : Javasciprt IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation Objectif: Programmer et intégrer des scripts dans une page Web

I- Introduction au langage PLAN II- Le formalisme de base III- Les Objets Java.

I- Introduction au langage PLAN II- Le formalisme de base III- Les Objets Java. Script I- Introduction au langage Java. Script : 1. Les limites du langage HTML IV- Les Variables 2. Les solutions proposées 3. Historique du langage Java. Script V- Opérateurs prédéfinis n II- Le formalisme de base du Java. Script: n III- Les Objets Java. Script : VI- Les Entrées/Sorties 1. Les objets Jav. Script et leurs hiérarchies 2. Les différents emplacements du code Java. Script VII- Struc. de contrôle n IV- Les Variables : V- Les opérateurs prédéfinis : VIII- Les n Fonctions n VI- Les Entrées/Sorties en Java. Script : VII- Les Structures de contrôle : IX-Gestionndes événements n VIII- Les Fonctions en Java. Script : n IX- La Gestion des événements en Java. Script : X- Les Formulaires n X- Les Formulaires en Java. Script: n Recommandation

I- Introduction au langage Java. Script : I- Introduction au langage II- Le formalisme

I- Introduction au langage Java. Script : I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements Activité 1: n I-1. Les limites du langage HTML Absence des structures de contrôle Un langage sans aucune logique de programmation procédurale (sous programmes, variables, opérateurs…) Absence de prise en charge d’événements, à l’exception de l’événement clic. Aucune communication avec la plate forme d’exécution (date système, type du navigateur, etc. ) Absence de possibilité d’interfaçage avec les bases de données. Absence de mécanisme permettant de rendre le code source inaccessible pour l’utilisateur final (pour visualiser le code, il suffit d’utiliser l’option affichage code source du navigateur). X- Les Formulaires Recommandation Limites Solutions Historique

I- Introduction au langage Java. Script : II- Le formalisme de base III- Les

I- Introduction au langage Java. Script : II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions n I-2. Les Solutions proposées : Deux Solutions (utilisé un langage coté Client ou langage coté Serveur) Langage coté client (Java. Script ou Vb. Script) : ce sont deux langages qui permettent d’ajouter des fonctionnalités omises par le langage HTML, (Les fonctionnalité qui concernent la connexion aux BD et l’accessibilité au code source ne sont pas supportées par ces langages). Langage coté Serveur (ASP, PHP) : ces langages permettent d’avoir les mêmes fonctionnalités que les langages coté client plus la possibilité de se connecter à la bases de données et le verrouillage du code source. IX-Gestion des événements X- Les Formulaires Recommandation Limites Solutions Historique

I- Introduction au langage Java. Script : II- Le formalisme de base III- Les

I- Introduction au langage Java. Script : II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions n I-3. Historique du langage Java. Script : Java. Script a été initialement développé par Netscape et s’appelait Live. Script. Adopté à la fin de l’année 1995, par la firme Sun (qui à aussi développé Java), il prit alors son nom de Java. Script. Microsoft l’a aussi adopté à partir de la version 3 du navigateur Internet Explorer. Java. Script est un langage de Scripts qui, incorporé aux balises HTML, permet d’améliorer la présentation et l’interactivité des pages Web. Ces scripts sont gérés et exécutés par le navigateur lui-même sans faire appel aux ressources du serveur. Les instructions seront traitées en direct et surtout sans retard par le navigateur. IX-Gestion des événements X- Les Formulaires Recommandation Limites Solutions Historique

I- Introduction au langage II- Le formalisme de base du Java. Script : II-

I- Introduction au langage II- Le formalisme de base du Java. Script : II- Le formalisme de base Activité 2 : III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties <h. TML> <HEAD> <TITLE> Mon premier code Javascript </TITLE> </HEAD> <BODY>. . . Texte en HTML. . . Balises HTML Début de Script VII- Struc. de contrôle VIII- Les Fonctions <SCRIPT language="Javascript"> alert("Bienvenue"); //alert permet d'afficher une fenêtre message. </SCRIPT> Fin du Script IX-Gestion des événements . . un autre texte en HTML. . X- Les Formulaires </BODY> </HTML> Recommandation Balises HTML

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script : Activité : Imaginez un arbre dans un jardin comportant une branche sur laquelle se trouve un nid. On suppose la hiérarchie d'objets est définie comme ceci: IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation Le nid sur l'arbre est donc désigné comme suit: jardin. arbre. branche. nid Contrairement au nid situé sur la balançoire: Jardin. balançoire. nid Imaginez maintenant que l'on veuille changer la couleur du nid (dans l'arbre) pour le peindre en vert, il suffirait de taper une commande du genre: jardin. arbre. branche. nid. couleur= vert; C'est donc ainsi que l'on représente les objets en Javascript, à la seule différence que ce n'est pas un jardin qui est représenté sous forme d'objets mais la fenêtre de votre navigateur (Window). Suivant :

III- Les Objets Java. Script : I- Introduction au langage II- Le formalisme de

III- Les Objets Java. Script : I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation n III-1. Les objets Java. Script et leurs hiérarchies : Deux types d’objets : Les objets d’interface : Exemple : window, document, bouton, radio, chekbox …etc. Les objets des propriétés et des fonctions prédéfinies : ils permettent de fournir des ressources pour la programmation. Exemple : L’objet String, math, date… o III-1 -a. La hiérarchie des objets d’interface : On commence généralement par l'objet le plus grand (celui contenant tous les autres) puis on descend dans la hiérarchie jusqu'à arriver à l'objet voulu! ØL'objet le plus grand est l'objet fenêtre (les objets en javascript ont leur dénomination en anglais, donc dans le cas présent window) ØDans la fenêtre s'affiche une page, c'est l'objet document ØCette page peut contenir plusieurs objets, comme des formulaires, des images, . . . Précédent Suivant :

III- Les Objets Java. Script : I- Introduction au langage objet window II- Le

III- Les Objets Java. Script : I- Introduction au langage objet window II- Le formalisme de base objet document Deux objets Radio III- Les Objets Java. Script objet Texte IV- Les Variables Deux objets Bouton V- Opérateurs prédéfinis VI- Les Entrées/Sorties III-1 -b. Les propriétés des objets : Pour accéder aux propriétés des objets on utilise la syntaxe : Nom_De_L’Objet. Nom_de_la_propriété Exemple : Pour tester la propriété de sélection d’un bouton radio If (window. document. form. radio[0]. Checked = = True ) { …. } Form et Radio sont les nom du formulaire et du radio l’objet window est facultatif : If (document. form. radio[0]. Checked ) Radio[0] pour désigner le 1 er radio (Masculin) o VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation Précédent Suivant :

III- Les Objets Java. Script : I- Introduction au langage II- Le formalisme de

III- Les Objets Java. Script : I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions III-1 -c. Les méthodes objets : A chaque objet Java. Script correspond des méthodes (ou fonctions dédiées à cet objet) qui lui sont propres. Exemple : la méthode write() de l’objet document. Activité 3 : Page 82 Constatations III-2. Les différents emplacements du code Java. Script: Activité 4 : Page 83 Il y a plusieurs façon d'inclure du Java. Script dans une page HTML: o. Grâce à la balise <SCRIPT> o. En mettant le code dans un fichier o. Grâce aux événements o IX-Gestion des événements X- Les Formulaires Recommandation Précédent

IV- Variables : I- Introduction au langage II- Le formalisme de base III- Les

IV- Variables : I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation Activité 5: Les variables peuvent se déclarer de deux façons : Soit de façon explicite : exemple : Var n =1; var nom="Yasmine "; Ø Soit de façon implicite : exemple : n =1; nom="Yasmine "; ü un nom de variable doit commencer par une lettre (majuscule ou minuscule) ou un "_" ü un nom de variables peut comporter des lettres, des chiffres et les caractères _ et & (les espaces ne sont pas autorisés!) ü Les noms de variables ne peuvent pas être réservés): ü Les noms de variables sont sensibles à la casse (le Javascript fait la différence entre un nom en majuscule et un nom en minuscules), La visibilité des variables : NB : Variable implicite Variable globale Variable explicite variable globale sauf si elle est déclaré dans une fonction (donc c’est une variable locale) Ø Suivant :

IV- Variables : I- Introduction au langage II- Le formalisme de base III- Les

IV- Variables : I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis Type des variables : Activité : En fait le Javascript n'autorise la manipulation que de 4 types de données: ndes nombres: entiers ou à virgules ndes chaînes de caractères (string): une suite de caractères ndes booléens: des variables à deux états permettant de vérifier une condition n VI- Les Entrées/Sorties n VII- Struc. de contrôle true: si le résultat est vrai false: lors d'un résultat faux ndes variables de type null: un mot caractéristique pour indiquer qu'il n'y a pas de données VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation Précédent

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation V- Les opérateurs prédéfinis : Les opérateurs de calcul : (+, -, *, /, %, =) % Opérateur Modulo x=18%4 donne 2 = Opérateur d’affectation y =2. 3; Les opérateurs de comparaison : (==, <, <=, >, >=, !=) if (x==3) {……. } if (x!=3) {……. } Les opérateurs logiques : (&&, ||, !) ET , OU et NON logique. Les opérateurs associatifs : (+= , -= , *= , /= ) (x+=y sig x=x+y) (x-=2 sig x=x-2) (x*=3 sig x=x*3) (x/=a sig x=x/a) Les opérateurs d’incrémentation : (++ , -- ) ( x++ sig x=x+1 y-- sig y=y-1)

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables VI- Les entrées/sorties en Java. Script : Activité 6 : L’entrée (Lecture) : soit avec la méthode prompt de l’objet window, soit à l’aide des objets graphiques du formulaire HTML. nom_var=prompt("texte de la boite d’invite", "Valeur par défaut"); V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation La sortie : soit avec la méthode write de l’objet document, ou la méthode alert de l’objet window, soit à l’aide des objets graphiques du formulaire HTML. document. write("message"+nom_var); alert("message"+nom_var);

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation VII- Les structures de contrôle : VII-1 - Structures Conditionnelles L’instruction if : If (condition) {expression vrai; } Else VII-2 - Structures itératives : La boucle For : For (init; cond; progression) { Instructions; {expression faux; } Activités 7: } Les struc. de branchement : Switch (expression) { Case v 1 : //instruction à exécuter si l’expression vaut v 1 break; Case v 2 : //instruction à exécuter si l’expression vaut v 2 break; …. default : //inst. à exécuter dernier recours } La boucle do …While : Do { Instructions; } While (Condition); Activités 8: Activités 9: La boucle While : While (Condition) { Instructions; } Activités 11:

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation VIII- Les Fonctions : Activité 12 : On appelle fonction un sous-programme qui permet d'effectuer un ensemble d'instruction par simple appel de la fonction dans le corps du programme principal. Déclaration d’une fonction : function Nom_De_La_Fonction(argument 1, argument 2, . . . ) { liste d'instructions ; [return nomvariable] } Veillez toujours à ce qu'une fonction soit déclarée avant d'être appelée, sachant que le navigateur traite la page de haut en bas

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation IX- Gestions des événements en Java. Script : Activité 13: Les évènements sont des actions de l'utilisateur, qui vont pouvoir donner lieu à une interactivité Syntaxe : <nombalise On. Evénement="fonction()"> On. Evénement représente un attribut, associé à une balise HTML (nombalise), destiné à la gestion des événements. Exemples :

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation X- Les Formulaires : Rappel : Les attributs d’un formulaire : Action : permet d’indiquer l’action à entreprendre lorsque le bouton de validation est activé. Name : Le nom attribué au formulaire. Method : Permet de spécifier la méthode d’envoi des données au serveur (POST ou GET) Contenu du Formulaire : (Trois types d’éléments) textarea : Pour définir une zone de texte select : pour sélectionner une information dans une liste input : pour tous les autres types d’entrées (Champ texte, champ texte mot de passe, bouton simple, bouton radio, le bouton d’envoi, bouton de réinitialisation, la case à cochet

I- Introduction au langage Recommandations pédagogiques pour l’année scolaire 2008 -2009 : II- Le

I- Introduction au langage Recommandations pédagogiques pour l’année scolaire 2008 -2009 : II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation Langage Java. Script : (12 h) Recommandation : ØÉtude ØLes des entrées, des sorties, de l’affectation et des opérations arithmétiques, logiques et relationnels (2 h). ØÉtude des constantes, des variables et des structures de contrôle (4 h) ØContrôle sur les formulaires et leurs données (4 h) ØÉtude des objets chaîne et math (2 h). tableaux ne seront pas enseignés. ØLes méthodes et les propriétés de l’objet chaîne à enseigner sont : length, char. At, index. Of, substr. Ø Les méthodes de l’objet math à enseigner sont : abs, round, random, sqrt, eval. ØLes évèvements sur les formulaires sont : On. Click, On. Focus, On. Change.

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script

I- Introduction au langage II- Le formalisme de base III- Les Objets Java. Script IV- Les Variables V- Opérateurs prédéfinis VI- Les Entrées/Sorties VII- Struc. de contrôle VIII- Les Fonctions IX-Gestion des événements X- Les Formulaires Recommandation Les méthodes de l’objet Math et chaîne :