GARAGENUM/docs
GARAGENUM/docs
15
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

corrections de presentation
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Grégory Lebreton 2025-07-05 10:50:33 +02:00
parent 3daeea726d
commit 47bdd2fda3
1 changed files with 48 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
docs/cours/js/javascript.md
View File

@ -27,38 +27,38 @@ JavaScript a été créé en 1995 par **Brendan Eich** chez Netscape. Il ne faut
### 🔑 Mots-clés courants ### 🔑 Mots-clés courants
| Mot-clé | Description | | Mot-clé | Description |
|-------------|-------------| |-------------|---------------------------------------------------------------|
| `var` | Déclare une variable (ancienne méthode, portée fonctionnelle) | | `var` | Déclare une variable (ancienne méthode, portée fonctionnelle) |
| `let` | Déclare une variable à portée de bloc | | `let` | Déclare une variable à portée de bloc |
| `const` | Déclare une constante à portée de bloc | | `const` | Déclare une constante à portée de bloc |
| `function` | Déclare une fonction | | `function` | Déclare une fonction |
| `return` | Retourne une valeur depuis une fonction | | `return` | Retourne une valeur depuis une fonction |
| `if`, `else`, `switch` | Contrôle de flux conditionnel | | `if`, `else`, `switch` | Contrôle de flux conditionnel |
| `for`, `while`, `do...while` | Boucles | | `for`, `while`, `do...while` | Boucles |
| `break` | Interrompt une boucle ou un switch | | `break` | Interrompt une boucle ou un switch |
| `continue` | Passe à l’itération suivante d’une boucle | | `continue` | Passe à l’itération suivante d’une boucle |
| `try`, `catch`, `finally` | Gestion des erreurs | | `try`, `catch`, `finally` | Gestion des erreurs |
| `throw` | Lance une erreur personnalisée | | `throw` | Lance une erreur personnalisée |
| `class`, `extends`, `super` | Programmation orientée objet | | `class`, `extends`, `super` | Programmation orientée objet |
| `import`, `export` | Modules JavaScript (ES6) | | `import`, `export` | Modules JavaScript (ES6) |
| `async`, `await` | Programmation asynchrone | | `async`, `await` | Programmation asynchrone |
--- ---
### 🔧 Fonctions intégrées utiles ### 🔧 Fonctions intégrées utiles
| Fonction | Description | | Fonction | Description |
|------------------|-------------| |------------------|-----------------------------------------|
| `alert()` | Affiche une boîte de dialogue d’alerte | | `alert()` | Affiche une boîte de dialogue d’alerte |
| `console.log()` | Affiche un message dans la console | | `console.log()` | Affiche un message dans la console |
| `prompt()` | Demande une saisie utilisateur | | `prompt()` | Demande une saisie utilisateur |
| `parseInt()` | Convertit une chaîne en entier | | `parseInt()` | Convertit une chaîne en entier |
| `parseFloat()` | Convertit une chaîne en nombre flottant | | `parseFloat()` | Convertit une chaîne en nombre flottant |
| `isNaN()` | Vérifie si une valeur n’est pas un nombre | | `isNaN()` | Vérifie si une valeur n’est pas un nombre |
| `typeof` | Renvoie le type d’une variable | | `typeof` | Renvoie le type d’une variable |
| `Array.isArray()`| Vérifie si une valeur est un tableau | | `Array.isArray()`| Vérifie si une valeur est un tableau |
| `setTimeout()` | Exécute une fonction après un délai | | `setTimeout()` | Exécute une fonction après un délai |
| `setInterval()` | Exécute une fonction de manière répétée à intervalle régulier | | `setInterval()` | Exécute une fonction de manière répétée à intervalle régulier |
--- ---
@ -78,6 +78,7 @@ if (nom) {
## 🌱 Les bases de JavaScript ## 🌱 Les bases de JavaScript
### Intégration dans une page HTML ### Intégration dans une page HTML
``` { .html .copy } ``` { .html .copy }
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
@ -99,6 +100,7 @@ Ou directement dans une balise `<script>` :
``` ```
### Variables ### Variables
``` { .js .copy } ``` { .js .copy }
let nom = "Alice"; // variable modifiable let nom = "Alice"; // variable modifiable
const PI = 3.14; // constante const PI = 3.14; // constante
@ -106,6 +108,7 @@ var age = 30; // ancienne syntaxe, à éviter
``` ```
### Types de données ### Types de données
- `string` : `"Bonjour"` - `string` : `"Bonjour"`
- `number` : `42`, `3.14` - `number` : `42`, `3.14`
- `boolean` : `true`, `false` - `boolean` : `true`, `false`
@ -114,13 +117,14 @@ var age = 30; // ancienne syntaxe, à éviter
- `object`, `array`, `function` - `object`, `array`, `function`
### Opérateurs ### Opérateurs
- Arithmétiques : `+`, `-`, `*`, `/`, `%` - Arithmétiques : `+`, `-`, `*`, `/`, `%`
- Comparaison : `==`, `===`, `!=`, `!==`, `<`, `>`, `<=`, `>=` - Comparaison : `==`, `===`, `!=`, `!==`, `<`, `>`, `<=`, `>=`
- Logiques : `&&`, `||`, `!` - Logiques : `&&`, `||`, `!` // et, ou et inverse
#### 🔍 `==` vs `===` en JavaScript #### 🔍 `==` vs `===` en JavaScript
| Expression | `==` (Égalité lâche) | `===` (Égalité stricte) | | Expression | `==` (Égalité lâche) | `===` (Égalité stricte) |
|-------------------------|----------------------|--------------------------| |-------------------------|----------------------|--------------------------|
| `'5' == 5` | ✅ `true` | ❌ `false` | | `'5' == 5` | ✅ `true` | ❌ `false` |
| `0 == false` | ✅ `true` | ❌ `false` | | `0 == false` | ✅ `true` | ❌ `false` |
@ -141,6 +145,7 @@ var age = 30; // ancienne syntaxe, à éviter
## Contrôle de flux ## Contrôle de flux
### Conditions ### Conditions
``` { .js .copy } ``` { .js .copy }
if (age > 18) { if (age > 18) {
console.log("Majeur"); console.log("Majeur");
@ -155,6 +160,7 @@ let message = (age > 18) ? "Majeur" : "Mineur";
``` ```
### Boucles ### Boucles
``` { .js .copy } ``` { .js .copy }
for (let i = 0; i < 5; i++) { for (let i = 0; i < 5; i++) {
console.log(i); console.log(i);
@ -170,6 +176,7 @@ while (i < 5) {
--- ---
## Fonctions ## Fonctions
``` { .js .copy } ``` { .js .copy }
function saluer(nom) { function saluer(nom) {
return `Bonjour ${nom}`; return `Bonjour ${nom}`;
@ -183,6 +190,7 @@ const direBonjour = (nom) => `Bonjour ${nom}`;
## Tableaux et objets ## Tableaux et objets
### Tableaux ### Tableaux
``` { .js .copy } ``` { .js .copy }
let fruits = ["pomme", "banane"]; let fruits = ["pomme", "banane"];
fruits.push("kiwi"); fruits.push("kiwi");
@ -190,6 +198,7 @@ console.log(fruits[0]); // pomme
``` ```
### Objets ### Objets
``` { .js .copy } ``` { .js .copy }
let personne = { let personne = {
nom: "Alice", nom: "Alice",
@ -210,16 +219,19 @@ personne.parler();
[Definition DOM](https://fr.wikipedia.org/wiki/Document_Object_Model) [Definition DOM](https://fr.wikipedia.org/wiki/Document_Object_Model)
### Sélection des éléments ### Sélection des éléments
``` { .js .copy } ``` { .js .copy }
const titre = document.querySelector("h1"); const titre = document.querySelector("h1");
``` ```
### 5.2 Modification du contenu ### Modification du contenu
``` { .js .copy } ``` { .js .copy }
titre.textContent = "Nouveau Titre"; titre.textContent = "Nouveau Titre";
``` ```
### 5.3 Événements ### Événements
``` { .js .copy } ``` { .js .copy }
document.querySelector("button").addEventListener("click", () => { document.querySelector("button").addEventListener("click", () => {
alert("Clic !"); alert("Clic !");
@ -244,9 +256,10 @@ document.getElementById("incrementer").addEventListener("click", () => {
--- ---
## 6. Asynchrone et AJAX ## Asynchrone et AJAX
### setTimeout / setInterval ### setTimeout / setInterval
``` { .js .copy } ``` { .js .copy }
setTimeout(() => { setTimeout(() => {
console.log("1 seconde"); console.log("1 seconde");
@ -254,6 +267,7 @@ setTimeout(() => {
``` ```
### Promesses ### Promesses
``` { .js .copy } ``` { .js .copy }
fetch("https://api.example.com/data") fetch("https://api.example.com/data")
.then(response => response.json()) .then(response => response.json())
@ -266,6 +280,7 @@ fetch("https://api.example.com/data")
## Concepts avancés ## Concepts avancés
### Closures ### Closures
``` { .js .copy } ``` { .js .copy }
function createCounter() { function createCounter() {
let count = 0; let count = 0;
@ -277,6 +292,7 @@ console.log(counter()); // 1
``` ```
### Classes ### Classes
``` { .js .copy } ``` { .js .copy }
class Animal { class Animal {
constructor(nom) { constructor(nom) {
@ -290,6 +306,7 @@ class Animal {
``` ```
### Modules (ES6) ### Modules (ES6)
``` { .js .copy } ``` { .js .copy }
// fichier.js // fichier.js
export function addition(a, b) { export function addition(a, b) {
@ -301,6 +318,7 @@ import { addition } from "./fichier. { .js .copy }";
``` ```
### Async / Await ### Async / Await
``` { .js .copy } ``` { .js .copy }
async function getData() { async function getData() {
try { try {
@ -320,4 +338,5 @@ async function getData() {
- [MDN JavaScript Guide](https://developer.mozilla.org/fr/docs/Web/JavaScript/Guide) - [MDN JavaScript Guide](https://developer.mozilla.org/fr/docs/Web/JavaScript/Guide)
- [JavaScript.info](https://javascript.info/) - [JavaScript.info](https://javascript.info/)
- [W3Schools JavaScript](https://www.w3schools.com/js/) - [W3Schools JavaScript](https://www.w3schools.com/js/)
- [Codingame](https://www.codingame.com/start/fr/)