Le Langage JavaScript

Présenté par : MANI Mohammed Adil 1

 Pourquoi Front-End ?

- Le profil Full-stack est actuellement très

demandé.

Statistiques 2018 – StackOverFlow Statistiques 2019 – StackOverFlow

 Qu’est ce qu’est le Full-Stack ?

- Il est capable de maîtriser d’une

part le front-end, c’est à dire la
partie graphique et dynamique du
site (que l’on voit à l’écran et avec
laquelle on peut interagir), et le
back-end qui est la partie
immergée relative à la gestion des
données.

- un développeur Full-Stack est

quelqu'un de familier avec chacune
des couches d'une application
informatique, même s'il a souvent
une affinité ou des compétences
plus étendues dans l'une d'elles. 
Qu’est ce qu’est le Full-Stack ?
 Utilisation du TypeScript

En 2012
 -Journaliste : Vous dites que l'on ne peut
pas écrire de grosses applications en
JavaScript ?

- Anders Hejlsberg: Non, vous pouvez les

écrire. Mais vous ne pouvez pas les
maintenir, Les très gros codes source
JavaScript ont tendance à finir en
"Lecture seule".
Fondateur de .Net Framework, et
Chef de projet C#.
 EcmaScript

- EcmaScript : Est un ensemble de normes concernant les langages de

programmation de type script et standardisées par ECMA International
dans les règles ISO.

- 1ere version en 1998 : Début de guerre entre Netscape et IE.

- Les versions EcmaScript nommées : ES1, ES2…. ES10 ou bien en se basant

sur l’année de production : ES98, ES99….. ES2019.

- ESNext, est une version qui contient les fonctionnalités qui ne sont pas
encore finalisées et ajoutées à la spécification.
 Versions ECMAScript

Année Version Nouveautés

1997 ES1
1998 ES2
1999 ES3 Chaines de caractères, Gestion des exceptions, Formatage des nombres.

Jamais ES4 Edition abandonnée

2009 ES5 Support de JSON, Manipulation des tableaux, Manipulation des dates

2015 ES6 Modules, POO, Portée, Promesses, Structures de données.

2016 ES7 Nouvelles fonctions pour les tableaux [.includes()], Opérateur d’exponentiation.

2017 ES8 Fonctions pour les chaines de caractères

2018 ES9 Fonctions pour les RegEx,

2019 ES10 Nouveautés Exceptions, Sort Stable, toString() pour les fonctions.

2020 ES11 BigInt = Plus de 9 Trillions, null syntax ?? et ||

2021 ES12 ReplaceAll pour String, Amélioration de Garbage Collector

2022 EsNext .at(valeur négative)

Tableau Comparatif entre les versions ES depuis 1997

 Présentation du TypeScript

- Dernière version : 4.5.2 en 17/11/2021.

- Le langage TypeScript, crée et publié en Octobre 2012

(0.8) par Microsoft est l'une des technologies les plus
appréciées de ces dernières années, dans le
développement FrontEnd.

- Son objectif est améliorer et sécuriser la production de

code JavaScript.

- Le code TypeScript est transcompilé en JavaScript

 Présentation du TypeScript

- Sa popularité ne cesse de croître et il est au cœur de

nombreux projets : Angular, Node.JS

- Il n'existe à l'heure actuelle aucune alternative, même si

certaines technologies partagent des objectifs
communs ou proposent des avantages similaires. C'est
le cas de Flow développé par Facebook.

- Plusieurs personnes pensent que le TS est un langage

temporaire jusqu’au l’implémentation de toutes les
fonctionnalités JS respectant la dernière version ES dans
tous les navigateurs.
 Présentation

- Microsoft : TypeScript est un

superset de JavaScript.

- Avis Minoritaire: La notion de

"Superset" telle que vulgarisée par
le graphique des 3 ensembles est
imprécise : on ne peut pas
considérer ES6 comme un sous-
ensemble de TypeScript.
 Utilisation du TypeScript

Evolution d’intérêt depuis 2015 selon Google Trends.

Comparaison entre Javascript(Orange) et TypeScript(Bleu) selon Google Trends.

 JavaScript – Introduction

- Javascript est un langage de programmation existant

depuis 1990 développé par Netscape en interne.
- Javascript permet de rendre dynamique un site
internet développé en HTML.
- Javascript permet de développer de véritables
applications fonctionnant exclusivement dans le cadre
de navigateur.
- Le Javascript est un langage de script simplifié orienté
objet dont la syntaxe est basée sur celle du Java.
 Ce qui est JavaScript

