JavaScript — fiche de révision

Intégrer

html

<script src="script.js"
        defer></script>

Dans le <head> avec defer, ou en fin de <body>. Sinon le DOM n'existe pas encore.

Console : F12 · console.log(), .error(), .table()

Variables

`const`	par défaut
`let`	si ça change
`var`	jamais

Types : number, string, boolean, undefined, null, array, object.

typeof x donne le type.

⚡ Toujours `===`

js

5 ==  "5"   // true  ✘
5 === "5"   // false ✔
0 ==  ""    // true  ✘

== convertit avant de comparer. === compare valeur + type.

⚡ Le piège du `+`

js

2 + 3          // 5
"2" + 3        // "23"  ✘
Number("2")+3  // 5     ✔

.value et prompt() rendent toujours du texte. Convertir avant de calculer.

Opérateurs

Calcul : + - * / % **

Comparaison : === !== > < >= <=

Logique : && (et) · || (ou) · ! (non)

Template literal : `J'ai ${age} ans`

Conditions

js

if (a < b) {
} else if (a === b) {
} else {
}

switch (x) {
  case 1: … break;
  default: …
}

Sans break, le switch « tombe » dans les cas suivants.

Boucles

js

for (let i=0; i<n; i++) { }

while (cond) { }

do { } while (cond);

do…while tourne au moins une fois. Toute boucle doit faire évoluer sa condition.

Fonctions

js

function f(a, b) { return a+b; }

const g = function(a){ … };

const h = (a, b) => a - b;

function s(nom = "Invité") { }

Déclarée = hoistée (appelable avant). Après return, la fonction s'arrête.

DOM — sélectionner

`getElementById()`	par id
`querySelector()`	1er, sélecteur CSS
`querySelectorAll()`	tous

DOM — modifier

`.textContent`	texte — sûr
`.innerHTML`	HTML — risque XSS
`.style.backgroundColor`	camelCase !
`.classList.add/remove/toggle`	à privilégier
`createElement` + `appendChild`	créer

Événements

js

el.addEventListener("click", fn);
// fn SANS parenthèses !

click · dblclick · mouseover/mouseout · keydown/keyup · submit · change

⚡ Validation

js

form.addEventListener("submit",
  function (e) {
    e.preventDefault();  // ← clé
    …
});

.value · .checked · .trim() · .length

Email : /^[^\s@]+@[^\s@]+\.[^\s@]+$/

Le client = confort. La sécurité est côté serveur.