JavaScript Academy · Leçon

Bases de l’interpolation de chaînes

Insérez des expressions dans des littéraux de gabarit.

Bases de l’interpolation de chaînes est une leçon JavaScript Academy gratuite sur CoddyKit. Ceci est la leçon 1 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage JavaScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours JavaScript Academy comprend 4 leçons au total.

Que sont les littéraux de gabarit

Les littéraux de gabarit permettent de créer des chaînes à l’aide du caractère accent grave au lieu de guillemets. Ils permettent d’insérer directement des expressions dans une chaîne sans concaténation manuelle.

Un emplacement réservé s’écrit avec un signe dollar suivi d’accolades qui entourent une expression. JavaScript évalue l’expression et insère sa valeur dans la chaîne.

const name = "Alice"
const greeting = "Hello, " + name + "!"
console.log(greeting)

Syntaxe de l’interpolation

Dans un littéral de gabarit, vous placez une expression entre une ouverture composée d’un dollar et d’une accolade, et une accolade fermante. L’expression est évaluée et convertie en chaîne.

L’exemple ci-dessous utilise une concaténation classique pour produire le même résultat que l’interpolation, afin de rendre l’idée claire sans montrer la syntaxe du littéral.

const product = "Book"
const price = 12
const line = product + " costs " + price + " dollars"
console.log(line)

Pourquoi l’interpolation est utile

La concaténation avec l’opérateur plus devient difficile à lire lorsque vous mélangez de nombreuses variables et du texte littéral. L’interpolation conserve le texte environnant et ne remplace que les parties dynamiques.

Moins d’opérateurs plus
Aucune erreur d’espacement parasite
Une intention plus claire

const user = "Bob"
const count = 3
console.log(user + " has " + count + " messages")

Intégrer n’importe quelle expression

Un emplacement réservé peut contenir toute expression valide, et pas seulement une variable. Les opérations arithmétiques, les appels de fonction et l’accès aux propriétés fonctionnent également.

const a = 5
const b = 7
console.log("Sum is " + (a + b))
console.log("Max is " + Math.max(a, b))

Appeler des fonctions à l’intérieur

Vous pouvez appeler une fonction et laisser sa valeur renvoyée s’insérer dans la chaîne. L’exemple montre la forme équivalente avec concaténation.

function upper(s) { return s.toUpperCase() }
const word = "hello"
console.log("Loud: " + upper(word))

Accéder aux propriétés

Les propriétés d’un objet peuvent être lues directement dans un emplacement réservé. Ici, nous lisons des champs d’un objet utilisateur.

const user = { name: "Eve", age: 30 }
console.log("Name: " + user.name + ", Age: " + user.age)

Les nombres deviennent des chaînes

Lorsqu’un nombre se trouve dans un contexte de chaîne, il est automatiquement converti en texte. La même conversion implicite se produit avec l’interpolation.

const total = 19.99
console.log("Total: $" + total)

Opérateurs ternaires dans les emplacements réservés

La logique conditionnelle avec l’opérateur ternaire tient dans un emplacement réservé, ce qui permet de choisir directement entre deux valeurs.

const score = 72
const grade = score >= 60 ? "Pass" : "Fail"
console.log("Result: " + grade)

Expressions imbriquées

Les emplacements réservés peuvent contenir des chaînes d’appels de méthodes et des appels imbriqués. Le résultat de l’évaluation de l’expression est inséré.

const items = ["a", "b", "c"]
console.log("Joined: " + items.join("-"))
console.log("Count: " + items.length)

Mélanger plusieurs valeurs

Les littéraux de gabarit sont particulièrement utiles lorsqu’une phrase combine plusieurs variables. Comparez la version interpolée, plus lisible et décrite en toutes lettres, avec cet équivalent concaténé.

const city = "Paris"
const temp = 21
const sky = "sunny"
console.log("In " + city + " it is " + temp + "C and " + sky)

Échapper le signe dollar

Si vous souhaitez afficher une séquence dollar-accolade comme du texte plutôt que comme un emplacement réservé, vous devez échapper le signe dollar avec une barre oblique inverse dans un littéral de gabarit. Dans les chaînes classiques, aucun échappement n’est nécessaire.

const text = "Use $\{x\} for a placeholder"
console.log(text)

Vérification rapide

Vérifiez votre compréhension de l’interpolation.

Récapitulatif

Récapitulatif : Les littéraux de gabarit utilisent des accents graves et des emplacements réservés pour intégrer des expressions dans les chaînes.

Un emplacement réservé évalue n’importe quelle expression
Les valeurs sont converties en chaînes
L’interpolation est plus claire qu’une longue concaténation
Échappez le signe dollar pour l’afficher littéralement

const n = "World"
console.log("Hello, " + n + "!")

Questions Fréquemment Posées

La leçon « Bases de l’interpolation de chaînes » est-elle gratuite ?

Oui — le texte complet de « Bases de l’interpolation de chaînes » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours JavaScript Academy, passe à CoddyKit PRO. Le cours JavaScript Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « Bases de l’interpolation de chaînes » ?

Insérez des expressions dans des littéraux de gabarit. Tu pratiques JavaScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer JavaScript Academy ?

Aucune expérience préalable n'est requise. JavaScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 1 sur 4.

Combien de temps prend la leçon « Bases de l’interpolation de chaînes » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon JavaScript Academy ?

Oui. Chaque leçon JavaScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

← Retour à JavaScript Academy