Introduction

Présentation
Panorama des environnements JavaScript

Écrire des instructions en JavaScript

Les variables et les types de données
Les opérateurs
Portée des variables var, let, const
Les instructions de bloc
Les structures de contrôle (conditionnelles et itératives)

Déclarer et appeler des fonctions

Définir une fonction, syntaxe déclarative et expressions
Transmettre des paramètres
Retourner une valeur
Définir des paramètres par défaut
La console (log, debug, info, error…)

Interagir avec le document via le DOM

Présentation, historique et version
Les objets window et document
Accéder aux éléments (getElementById, querySelector, querySelectorAll)
Découvrir les événements
Liste des événements de souris et de clavier (click, keypress, mouseover…)
Gestion des fenêtres et boîtes de dialogues
Atelier pratique: Faire afficher et masquer des balises HTML

Manipuler des tableaux

Présentation et structures d’un tableau
Déclaration de tableau (littéral, constructeur)
Ajout et suppression de données: push, splice
Parcourir un tableau (forEach, for of)
Les fonctions spécifiques (slice, pop, shift, reverse…)
Les fonctions find et findIndex

Appréhender le concept d’objet

Présentation
Les objets littéraux
Ajouter et accéder aux propriétés
Les property shorthand

Exploiter des sucres syntaxiques

Les littéraux de templates
Affectation par décomposition
Rest Parameter et Spread Operator
Les fermetures
Les fonctions fléchées
Atelier pratique: Filtrer des données affichées dans une liste

Déclencher des traitements au travers d’événements

Principe des écouteurs d’évènement
Les événements attacher au navigateur (load, unload, resize…)
Les événements de formulaire (submit et reset)
Récupérer et manipuler l’événement
Les fonctions preventDefault et stopPropagation
Atelier pratique: Valider les données d’un formulaire

Gérer dynamiquement les attributs

Manipuler les attributs (getAttribute et setAttribute)
Modifier le contenu d’une balises (innerHTML, innerText, innerContent)
Liste des propriétés Css en JavaScript
Modifier le Css à l’aide de l’attribut style
Ajout et suppression de class (className, classList)
Parcourir et transformer le DOM
Parcourir l’arbre DOM (parentNode, childNode)
Les fonctions parentChild et firstChild
Créer et insérer une balise (createElement, appendChild, createTextNode)
Les fonctions NextSibling et PreviousSibling
Supprimer une balise (removeChild)
Atelier pratique: réordonner une liste avec du drag et drop