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 STRING ET SES METHODES

L’objet String

L’objet String est l’objet qui gère les chaînes de caractères. Cet objet possède trois propriétés et une vingtaine de méthodes.

Comme nous l’avons vu précédemment, nous n’utiliserons pas la fonction constructeur de cet objet pour créer de nouveaux objets de type string : on préfèrera utiliser des valeurs primitives.

Cependant, rappelez vous que nous allons pouvoir utiliser les propriétés et méthodes de cet objet avec nos valeurs primitives.

Les propriétés de l’objet String sont les suivantes :

  • La propriété length qui va nous permettre de connaître la longueur d’une chaîne de caractères ;
  • La propriété prototype qui nous permet d’ajouter de nouvelles propriétés ou méthodes à un objet ;
  • La propriété contructor qui va retourner la fonction qui a créé le prototype de l’objet String.

Nous n’étudierons pas ces deux dernières propriétés dans ce cours car elles ne sont que peu utilisées en pratique par des développeurs non avancés.

En revanche, nous allons dans la suite de cette partie étudier les méthodes de l’objet String les plus couramment utilisées.

Les méthodes toLowercase() et toUpperCase()

Commençons avec les méthodes toLowerCase() et toUpperCase(). Ces deux méthodes vont nous permettre respectivement de transformer une chaîne de caractères en minuscules ou en majuscules.

Faîtes bien attention à l’orthographe des méthodes en JavaScript lorsque vous en utilisez : celles-ci sont sensibles à la casse et vous devez donc bien mettre des majuscules aux bons endroits.

Pour cela, retenez seulement que les méthodes dont le nom est composé de plusieurs mots vont prendre une majuscule pour chaque début de mot sauf le premier (par exemple, « to lower case » devient « toLowerCase() »).

Ces deux méthodes ne nécessitent pas d'argument pour fonctionner.

Méthodes toLowerCase et toUpperCase de String

Utilisation des méthodes toLowerCase et toUpperCase de String

Essayer ce code !

La méthode charAt()

La méthode charAt() va retourner le caractère situé à une position donnée. Cette méthode va prendre comme argument obligatoire un nombre qui va correspondre à une position.

Faites bien attention lorsque vous l’utilisez : le premier caractère d'une chaîne de caractères possède la position zéro. Ensuite, tous les caractères (spéciaux ou non) et espaces comptent pour 1 :

La méthode charAt() de l’objet String

Utilisation de la méthode charAt() de l’objet String

Essayer ce code !

Les méthodes indexOf() et lastIndexOf()

La méthode indexOf() va retourner la première position à laquelle un caractère (ou une séquence de caractères) donné a été retrouvé dans une chaine (on parlera de première occurrence).

La méthode lastIndexOf() va elle retourner la dernière position à laquelle un caractère (ou une séquence de caractères) donné a été retrouvé dans une chaine.

Ces deux méthodes vont avoir besoin d’un argument qui va être le caractère à rechercher :

Méthodes indexOf et lastIndexOf de String

Utilisation des méthodes indexOf et lastIndexOf de String

Essayer ce code !

Comme vous pouvez l’observer, ces deux méthodes sont sensibles à la casse. Faîtes donc bien attention à en tenir compte dans vos recherches.

Notez que le premier caractère possède une nouvelle fois la position 0 et que ces deux méthodes vont retourner la valeur « -1 » si le caractère recherché n’est pas trouvé.

On peut également ajouter un deuxième argument à ces deux méthodes, facultatif, qui va être une position à partir de laquelle la recherche doit démarrer.

Dans ce cas, les caractères précédents le début de la recherche seront comptés mais non inclus dans la recherche : on commence à rechercher à partir d’une certaine position, mais on compte depuis le début.

Utilisation du deuxième paramètre de indexOf()

On recherche avec la méthode indexOf()) de String en JavaScript

Essayer ce code !

La méthode replace()

La méthode replace() va nous permettre de rechercher un caractère (ou une expression) dans une chaîne de caractères et de le(la) remplacer par un(e) autre.

Cette méthode va avoir besoin de deux arguments : le caractère (ou la chaine) à remplacer et le caractère (ou la chaine) de remplacement.

La méthode replace() de l’objet String en JavaScript

Exemple d’utiilsation de la méthode replace() de l’objet String en JavaScript

Essayer ce code !

La méthode slice()

La méthode slice() va extraire une partie d’une chaîne et retourner la partie extraite comme nouvelle chaîne.

Cette méthode a besoin de deux arguments : la position où doit débuter l’extraction et la position de fin de l’extraction :

La méthode slice de l’objet String en JavaScript

Utilisation de la méthode slice de l’objet String en JavaScript

Essayer ce code !

Vous pouvez également noter l’astuce suivante : en donnant des arguments négatifs à cette méthode, la comptage commencera par la fin.

Ainsi, -1 va correspondre au dernier caractère, -2 à l’avant dernier, etc. Dans ce cas, il n’y a cependant aucun moyen de récupérer le dernier caractère à moins de "tricher" en ajoutant un espace en fin de chaine.

Utilisaton de slice() avec des valeurs négatives

Avec des valeurs négatives, slice() va compter en partant de la fin

Essayer ce code !

La méthode trim()

La méthode trim() supprime les espaces superflus en début et en fin de chaîne. Cela peut être très pratique lorsqu’on veut nettoyer et mettre en forme des données envoyées par l’utilisateur par exemple.

Cette méthode n'a pas besoin d'argument pour fonctionner.

La méthode trim() de l’objet String en JavaScript

Utilisation de la méthode trim() de l’objet String en JavaScript

Essayer ce code !

Autres méthodes de l’objet String

Il existe d’autres méthodes de String qui peuvent être intéressantes. Nous verrons certaines d’entre elles plus tard dans ce cours.

Parmi celles-ci, il y a valueOf() qui retourne la valeur primitive d’un objet de type String, search() et match() qui vont comparer une chaîne à une certaine expression et vont retourner les correspondances ou encore split() qui va casser une chaîne de caractères selon un délimiteur et va créer un tableau avec les morceaux.

Chapitre précédent

Chapitre suivant