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

L’OBJET JAVASCRIPT NAVIGATOR

Présentation et propriétés de l’objet Navigator

L’objet Navigator va nous donner des informations sur le navigateur de vos visiteurs en soi ainsi que sur les préférences enregistrées (langue, etc.).

Attention cependant ici aux informations récupérées : celles-ci proviennent de l’utilisateur et ne sont donc jamais totalement fiables.

De plus, vous devrez demander une autorisation à l’utilisateur avant de récupérer certaines de ces informations.

L’objet Navigator possède dix propriétés :

  • language : retourne la langue définie dans le navigateur ;
  • geolocation : retourne un objet « geolocation » qui peut être utilisé pour définir la localisation de l’utilisateur ;
  • product : retourne le nom du moteur utilisé par le navigateur ;
  • cookieEnabled : détermine si les cookies sont autorisés ou non ;
  • appName : retourne le nom du navigateur ;
  • appCodeName : retourne le nom de code du navigateur ;
  • appVersion : retourne la version du navigateur utilisée ;
  • online : détermine si le navigateur est en ligne ou pas ;
  • platform : détermine pour quelle plateforme le navigateur est compilé ;
  • userAgent : retourne l’en-tête du fichier user-agent envoyé par le navigateur au serveur ;

De plus, Navigator possède une méthode intéressante : la méthode javaEnabled(), qui détermine si Java a été activé sur le navigateur ou pas.

Utilisation des propriétés de Navigator

Voyons quelques unes des propriétés les plus intéressantes de Navigator ensemble :

Les propriétés de l’objet navigator

navigator nous permet d’obtenir des informations sur le navigateur de nos visiteurs

Essayer ce code !

La propriété geolocation de l’objet Navigator

Pour tenter de récupérer la localisation de nos visiteurs, nous allons devoir utiliser la propriété geolocation.

Cette propriété est un peu plus complexe à utiliser puisqu’elle va renvoyer un objet geolocation qui va être inexploitable tel quel.

Nous allons devoir utiliser la méthode getCurrentPosition() de l’objet geolocation pour obtenir une information exploitable.

On va donner une autre méthode en argument de getCurrentPosition() qui sera chargée de renvoyer la latitude et la longitude de l’utilisateur si on y a accès.

Voici donc comment on va s’y prendre pour récupérer les informations voulues :

Utilisation de geolocation en JavaScript

On localise un visiteur avec geolocation en JavaScript

Essayer ce code !

Cet exemple est plus complexe que les précédents, il est donc intéressant de le décortiquer pour bien le comprendre.

Tout d’abord, on crée une fonction auto-invoquée qui va vérifier si les informations de localisation sont disponibles ou pas.

En effet, si celles-ci sont disponibles, loc ne sera pas vide, et donc le test if loc == true sera vérifié.

Notez au passage que l’on aurait aussi bien pu donner un nom à cette fonction et l’appeler par la suite plutôt que de créer une fonction auto-invoquée.

Si la condition est vérifiée, notre fonction auto-invoquée exécute la méthode getCurrentPosition() qui, rappelons le, prend une autre méthode en argument.

Si la condition n’est pas vérifiée, un message d’erreur est simplement renvoyé.

Finalement, notre fonction coordonnees se charge de récupérer la latitude et la longitude correspondant à l’emplacement de notre visiteur.

Pour cela, nous allons devoir utiliser les propriétés coords, latitude et longitude.

Comme on ne peut pas utiliser coords comme cela, on va faire passer une référence x à notre fonction (on peut lui donner le nom que l’on souhaite, cela n’a pas d’importance) qu’on va réutiliser avec coords.

Une nouvelle fois, cet exemple est assez complexe et utilise des méthodes et propriétés que nous n’avons pas vues auparavant. Pas d’inquiétude donc si vous ne comprenez pas tout d’un coup : revenez y à tête reposée plus tard.

Chapitre précédent

Chapitre suivant