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