Programmation JavaScript Moderne

Modifié le: 2022-08-17

Auditoire

Développeurs web

Durée

3 jours

Prérequis

Comprendre les bases du HTML et CSS. (Balises, styles, classes)

Description

JavaScript est un langage de programmation pour scripter des pages web interactives. Cela permet de modifier dynamiquement le look et le contenu des applications web. La grande majorité des plateformes web modernes utilisent JavaScript (WordPress, Office 365, Google Maps, etc).

JavaScript est le langage de programmation le plus utilisé dans le monde.

Plan de cours

Fondements de JavaScript

  • Historique du langage
  • Environnement de programmation
  • Navigateurs, ligne de commande et Serveur
  • Exemple: Hello World

Variables JavaScript

  • Déclaration de variables (const, let, var)
  • Mode Strict
  • Hoisting (hissage)
  • Portée (scope)
  • Types (Number, Boolean, Date, Math, String, Array)
  • Type coercion
  • Typeof
  • Equality vs Strict equality
  • Operators (Logical and Arithmetic)
  • Manipulation de chaines (string)
  • Manipulation de Dates
  • Boucles (For, while)
  • Énoncés conditionnels (if, switch, ternary, operators)

Tableaux et Objets (Arrays and Objects)

  • Utiliser des tableaux
  • Décomposition
  • Opérateur de décomposition
  • Définir des objets
  • Manipuler des objets
  • Initialisation d'objet littérale
  • Propriétés raccourcies (shorthand)

Fonctions

  • Déclaration des fonctions
  • Fonctions fléchées (Arrow functions)
  • Paramètres et paramètres par défaut
  • Retour de fonction
  • Paramètre du reste et opérateur de décomposition (spread)
  • Affecter par décomposition (destructuring)
  • Fermeteurs (closure)
  • Hisser (Hoisting)
  • Récursion

Outils

  • Visual Studio Code
  • Navigateurs (Chrome, Firefox, Edge, etc)
  • Débogueurs
  • Kangax

Utiliser le Document Object Model (DOM)

  • Manipulation du DOM
  • Types de Noeuds (Element, Text, Comment)
  • Objet Window: alerts, dialogs, timers, etc
  • Utiliser les datasets

Événements

  • Gestion des événements (onclick, onchange, onsubmit, etc)
  • Délégation des événements (event bubbling)
  • Event.target et event.currentTarget
  • preventDefault() et stopPropagation()

Validation de fomulaires

  • Valider avec HTML5
  • Valider avec JavaScript
  • Introduction aux expressions régulières

AJAX et requêtes asynchrones

  • XMLHttpRequest (xhr)
  • API Fetch (fetch)
  • Fonction de rappel (callbacks)
  • Promesses (promises)
  • Async/await
  • FormData

Classes

  • Classes
  • Héritage
  • Constructeurs
  • Getters et setters
  • Propriéts privées
  • Méthodes et propriétés statiques
  • Accéder la classe de base
  • Portée de "this"

Gestion des erreurs

  • Try
  • Catch
  • Throw
  • Finally

Modules

  • Import
  • Export
  • Default & Wildcard
  • Déclarations des modules en Html

Sujets Avancés

  • Higher Order Functions
  • Node.js
  • NPM
  • Linters (ESLint, Stylelint, etc)
  • Test Framework (Jest, Cypress, etc)