- Le JavaScript est sensible à la casse.

- Le JavaScript s’exécute côté client : gain de performance côté
serveur.
- Le JavaScript se classe dans la catégorie des langages de
programmation interprétés.
- Le JavaScript supporte actuellement la programmation orienté
objet.
- Le JavaScript supporte actuellement les types.
- Le JavaScript supporte la programmation synchrone et
asynchrone.
- Le JavaScript appartient à la famille C-Comme.
 Intégration du JS

• Dans le document html :

<script>
Code JS
</script>

• Dans un fichier externe :

<script src=‘’Chemin relative’’></script>
Ecrivez le code dans un nouveau fichier avec
extention js.
Intégration du JS
 Les bases du JS - Variables

- En JavaScript, on déclare une variable à l'aide du mot-clé let ou

var suivi du nom de la variable. Dans cet exemple, la variable
créée se nomme A.

- Console.log est une fonction qui sert à afficher le contenu

d’une variable dans la console du navigateur.

- On constate que le résultat affiché est undefined. Il s'agit d'un

type JavaScript qui indique l'absence de valeur. 
 Les bases du JS - Variables

- Le type d’une variable n’est connu qu’après

l’affectation d’une valeur à cette dernière, nous avons
les types suivants :
- Number :  Il représente tout nombre, que ce soit un entier,
un nombre négatif, scientifique.
- Les chaînes de caractère : Ce type représente n'importe
quel texte. 
- Boolean : Une variable qui n’accepte que les deux valeurs
true et false.
- Undefined : Type inconnu, pas d’affectation encore.
- Object : Type de données composé. Comme les structures
en c mais avec l’ajout des fonctions.
 Les bases du JS – Comparaison:
avec X = 5

Opérateur Description Exemple

== est égal à x==5  le résultat est true, x == ‘’ 5 ‘’ est true

x===5  le résultat est true x=== " 5 " le résultat est

=== est exactement égal à (valeur et type) false

!= n'est pas égal (ou différent de) X ! =8  le résultat est true

!== N’est pas égal et le type est différent X !== ‘3’ est true

> est supérieur à x>8 le résultat est false

< est inférieur à x<8  le résultat est true

>= est supérieur ou égal à x>=8 le résultat est false

<= est inférieur ou égal à x<=8  le résultat est true

 Les bases du JS – Logique

- Les opérateurs logiques sont typiquement utilisés avec des valeurs booléennes
(logiques) ; lorsque c'est le cas, ils renvoient une valeur booléenne également.
Cependant, les opérateurs && et || renvoient en réalité la valeur d'un des
opérandes spécifiés
 Les bases du JS – Interactivité

- L’avertissement alert :

• La méthode alert () affiche une boîte d'alerte avec un message

spécifié et un bouton OK.

• La méthode alert est utilisée lorsque l’avis de l’utilisateur n’est

pas demandé, alors c’est une procédure qui ne retourne aucune
valeur.
• La méthode alert bloque le chargement est l’interactivité du
navigateur jusqu’au clique sur OK.
 Les bases du JS – Interactivité

- Le message confirm :

• La méthode confirm () affiche une boîte de dialogue avec un

message spécifié, ainsi qu'un bouton OK et un bouton Annuler.

• La méthode confirm est utilisée lorsque nous voulons

demander l’avis d’un utilisateur en ce concerne la continuation
de la tâche. Comme les messages de confirmation de
suppression.
• Le clique sur OK retourne la valeur true, toute autre action,
retourne false.
 Les bases du JS – Interactivité

- Le message confirm : exemple de code

Message de confirmation

Message alert 1

Exemple de code pour une confirmation Message alert 2

Message alert 3
 Les bases du JS – Interactivité

- Le message prompt:

• La méthode prompt () affiche une boîte de dialogue qui invite

le visiteur à entrer une valeur.

• Une boîte de dialogue est souvent utilisée si vous souhaitez que

l'utilisateur saisisse une valeur pour l’utiliser dans une page,
comme son Age, son nom …

• Le clique sur OK retourne la valeur saisie, toute autre action,

retourne null.
 Les bases du JS – Interactivité

- Le message prompt: exemple de code

Message de demande de saisie

Message alert 1

Exemple de code pour une demande de

saisie
Message alert 2

