🌤️ Bases & syntaxe
- déclarations:
let
const
var
function nom(param) { ... }
ou const f = () => {}
- Types :
string
number
boolean
null
undefined
object
array
- Commentaires :
//
et /* ... */
⚙️ Contrôle de flux
if (condition) {
// code
} else if (autreCondition) {
// code
} else {
// code
}
for (let i = 0; i < 5; i++) {
console.log(i);
}
while (condition) {
// code
}
🧹 Fonctions
function addition(a, b) {
return a + b;
}
const mult = (a, b) => a * b;
- Arguments par défaut :
function f(x=5) {}
- Fonctions anonymes, callbacks
📆 Objets & tableaux
const obj = { nom: 'Alice', age: 25 };
const arr = [1, 2, 3];
console.log(obj.nom);
console.log(arr[0]);
- Destructuration :
const {nom} = obj;
- Méthodes tableaux :
map
filter
reduce
🔄 Asynchronicité
async function fetchData() {
const response = await fetch('url');
const data = await response.json();
return data;
}
Promises
et async/await
.then()
et .catch()
🧠 Manipulation DOM
const el = document.getElementById('monId');
el.textContent = 'Hello';
const btn = document.querySelector('button');
btn.addEventListener('click', () => alert('clic !'));
⚠️ Gestion d'erreurs
try {
// code potentiellement risqué
} catch (e) {
console.error(e);
} finally {
// toujours exécuté
}
🎯 ES6+ fonctionnalités
- Template literals :
`Bonjour ${nom}`
- Spread/rest :
...array
- Modules :
import/export
- Classes :
class MaClasse {}
🛠️ Outils utiles
- MDN Web Docs : documentation officielle
- ESLint : linter JS
- Prettier : formatteur de code
📋 Bonnes pratiques
- Utiliser
const
par défaut, let
si modifiable - Ne pas polluer l’espace global
- Éviter les callbacks imbriqués (favoriser Promises)
- Commenter clairement
- Modulaire : export/import ES6
- Création dynamique du DOM
- Facile à intégrer dans une SPA ou un site statique