Exercices de manipulation du Javascript
Voici une série d'exercices conçus pour vous introduire aux concepts de base de JavaScript. Chaque exercice se concentre sur une thématique spécifique.
Variables et Types de Données
Objectif : Créer des variables pour stocker des informations.
Exercice : Déclarez une variable nom et assignez-lui votre nom sous forme de chaîne de caractères. Ensuite, créez une variable age et assignez-lui votre âge sous forme de nombre. Affichez ces informations dans la console.
let nom = 'John Doe';
let age = 30;
console.log(nom, age);
let nom = "VotreNom"; // Remplacez VotreNom par votre propre nom
let age = 30; // Remplacez 30 par votre âge
console.log("Je m'appelle " + nom + " et j'ai " + age + " ans.");
console.log(`Je m'appelle ${nom} et j'ai ${age} ans.`);
Constantes
Exercice : Déclarez une constante PI et assignez-lui la valeur de π (3.14 peut suffire pour cet exercice). Essayez de lui réassigner une valeur pour voir ce qui se passe.
const PI = 3.14;
console.log(PI);
// PI = 3.15; // Ceci va générer une erreur
Types Primitifs
Exercice : Créez des variables pour stocker un exemple de chaque type primitif en JavaScript
(String, Number, Boolean, null, undefined, et Symbol).
Affichez le type de chacune de ces variables en utilisant typeof.
let str = "Hello, world!";
let num = 42;
let bool = true;
let nul = null;
let undef;
let sym = Symbol('sym');
console.log(typeof str, typeof num, typeof bool, typeof nul, typeof undef, typeof sym);
Typage Dynamique
Exercice : Déclarez une variable x et assignez-lui une valeur numérique.
Ensuite, réassignez à x une chaîne de caractères. Affichez le type de x après chaque assignation.
let x = 20;
console.log(typeof x); // number
x = "Hello";
console.log(typeof x); // string
Opérateurs d'Affectation
Objectif : Comprendre comment assigner et modifier des valeurs.
Exercice : Créez une variable x avec une valeur initiale de 10. Utilisez différents opérateurs d'affectation pour modifier sa valeur : incrémentez de 5, multipliez par 3, et soustrayez 1.
let x = 10;
x += 5; // x vaut maintenant 15
x *= 3; // x vaut maintenant 45
x -= 1; // x vaut maintenant 44
console.log(x);
Opérations Mathématiques
Objectif : Effectuer des opérations mathématiques simples.
Exercice : Créez deux variables a et b, assignez-leur des valeurs numériques, puis effectuez l'addition, la soustraction, la multiplication et la division de ces deux variables. Affichez le résultat de chaque opération dans la console.
let a = 5;
let b = 2;
console.log("Addition: ", a + b);
console.log("Soustraction: ", a - b);
console.log("Multiplication: ", a * b);
console.log("Division: ", a / b);
Opérateurs Arithmétiques
Objectif : Pratiquer les opérations mathématiques de base.
Exercice : Calculez l'aire d'un cercle avec un rayon de 7. Utilisez l'opérateur de multiplication * et rappelez-vous que l'aire d'un cercle est π fois le carré du rayon.
let rayon = 7;
let aire = Math.PI * (rayon * rayon);
console.log("L'aire du cercle est: ", aire);
Opérateurs de Comparaison
Objectif : Comparer des valeurs pour obtenir un booléen.
Exercice : Comparez si a est supérieur à b, où a est 15 et b est 10. Ensuite, vérifiez si a est inférieur ou égal à b.
let a = 15;
let b = 10;
console.log(a > b); // Doit afficher true
console.log(a <= b); // Doit afficher false
Opérateurs d'Égalité
Objectif : Distinguer l'égalité stricte de l'égalité faible.
Exercice : Comparez c à d d'abord avec l'opérateur d'égalité faible (==) puis avec l'opérateur d'égalité stricte (===), où c est 5 et d est "5".
let c = 5;
let d = "5";
console.log(c == d); // Doit afficher true
console.log(c === d); // Doit afficher false
Opérateur Ternaire
Objectif : Utiliser l'opérateur ternaire pour une affectation conditionnelle.
Exercice : Utilisez l'opérateur ternaire pour assigner à une variable message la valeur "Adulte" si age est supérieur ou égal à 18, sinon "Mineur".
let age = 20;
let message = age >= 18 ? "Adulte" : "Mineur";
console.log(message);
Opérateurs Logiques
Objectif : Combiner des conditions avec des opérateurs logiques.
Exercice : Vérifiez si e est entre 10 et 20 (inclus). Utilisez les opérateurs logiques && pour cette vérification.
let e = 15;
console.log(e >= 10 && e <= 20); // Doit afficher true
Opérateurs Logiques avec des Non-booléens
Objectif : Comprendre comment les opérateurs logiques fonctionnent avec des valeurs non booléennes.
Exercice : Utilisez l'opérateur || pour retourner la première valeur "truthy" parmi f, g, et h, où f est null, g est undefined, et h est "hello"
let f = null;
let g = undefined;
let h = "hello";
console.log(f || g || h); // Doit afficher "hello"
Structures Conditionnelles
Objectif : Utiliser des instructions conditionnelles pour effectuer des choix.
Exercice : Écrivez un script qui compare l'âge de l'utilisateur à 18. Si l'âge est supérieur ou égal à 18, affichez "Vous êtes majeur". Sinon, affichez "Vous êtes mineur".
let ageUtilisateur = 16; // Changez cette valeur pour tester
if (ageUtilisateur >= 18) {
console.log("Vous êtes majeur.");
} else {
console.log("Vous êtes mineur.");
}
Boucles
Objectif : Comprendre comment fonctionnent les boucles en JavaScript.
Exercice : Utilisez une boucle for pour afficher les nombres de 1 à 10 dans la console.
for (let i = 1; i <= 10; i++) {
console.log(i);
}
Fonctions
Objectif : Apprendre à définir et à appeler des fonctions.
Exercice : Créez une fonction saluer qui prend un nom en paramètre et affiche "Bonjour, [nom] !" dans la console. Appelez cette fonction avec différents noms.
function saluer(nom) {
console.log("Bonjour, " + nom + " !");
}
saluer("Alice");
saluer("Bob");
Exercice : Créez une fonction anonyme qui retourne la somme de deux nombres et assignez-la à une variable. Utilisez ensuite cette variable pour calculer la somme de deux nombres.
let somme = function(a, b) {
return a + b;
};
console.log(somme(5, 7));
Exercice : Définissez une fonction fléchée qui prend un tableau de nombres et retourne le double de chaque nombre dans un nouveau tableau. Utilisez cette fonction sur un tableau de nombres.
let doubler = nombres => nombres.map(n => n * 2);
console.log(doubler([1, 2, 3, 4]));
Exercice : Écrivez une fonction IIFE (Immediately Invoked Function Expression) qui affiche "Bonjour, monde !" dans la console.
(function() {
console.log("Bonjour, monde !");
})();
Tableaux
Objectif : Manipuler des listes de données.
Exercice : Créez un tableau contenant quelques-uns de vos films ou livres préférés. Utilisez une boucle pour afficher chaque élément du tableau dans la console.
let livres = ["Le Seigneur des Anneaux", "Harry Potter", "Le Guide du voyageur galactique"];
for (let i = 0; i < livres.length; i++) {
console.log(livres[i]);
}
Exercice : Créez un tableau couleurs contenant trois noms de couleurs sous forme
de chaînes de caractères.Ajoutez une couleur au tableau et affichez le tableau entier dans la console.
let couleurs = ['Rouge', 'Vert', 'Bleu'];
couleurs.push('Jaune');
console.log(couleurs);
Objets
Objectif : Comprendre les bases des objets en JavaScript.
Exercice : Créez un objet personne qui contient des propriétés pour le nom, l'age, et une méthode sePresenter qui affiche une phrase de présentation utilisant ces propriétés.
let personne = {
nom: "Alice",
age: 30,
ville: 'Paris',
sePresenter: function() {
console.log("Bonjour, je m'appelle " + this.nom + " et j'ai " + this.age + " ans.");
}
};
personne.sePresenter();
console.log(personne.nom + ' ' + personne.ville)