Notez bien que le moteur JS considère toutes les entrées en tant que chaine de caractère.
 Les bases du JS – Interactivité

- Le message document.write :

• La méthode write () écrit des expressions HTML ou du code

JavaScript dans un document.
Navigateur

• La méthode write () est principalement utilisée pour les tests: si

elle est utilisée après le chargement complet d'un document
HTML, elle supprimera tout le HTML existant. Mais en général
elle a le même objectif que alert.

Exemple d’utilisation de document.write

 Les bases du JS – Interactivité

- Remarques :

• Les méthodes alert(), write() et confirm() sont des actions

bloquantes, c’est-à-dire qu’elles bloquent le chargement de
page ainsi que l’interaction avec le navigateur tant qu’elles sont
ouvertes.

• Les 3 méthodes ont un rendu graphique forcé, et différent d’un

navigateur à un autre.

• Le respect de UX n’est pas conforme avec l’utilisation de ces

méthodes ( Nombre de cliques élevé, Charte graphique
différente ).
 TP 1 – Calcul de somme

• Créer un programme JS, qui demande l’utilisateur de saisir A et

B, puis affiche leurs somme.

• Décortication :
– Déclarer 3 variables, A, B et C pour la somme.
– Demander l’utilisateur de saisir A et B en utilisant prompt.
– Tester la validité de A et B.
– Calculer la somme et l’affecter à C.
– Afficher la somme avec Alert ou document.write.
 TP 1 – Proposition

Message de demande de saisie 1

Code de proposition Message de demande de saisie 2

Notez que le moteur JS considère les 2

variables A et B comme étant des
chaines de caractères, chose qui a
imposé une concaténation au lieu d’une
addition arithmétique. Message alert 1
 TP 1 – Solution

Message de demande de saisie 1

Code de solution Message de demande de saisie 2

La solution : Forcer la conversion de

type de variable vers Number.
Message alert 1
 Transtypage en JS

• Le JavaScript n'est pas un langage fortement typé, mais il est parfois

intéressant de convertir une chaîne de caractères en nombre pour pouvoir
effectuer des calculs.

• Chose qui rend la manipulation des opérateurs et des affectations une

source de problème.

• Plusieurs fonctions sont disponibles : parseInt, parseFloat.

• Le transtypage ne lève aucune exception.

• Si vous recevez un message de type isNaN, c’est-à-dire que vous êtes entrain
de convertir une chaine en Number, en sachant qu’elle ne respecte pas la
forme numérique.
 TP 2 – Calcul de TVA

• Créez un programme JS, qui demande l’utilisateur de saisir le

nom de produit, le prix et la Qté, puis calculez le total HT, la TVA
et le Total TTC. (La TVA = 20%). Affichez le tous dans un tableau.

• Décortication :
– Déclarer les variables : produit, pu, qte, ht, tva et ttc.
– Demander l’utilisateur de saisir le produit, le prix unitaire et la quantité.
– Faire les testes nécessaires.
– Calculer le HT, la TVA et le TTC.
– Afficher en utilisation document.write car alert ne supporte pas le code HTML.
TP 2 – Solution

Affichage dans le navigateur

 Manipulation du DOM

• La manipulation du DOM permettra une interaction respectant

plus le UX par rapport aux méthodes : alert, propmt, confirm et
document.write.

• La meilleur façon de demander l’utilisateur de saisir une

information est les formulaires.

• La meilleur façon d’afficher une information à l’utilisateur est le

contenu HTML de notre page dans un <p>, <div> ou <span>
aussi.
 Manipulation du DOM

• Vous savez déjà qu'une page web est un document contenant

du texte ainsi que des balises qui permettent de structurer ce
document, en décrivant des éléments comme des titres, des
paragraphes, des liens.

• Une page web n'est rien d'autre qu'un ensemble de balises

imbriquées les unes dans les autres. On peut la
représenter sous une forme hiérarchisée appelée
une arborescence. 
 Manipulation du DOM - Exemple

Autrement dit, le DOM c’est ce que vous pouvez voir lorsque vous inspectez l’élément sur
le navigateur, c’est presque la même chose.
Manipulation du DOM – Presque la même chose
window

document history location

Votre document .back() .replace()

HTML
.go(number) .href

.host

.pathname

.search
• L’objet window est votre onglet de navigateur.
• La majorité de ce que vous pouvez faire avec le navigateur est accessible par
l’objet window, comme les actions suivantes : Précédant, suivant, Actualiser,
Imprimer, Fermer, Ajouter au favoris …

