Apprendre à coder sur pierre-giraud.com

DES COURS COMPLETS ET GRATUITS POUR TOUS

SOMMAIRE

Introduction

  1. Présentation du cours
  2. Introduction au JavaScript
  3. Environnement de travail

Les bases en JavaScript

  1. Où écrire le JavaScript
  2. Syntaxe et commentaires
  3. Découverte des variables
  4. Les types de valeurs
  5. Opérations sur les variables
  6. La concaténation
  7. Présentation des conditions
  8. Les conditions if, if...else, if...else if...else
  9. Opérateurs logiques
  10. Evaluation / Simplification des conditions
  11. Conditions ternaires
  12. Switch
  13. Les boucles
  14. Découverte des fonctions
  15. Test n°1

Les objets en JavaScript

  1. Définition et découverte
  2. Valeurs primitives et objets
  3. Créer des objets
  4. Les méthodes de l’objet String
  5. Les méthodes de l’objet Number
  6. Découverte de l’objet Array
  7. Les méthodes de l’objet Array
  8. Découverte de l’objet Date
  9. Les méthodes de l’objet Date
  10. L’objet Math et ses méthodes
  11. Test n°2

Notions avancées sur les fonctions

  1. La portée en JavaScript
  2. Les fonctions anonymes
  3. Les fonctions auto-invoquées
  4. Les closures JavaScript
  5. Test n°3

Le DOM HTML

  1. Découverte du DOM HTML
  2. Accéder à un élément HTML
  3. Modifier du contenu HTML
  4. Ajouter et insérer des éléments HTML
  5. Modifier ou supprimer des éléments HTML
  6. Naviguer dans le DOM
  7. Les évènements en JavaScript
  8. AddEventListener()
  9. Propagation des évènements
  10. L'objet Event
  11. Test n°4

Le BOM - Browser Object Model

  1. Le BOM et l'objet Window
  2. L'objet Screen
  3. L'objet Navigator
  4. L'objet Location
  5. L'objet History
  6. Test n°5

Les expressions régulières

  1. Découverte des regex en JavaScript
  2. Recherches et remplacements
  3. Les quantifieurs et les options
  4. Les classes de caractères et les méta-caractères
  5. Test n°6

JavaScript et formulaires

  1. Rappels sur les formulaires en HTML
  2. Validation HTML des formulaires
  3. Validation JavaScript des formulaires
  4. Test n°7

L'élément HTML canvas

  1. Découverte de l'élément canvas
  2. Dessiner des rectangles
  3. Dessiner des lignes
  4. Dessiner des arcs de cercle
  5. Créer des dégradés
  6. Insérer du texte et des images
  7. Incliner un dessin
  8. Test n°8

Notions avancées

  1. Gestion du délai d'exécution
  2. La gestion des erreurs
  3. Le mode strict
  4. Test n°9

Conclusion

  1. Conclusion - Aller plus loin

INTRODUCTION AU JAVASCRIPT

Qu’est-ce que le JavaScript ?

Le JavaScript est un langage de programmation créé en 1995.

Le JavaScript va nous permettre de créer des pages interactives et « vivantes » à l’aide de scripts.

Un script, c’est tout simplement une suite d’instructions qui vont être interprétées par un programme.

Ainsi, pour lire du code JavaScript, il va nous falloir un interpréteur. Heureusement, tous les navigateurs (Google Chrome, Safari, etc.) possèdent leur propre interpréteur JavaScript.

Le JavaScript, un langage client-side

Le JavaScript est un langage de programmation dit « client-side ».

Il existe deux grands types de langages de programmation : les langages « client-side » et les langages « server-side ».

Les langages client-side vont s’exécuter du côté du client, c’est-à-dire sur l’ordinateur de la personne qui va demander la page web.

Les langages server-side, au contraire, vont s’exécuter côté serveur. Un serveur, c’est une sorte d’ordinateur très puissant qui va stocker des pages web puis les envoyer au client lorsque celui-ci les demande.

Par exemple, lorsque vous faîtes une recherche sur Google, vous êtes le client et vous demandez via votre navigateur à accéder à une page web. Cette page web est stockée sur un serveur qui va se charger de vous l’envoyer.

Les langages client-side et server-side n’ont pas la même finalité. En effet, le client n’interagit que très rarement directement avec les langages server-side (comme le PHP par exemple) car ces derniers sont souvent là pour effectuer des calculs et traiter des données en arrière plan.

L’important pour le moment est que vous reteniez le schéma suivant :

  1. Vous demandez à accéder à une page web via votre navigateur. Vous êtes le client et la page web est stockée sur le serveur ;
  2. Le serveur reçoit votre demande. Les langages server-side vont s’exécuter côté serveur (calculs, etc.) ;
  3. Une fois l’exécution terminée, le serveur renvoie la page web qui ne contient plus que du code client-side (les langages server-side effectuent leurs opérations et renvoient du code client-side), dont du JavaScript éventuellement ;
  4. L’exécution des langages client-side se fait lorsque vous recevez la page demandée, dans votre navigateur.

Retenez cependant que des projets ont vu le jour pour utiliser le JavaScript sur serveur (CommonJs, Node.js). Nous n’en parlerons pas dans ce cours.

Le JavaScript, un langage orienté objet

Finalement, le JavaScript est également un langage orienté objet à prototype.

Cela signifie simplement que le JavaScript va utiliser des objets dans son fonctionnement, et que ces objets sont prototypés.

Il est trop tôt pour que je puisse vous expliquer véritablement ce que sont les objets. Pour le moment, retenez simplement qu’un objet correspond à un bloc cohérent de code servant à effectuer telle ou telle opération.

JavaScript, Java et HTML

Ce qui fait toute la puissance du JavaScript, c’est qu’on va pouvoir l’utiliser pour manipuler dynamiquement le code HTML d’une page.

Ainsi, nous allons pouvoir créer des effets intéressants et ajouter de l’interaction sur nos pages web.

Faîtes cependant bien attention à ne pas confondre JavaScript et Java ! Ces deux langages, bien que syntaxiquement assez proches à la base, reposent sur des concepts fondamentaux complétement différents et servent à effectuer des tâches totalement différentes.

Chapitre précédent

Chapitre suivant