Cours Complet JavaScript 2026 : De Débutant à Expert avec ES6, jQuery et Ajax

Cours complet JavaScript · 40 QCM

📋 Table des matières

🟨 1️⃣

Introduction

JavaScript : langage interprété, orienté objet, côté client (navigateur) et serveur (Node.js). Créé en 1995 par Brendan Eich.

interpréténavigateurES6Node.js

// Premier script
console.log("Bonjour JavaScript !");
alert("Hello world");

🟨 2️⃣

Variables & types

let (modifiable), const (constante), var (ancien). Types : number, string, boolean, null, undefined, symbol, bigint.

letconsttypeof

let age = 25;
const PI = 3.14;
let nom = "Alice";
let estVrai = true;
console.log(typeof age); // "number"

🟨 3️⃣

Opérateurs

Arithmétiques, comparaison (===, !==), logiques (&&, ||, !), coalescence (??), chaînage optionnel (?.)

===???.

5 == "5"   // true
5 === "5"  // false
null ?? "défaut" // "défaut"
const obj = { a: 1 };
console.log(obj?.b?.c); // undefined

🟨 4️⃣

if / switch

if, else if, else, switch avec comparaison stricte.

const note = 15;
if (note >= 18) console.log("Excellent");
else if (note >= 14) console.log("Bien");
else console.log("Peut mieux faire");

const jour = 2;
switch(jour) {
  case 1: console.log("Lundi"); break;
  case 2: console.log("Mardi"); break;
  default: console.log("Autre");
}

🟨 5️⃣

Boucles

for, while, do...while, for...of (valeurs), for...in (clés).

for (let i=0; i<3; i++) console.log(i);
const arr = ['a','b','c'];
for (const el of arr) console.log(el);
const obj = {x:1, y:2};
for (const key in obj) console.log(key);

🟨 6️⃣

Fonctions

Déclaration, expression, arrow functions, paramètres par défaut, rest.

function()=>

function add(a,b) { return a+b; }
const mult = (a,b) => a*b;
const bonjour = (nom="inconnu") => `Bonjour ${nom}`;
console.log(bonjour("Ali"));

🟨 7️⃣

Portée & closure

let/const ont une portée de bloc. var a une portée de fonction. Les closures retiennent l'environnement.

function createCounter() {
  let count = 0;
  return () => ++count;
}
const c = createCounter();
console.log(c()); // 1

🟨 8️⃣

Chaînes (strings)

Méthodes : length, slice(), replace(), toUpperCase(), split(), template literals.

let s = "JavaScript";
console.log(s.length);       // 10
console.log(s.slice(0,4));   // "Java"
console.log(s.includes("Script")); // true
let age = 25;
console.log(`J'ai ${age} ans`);

🟨 9️⃣

Tableaux

map, filter, reduce, find, some, every, spread ...

const nums = [1,2,3,4];
const doubles = nums.map(x => x*2);
const pairs = nums.filter(x => x%2===0);
const sum = nums.reduce((acc,val) => acc+val, 0);
console.log([...nums, 5]); // [1,2,3,4,5]

🟨 🔟

Objets & JSON

Création, accès, Object.keys/values/entries, JSON.stringify/parse.

const user = { name: "Ali", age: 30 };
console.log(user.name);
const keys = Object.keys(user);
const json = JSON.stringify(user);
const obj = JSON.parse(json);

🟨 1️⃣1️⃣

Manipulation du DOM

querySelector, innerHTML, textContent, createElement, append.

// Exemple : sélection et modification
const titre = document.querySelector('h1');
titre.textContent = "Nouveau titre";
const div = document.createElement('div');
div.innerHTML = "Bonjour";
document.body.append(div);

🟨 1️⃣2️⃣

Événements

addEventListener, objets event, délégation.

const btn = document.querySelector('#btn');
btn.addEventListener('click', (e) => {
  alert('Cliqué !');
});

🟨 1️⃣3️⃣

Classes (ES6)

Constructeur, méthodes, héritage, champs privés (#), getters/setters.

class Animal {
  constructor(name) { this.name = name; }
  parler() { return "?"; }
}
class Chien extends Animal {
  parler() { return "Wouf"; }
}
const c = new Chien("Rex");
console.log(c.parler());

🟨 1️⃣4️⃣

Asynchrone

Promise, async/await, setTimeout, setInterval.

const p = new Promise((resolve) => {
  setTimeout(() => resolve("OK"), 1000);
});
p.then(console.log);

async function test() {
  const res = await p;
  console.log(res);
}

🟨 1️⃣5️⃣

Fetch & AJAX

Requêtes HTTP avec fetch, gestion des réponses.

fetch('https://api.example.com/data')
  .then(res => res.json())
  .then(data => console.log(data))
  .catch(err => console.error(err));

// avec async
async function getData() {
  const res = await fetch(url);
  const json = await res.json();
}

🟨 1️⃣6️⃣

Stockage

localStorage (persistant), sessionStorage (session).

localStorage.setItem('key', 'value');
const val = localStorage.getItem('key');
localStorage.removeItem('key');
// Stocker des objets
localStorage.setItem('user', JSON.stringify({name:'Ali'}));
const user = JSON.parse(localStorage.getItem('user'));

🟨 1️⃣7️⃣

Modules ES6

export / import, import par défaut, import nommé.

// fichier math.js
export const add = (a,b) => a+b;
export default function multiply(a,b) { return a*b; }

// autre fichier
import multiply, { add } from './math.js';

🟨 1️⃣8️⃣

Regex

test(), exec(), match(), replace() avec regex.

const re = /^[a-z]+$/i;
console.log(re.test("Hello")); // true
const texte = "Prix: 12€";
const chiffre = texte.match(/\d+/);
console.log(chiffre[0]); // "12"

🟨 1️⃣9️⃣

Date

Objet Date, méthodes getFullYear(), toLocaleDateString(), etc.

const now = new Date();
console.log(now.getFullYear());
console.log(now.toLocaleDateString('fr-FR'));
const timestamp = Date.now();

🟨 2️⃣0️⃣

Gestion d'erreurs

try...catch...finally, throw, erreurs personnalisées.

try {
  let x = y; // ReferenceError
} catch (err) {
  console.error(err.message);
} finally {
  console.log("Terminé");
}

🟨 2️⃣1️⃣

Bonnes pratiques

Utiliser const/let, éviter ==, nommer clairement, fonctions pures, commentaires utiles.

// ✅
const MAX = 100;
function double(x) { return x * 2; }
// ❌ à éviter
var x = 10;

Breaking

dimanche 15 février 2026

Cours Complet JavaScript 2026 : De Débutant à Expert avec ES6, jQuery et Ajax

🟨 Cours complet JavaScript · De A à Z