• L’objet document est votre HTML, du <html> jusqu’au </html>

 Manipulation du DOM – Document

• Un objet Document représente le document HTML affiché dans

cette fenêtre. L'objet Document a diverses propriétés qui font
référence à d'autres objets qui permettent d'accéder au
contenu du document et de le modifier ou bien de le récupérer.

• L’objet Document représente n'importe quelle page Web

chargée dans le navigateur et sert de point d'entrée dans le
contenu de la page Web.

• Alors comment récupérer les balises HTML en se basant sur

l’objet document ?
 Manipulation du DOM – Avec ID

• document.getElementById(‘’#ID’’) est la fonction qui

permettra de récupérer un élément en utilisant son ID.

• C’est la méthode la plus simple et la plus pratique.

• Elle retourne un seul objet car elle se base sur l’identifiant

unique de la balise.

• Dans le cas d’erreur, et si vous choisissez le même ID pour 2 ou

plusieurs éléments, seulement le 1er élément vas être
sélectionné.
 Manipulation du DOM – Avec ID

Affichage de l’alert

Contenu HTML et JS

Affichage de prompt

Contenu HTML et JS Affichage dans le navigateur

 Manipulation du DOM – Avec TAG

• document.getElementsByTagName(‘’balise’’) est la fonction qui

permettra de récupérer un élément en utilisant le nom de la
balise.

• Elements est écrite avec un S pour signifier le pluriel.

• Cette fonction retourne alors un tableau de toutes les balises

dont le nom est passé en paramètre.

• Pour sélectionner un élément bien précis vous devez vous baser

sur son index, qui commence bien sur par 0 pour le premier
élément.
 Manipulation du DOM – Avec TAG

Affichage de l’alert 1

Affichage de l’alert 2

Contenu HTML et JS Affichage de l’alert 3

Erreur au niveau du navigateur pour alert 4

 Manipulation du DOM – Avec Class Name

• document.getElementsByClassName(‘’class’’) est la fonction qui

permettra de récupérer un élément en utilisant la valeur de classe.

• La classe est comme l’ID, sauf que vous avez le droit d’ajouter plusieurs
balises avec la même valeur de classe.

• Elements est écrite avec un S pour signifier la multitude.

• Cette fonction retourne alors un tableau de tous les balises dont la

classe est passée en paramètres.

• Pour sélectionner un élément bien précis vous devez vous baser sur son
index, qui commence bien sur par 0 pour le premier élément.
Manipulation du DOM – Avec Class Name

Affichage de l’alert 1

Affichage de l’alert 2

Affichage de l’alert 3
Contenu HTML et JS

Affichage de l’alert 4
Manipulation du DOM – Avec QuerySelector
• document.querySelector(‘’selecteur’’) est la fonction qui permettra de récupérer un
élément en utilisant un sélecteur CSS.

• querySelector est plus préférée auprès des développeurs web, mais moins supporté sur
les anciens navigateurs (> IE7 par exemple).

• Cette fonction retourne un seul objet, le premier qui respecte le selecteur.

• Veuillez noter l’existence d’une fonction qui retourne tous les éléments liés:
querySelectorAll()
Selecteur Signification
a Toutes les balises A
pa Toutes les balises A qui se trouvent dans P
p, a Toutes les balises A et la balises P
p>a Toutes les balises A dont le 1er parent est un P
#myid La seul balise ayant id = myid
.myclass Toutes les balises ayant une classe = myclass
Manipulation du DOM – QuerySelector

Résultat CSS

Contenu HTML et JS
 Manipulation du DOM – Styles

• Si vous êtes habitués avec le CSS, vous n’allez pas trouver des
problèmes pour comprendre cette partie.

• Le principe est simple, chaque attribut CSS est disponible via JS, la
règle de transformation est : L’élimination des tirets et la
capitalisation.
– color en css = color en JS.
– border-color en css = borderColor en JS.
– border-right-style en css = borderRightStyle en JS.

• Après la récupération de l’élément, ajouter style.att par exemple :

– document.getElementsByTagName(‘’p’’)[0].style.borderColor = ‘’red’’;
// changement de la couleur de border pour la première balise p.
 Manipulation du DOM – Formulaires

• Après la récupération d’un élément, vous pouvez faire des

manipulations, comme innerHTML et style.

• Si l’élément récupéré est un élément de formulaire, vous

pouvez faire le suivant :
– Zones de texte et textAreas :
Objectif
Récupérer la valeur de la zone *
Modifier la valeur de la zone *
Tester si la zone est activé *
Désactiver une zone de texte *
Changer le placeholder
Tester si une zone est obligatoire *
Exemple
var nom = document.getElementById(‘’nom’’).value;
Document.getElementById(‘’nom’’).value = ‘’ALI’’;
If(document.getElementById(‘’nom’’).disabled == false)
document.getElementById(‘’nom’’).disabled = true;
document.getElementById(‘’nom’’).placeholder=‘’Votre nom’’;
If(document.getElementById(‘’nom’’).required== true)
 Manipulation du DOM – Formulaires
– Checkbox et Radio:
Objectif
Tester si l’élément est coché
Cocher un élément par
programmation
Changer l’élément coché par
défaut
Objectif
– Liste de sélection
Récupérer l’élément sélectionné
Activer la sélection multiple
Changer le nombre de ligne
affichées
Récupérer le nombre des opt
Exemple
If(document.getElementById(‘’choix’’).checked == true) { … }
document.getElementById(‘’choix’’).checked = true;
document.getElementById(‘’choix’’).defaultChecked = true;
Exemple
var elem = document.getElementById(‘’list’’);
var valeur = elem.options[elem.selectedIndex].value;
document.getElementById(‘’list’’).multiple = true;
document.getElementById(‘’list’’).size = 4;
var nbr = document.getElementById(‘’list’’).length;
 Manipulation du DOM – Contenu

• Pour accéder au contenu d’un élément récupéré, vous pouvez utiliser

innerHTML ou textContent.

• innerHTML : Fonction qui récupère le texte de l’élément puis le

transfère en HTML.

• textContent: Fonction qui récupère le texte de l’élément sans

conversion, alors elle est plus rapide.

• Nous utilisons innerHTML si nous voulons travailler avec des balises,

soit en insertion ou en lecture.

• innerHTML est la plus utilisée.

Manipulation du DOM – Contenu

Résultat sur navigateur

Contenu HTML et JS
 Manipulation du DOM – Evènements

• L'interaction de JavaScript avec HTML est gérée par le biais

d'événements qui se produisent lorsque l'utilisateur ou le
navigateur manipule une page.

• Lorsque la page se charge, c’est un événement. Lorsque l'utilisateur

clique sur un bouton, ce clic est également un événement. D'autres
exemples incluent des événements comme appuyer sur n'importe
quelle touche, fermer une fenêtre, redimensionner une fenêtre,
etc.

• La programmation évènementielle est la programmation dont la

quelle la lecture de quelques ligne dépend d’un évènement qui doit
se déclencher.
 Manipulation du DOM – Evènements

• Les développeurs peuvent utiliser ces événements pour

exécuter des actions codées par JavaScript, ce qui entraîne la
fermeture des fenêtres, l'affichage des messages aux
utilisateurs, la validation des données et pratiquement tout
autre type de réponse imaginable.

• Maintenant, vous allez ajouter à votre décortication

algorithmique la question suivante : QUAND ?

• La réponse à cette question est importante, et la liste des

événements est longue.
 Manipulation du DOM – Evènements

• La liste des évènements qui existent sous JavaScript

Evènement Quand Evènement Quand
blur Perte de focus load Chargement finalisé
change Changement de texte mousedown Presser la souris
click Clique par souris mouseleave Souris en dehors
dblclick Double clique par souris mouseover Souris sur élément
error Erreur de chargement mouseup Lâcher la souris
focus Gain de focus pause Mettre une pause
Keydown Bouton clavier pressé play Lire la vidéo ou l’audio
Keyup Bouton clavier lâché scroll Défiler
keypress Bouton clavier cliqué submit Envoie de formulaire
reset Annulation d’envoie
 Manipulation du DOM – Evènements

• L’appel d’un évènement passe par les étapes suivantes :

– Créer une fonction dans le script JS.
– Répondre à la question Quand ?
– Ajouter l’attribut onevent=‘’nom_de_fonction()’’ dans la source
d’évènement.
 TP 3 : Opérations arithmétiques

• Créer une page HTML avec un formulaire contenant :

– Zone de texte de type number pour A.
– Zone de texte de type number pour B.
– Liste déroulante pour choisir une opération arithmétique.
– Bouton comme source d’évènement, an moment de clique, affichez le résultat dans une
balise div.

• Décortication :
– Déclarer A, B et OP.
– Récupérer les valeurs de A, B et OP.
– Convertir A et B en entier.
– Tester l’opérateur avec + ou – ou * ou / (Ne pas prendre en considération la division par 0).
– Faire le calcul adéquat.
– Afficher le résultat dans la balise div.
TP 3 : Solution
Fonctions Utiles
 Les Tableaux

– Pour déclarer un tableau : var tab = [];

– Pour afficher un tableau : tab.toString(); // Affichage avec un séparateur virgule.
– Pour afficher un tableau avec un séparateur de votre choix : tab.join(‘’ * ’’);
– Supprimer le dernier élément : tab.pop();
– Supprimer le premier élément : tab.shift();
– Ajouter un élément à la fin du tableau : tab.push(‘’……..’’);
– Ajouter un élément au début du tableau : tab.unshift(‘’…….’’);
– Ecraser un élément : tab[1] = ‘’………’’; // Ecrasement du 2ème élément.
– Récupérer la taille du tableau : tab.length;
– Supprimer un élément par sa position : delete tab[2]; // 3ème élément.
– Insérer un élément dans une position : tab.splice(2,0,’’…….’’); // Insérer la valeur
du 3ème paramètre dans la position 2, supprimer 0 éléments.
– Concaténer N tableaux : tab1.concat(tab2,tab3);
– Trier un tableau : tab.sort(); // tab.reverse();
 Les chaines de caractères = String
– Déclarer une chaine de caractère : var txt = ‘’Hello Word’’;
– La taille d’une chaine de caractère : txt.length;
– Chercher une chaine : txt.indexOf(‘’Wo’’); // Retourne la position, sinon -1.
– Chercher une chaine à partir de la fin : txt.lastIndexOf(‘’el’’);
– Chercher une chaine : txt.search(‘’…..’’); // Plus performante de indexOf et
permet la recherche par expression régulière.
– Retirer une chaine de position A à B : var res = txt.slice(4,9);
– Retirer une chaine de position A à B : var res = txt.substring(4,9); // La
différence entre slice et substring : La 2ème n’accepte pas des valeur négatives.
– Retirer N caractères à partir de A : var res = txt.substr(7,6);
– Remplacer une chaine par une autres : var res = txt.replace(‘’Hello’’,’’Bonjour’’);
– Convertir en Majuscule : var res = txt.toUpperCase();
– Convertir en Minuscule : var res = txt.toLowerCase();
– Eliminer les espaces à la fin et début : txt.trim();
– Convertir une chaine à un tableau : var tab = txt.split(‘’,’’);
 Les dates
– Date aujourd’hui: var d = new Date(); // La date d’aujourd’hui sous le format :
Sun Mar 01 2020 16:10:12 GMT+0100 (UTC+01:00)
– Déclarer une date : var d = new Date(2012,5,15); // 15/05/2012 00:00:00
– Déclarer une date avec TimeStamp : var d = new Date(500000); // 500000
millisecondes après 01/01/1970.
– Récupérer l’année : d.getFullYear(); // 4 digits
– Récupérer l’année : d.getYear(); // 2 digits
– Récupérer le mois : d.getMonth(); // 0 - 11
– Récupérer le jour : d.getDate(); // 1 – 31
– Modifier l’année : d.setFullYear(2019);
– Modifier le mois : d.setMonth(11); // Décembre
– Modifier le jour : d.setDate(15);

– NB : Une date est toujours convertie en Time Zone du pays de navigateur.

 Fonctions de temps
– setTimeOut( miliseconds, f1());
– setInterval( miliseconds, f2());
 Prototype Objet
– Les objets sont utilisés pour le même objectif de structures en C, Enregistrer
plusieurs informations dans un seul tableau.

– Déclarer un objet : var person = {firstName:"John", lastName:"Doe", age:50};

– Accéder à un attribut : alert(person.firstName);
– Ajouter un objet à un tableau : tab.push(person);
– Loop sur les objets :
for(var i = 0; i < tab.length ; i++)
{
alert(tab[i].firstName + ‘’ – ‘’ + tab[i].age + ‘’ Ans’’);
}
– Supprimer un attribut : delete persone.age;
– Ajouter une fonction à un objet :
person.show = function () {
  return this.firstName + " " + this.lastName;
};
Alert(person.show());