3.2
La notion de programme
La notion de programme (suite)
Un
programme
est composé d’une série
d’instructions
, parfois regroupées en
fonctions
, qui compose un
algorithme
permettant de traiter des
données
.
Les
données
sont manipulées par le biais de
variables.
Les
fonctions
peuvent recevoir des
paramètres
(données), effectuent des calculs ou des actions en utilisant (parfois) des
variables
internes. Les fonctions peuvent retourner une valeur à la fin de leur exécution. Un fonction est déclenché par une invocation, c-a-d. une instruction ailleurs dans le programme y compris la gestion d’un événement qui survient (l’utilisateur clique sur un bouton par exemple)
L’algorithme
contient une ou plusieurs
structures de contrôle
qui permettent au programmeur de décider les calculs et les actions à entreprendre. Ces structures permettent de sélectionner une action en fonction de la valeur d’une variable, de répéter une action de multiples fois...
3.3
Les variables
Une variable est une zone de mémoire informatique contenant une valeur pouvant varier au cours de l’exécution d’un programme.
-
Il s’agit d’un "conteneur" auquel on donne un nom (e.g.
score
).
-
La valeur contenue peut être de différents types
entier (integer) : 134
réel (float) : 345.38743
chaîne de caractère (string) : "réponse 3 : Lausanne"
-
Pour donner une valeur à la variable, on fait une
assignation
.
score = 34;
On lit de
droite à gauche "mettre la valeur 34 dans la variable score" (non pas "score égale 34",
ce n’est pas un opérateur d’égalité
)
feedback = "Vous avez gagné !";
-
On peut réutiliser la valeur de la variable à tout moment
write(feedback); (écrit le contenu de la variable feedback)
-
Avec Javascript, il n’est pas obligatoire (mais fortement conseillé) de déclarer et d’initialiser les variables. Cela permet de s’assurer que chaque variable est bien définie et contient une valeur par défaut avant d’effectuer des opérations avec. Vous gagnez du temps pour trouver les erreurs !!
var score = 0;
3.4
Les fonctions
Ensemble d’instructions identifié par un nom unique permettant d’effectuer une action, un calcul...
-
Une fonction peut accepter des paramètres (données)
-
Une fois qu’elle est définie, on peut l’appeler depuis n’importe quel endroit du programme, y compris depuis une autre fonction.
addfooter("Fait à TECFA");
-
Si la fonction retourne une valeur on peut la stocker dans une variable par exemple
score = calcule(reponse1, reponse2);
-
Les variables et paramètres définis dans une fonction seront locaux à la fonction (on ne les "voit" pas dans le reste du programme).
3.5
Structures de contrôle
Les structures de contrôle permettent de contrôler l’exécution d’un programme en faisant des tests sur les valeurs d’une variable. Il existe plusieurs structures de contrôle. Seuls 2 sont présentées ici en quelque détail.
A.
La sélection : if... else
On peut résumer en quelques mots cette structure à "si une condition est vraie alors faire ceci sinon faire cela".
-
On peut imbriquer plusieurs sélections : "si la condition est vraie alors faire ceci sinon, si cette autre condition est vraie alors faire ceci, sinon faire cela";
if (score < 3) {
niveau = "débutant";
} else {
if (score < 5) {
niveau = "averti";
} else {
niveau = "expert";
}
}
Voici l’arbre de décision associé à l’exemple ci-dessus.
B.
La boucle incrémentale: for...
for (<expression de début>; <condition>; <expression de fin>) {
expression 1;
expression 2;
...
}
-
L’
expression de début
est exécutée quand on rentre dans la boucle pour la première fois.
-
la
condition
est évaluée à chaque passage dans la boucle. Si elle est vraie, on exécute les expressions de la boucle. Si elle est fausse, on sort de la boucle.
-
L’
expression de fin
est exécutée quand toutes les expressions de la boucle on été exécutées (avant le passage suivant dans la boucle).
Exemple : calcul d’un produit factoriel (n! = 1 * 2 *... * n-2 * n-1 * n)
var n = 12;
var prodfact = 1;
for (i=1; i<=n; i++) {
prodfact = prodfact * i;
}
document.write("le produit factoriel de" + n + " vaut " + prodfact); )
C.
While
while (condition) {
statements
}
D.
break (dans while, for, switch): sortir de la boucle
E.
switch
switch (expression){
case label :
statement;
break;
case label :
statement;
break;
...
default : statement;
}
3.6
Les objets
(sujet à option pour les débutants ...)
-
JavaScript est un langage “basé objets”:
-
le programmeur peut “utiliser” des objets “JavaScript” pré-définis
-
il peut définir des objets simples (sans héritage)
-
tout élément conceptuel utilisé, affiché etc. à l’intérieur d’une page est représenté par un objet qui s’insère dans une structure de type DOM
-
d’autres objets existent (par exemple informations sur le navigateur)
-
un objet est une structure informatique qui:
-
possède des propriétés (variables contenant de l’information);
-
possède des méthodes (procédures permettant de manipuler les informations contenues dans l’objet);
-
(parfois) possède des “event handlers” associés.
-
Les objets préexistants (DOM) sont organisés hiérarchiquement.
-
Il existe les des objets introduits par Netscape (repris par Microsoft) et qui représentent le navigateur et la fenêtre.
-
Le DOM (Document Object model) du W3C represente la structure informatique d’une page HTML selon une logique plus rigoureuse que les anciens modèles de NS/MS et qu’il ne faut plus utiliser.
-
Méthodes (fonctions) ou propriétés (variables attachées aux objets) vous permettent de traiter une page HTML, créer des boites de dialogues, fabriquer des nouvelles pages, faire des pages interactives, etc.
A.
Instantiation d’objets et utilisation de propriétés et méthodes
2 méthodes d’instantiation:
objet = {};
-
expression équivalentes qui créent un objet
var objet = new Object();
var objet = {};
Lire la valeur d’une propriété
obj["nom_propriété"];
-
expressions équivalentes pour lire la valeur d’une propriété
var name = obj.name;
var name = obj["name"]
Assigner une valeur à une propriété
obj["nom_propriété"] = ....
-
expressions équivalentes pour lire la valeur d’une propriété
obj.name = "James_Bond";
obj["name"] = "James";
objet.nom_méthode(arguments...)
-
une méthode d’un objet est invoquée selon une syntaxe "habituelle"
B.
Création d’objets
Exemple simple:
function car(make, model, year) {
this.make = make;
this.model = model;
this.year = year;
}
-
Cette fonction "car" crée implicitement un objet
-
chaque ligne this.xxx assigne un paramètre passé lors de la création à une variable interne (propriété)
var ta_voiture = new car("Toyota", "Corolla", 2005);
var ma_voiture = new car("Mazda", "Miata", 1990);
Objets dans objets
-
Dans cet exemple, on définit d’abord un 2ème objet
function person(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
rand = new person("Rand McKinnon", 33, "M");
-
on modifie la fonction de construction pour le type d’objet "car"
function car(make, model, year, owner) {
this.make = make;
this.model = model;
this.year = year;
this.owner = owner;
}
-
Lorsqu’on crée un instance de car, on peut maintenant lui indiquer son propriétaire.
bagnole = new car("Eagle", "Talon TSi", 1993, rand);
-
Pour connaitre le propriétaire de bagnole:
bagnole.owner.name
Autrement dit: On peut descendre une hiérarchie d’objets en enchaînant: v.x.y.z
object.methodname = function_name
-
associe un nom de fonction à une méthode
Voici la suite de l’exemple:
-
Définition d’une fonction
function displayCar() {
var result = "A Beautiful " + this.year + " " + this.make
+ " " + this.model;
pretty_print(result);
}
-
Définition de cette fonction comme méthode pour le type d’objet "car".
function car(make, model, year, owner) {
this.make = make;
this.model = model;
this.year = year;
this.owner = owner;
this.displayCar = displayCar;
}
bagnole.displayCar()
Technologies Internet et Education, © TECFA
