JavaScript

let nom = 'Alice';
const PI = 3.14;

typeof 'hello'    // 'string'
typeof 42         // 'number'
typeof true       // 'boolean'
typeof undefined  // 'undefined'
typeof null       // 'object' (bug historique)
typeof []         // 'object'

const str = 'texte';       // string
const num = 42;            // number
const bool = true;         // boolean
const nul = null;          // null
const undef = undefined;   // undefined
const sym = Symbol('id');  // symbol
const big = 9007199254740991n; // bigint

function saluer(nom) {
  return `Bonjour ${nom}`;
}

const saluer = (nom) => `Bonjour ${nom}`;

function creer(nom, role = 'user') {
  return { nom, role };
}

function somme(...nombres) {
  return nombres.reduce((a, b) => a + b, 0);
}

const fruits = ['pomme', 'banane', 'cerise'];

const doubles = [1, 2, 3].map(n => n * 2);
// [2, 4, 6]

const pairs = [1, 2, 3, 4].filter(n => n % 2 === 0);
// [2, 4]

const somme = [1, 2, 3].reduce((acc, n) => acc + n, 0);
// 6

const users = [{nom: 'Alice'}, {nom: 'Bob'}];
const user = users.find(u => u.nom === 'Bob');
const index = users.findIndex(u => u.nom === 'Bob');

[1, 2, 3].some(n => n > 2);   // true
[1, 2, 3].every(n => n > 0);  // true

const sub = [1, 2, 3, 4].slice(1, 3);
// [2, 3]

const arr = [1, 2, 3, 4];
arr.splice(1, 2); // supprime 2 éléments à l'index 1
// arr = [1, 4]

const nums = [3, 1, 2];
nums.sort((a, b) => a - b); // [1, 2, 3] croissant
nums.sort((a, b) => b - a); // [3, 2, 1] décroissant

[[1, 2], [3, 4]].flat();       // [1, 2, 3, 4]
[1, 2].flatMap(n => [n, n*2]); // [1, 2, 2, 4]

const tous = [...fruits, 'mangue'];
const copie = [...fruits];

const user = { nom: 'Alice', age: 30 };

user.nom          // 'Alice'
user['age']       // 30

Object.keys(user);    // ['nom', 'age']
Object.values(user);  // ['Alice', 30]
Object.entries(user); // [['nom', 'Alice'], ['age', 30]]

const merged = { ...user, role: 'admin' };
const merged2 = Object.assign({}, user, { role: 'admin' });

'nom' in user             // true
user.hasOwnProperty('nom') // true

const ville = user?.adresse?.ville ?? 'inconnue';

const msg = `Bonjour ${nom}, vous avez ${age} ans`;

'hello'.length              // 5
'hello'.toUpperCase()       // 'HELLO'
'  hello  '.trim()          // 'hello'
'hello world'.split(' ')    // ['hello', 'world']
'hello'.includes('ell')     // true
'hello'.startsWith('he')    // true
'hello'.replace('l', 'L')   // 'heLlo'
'hello'.replaceAll('l', 'L') // 'heLLo'
'ha'.repeat(3)              // 'hahaha'
'hello'.slice(1, 3)         // 'el'
'hello'.indexOf('l')        // 2

'5'.padStart(3, '0')  // '005'
'5'.padEnd(3, '0')    // '500'

const [a, b, ...reste] = [1, 2, 3, 4];
// a=1, b=2, reste=[3,4]

const { nom, age, role = 'user' } = user;

const { nom: username } = user;

const copie = { ...user };
const enrichi = { ...user, email: 'a@b.com' };

const p = new Promise((resolve, reject) => {
  resolve('OK');
});

fetch('/api/data')
  .then(res => res.json())
  .then(data => console.log(data))
  .catch(err => console.error(err))
  .finally(() => console.log('terminé'));

async function getData() {
  try {
    const res = await fetch('/api/data');
    const data = await res.json();
    return data;
  } catch (err) {
    console.error(err);
  }
}

const [users, posts] = await Promise.all([
  fetch('/api/users').then(r => r.json()),
  fetch('/api/posts').then(r => r.json()),
]);

const result = await Promise.race([
  fetch('/api/fast'),
  fetch('/api/slow'),
]);

export const PI = 3.14;
export function add(a, b) { return a + b; }

export default class User { }

import { PI, add } from './math.js';

import User from './user.js';

import { add as addition } from './math.js';
import * as math from './math.js';

const module = await import('./heavy-module.js');

document.querySelector('.classe');
document.querySelectorAll('div');
document.getElementById('monId');

const div = document.createElement('div');
div.textContent = 'Nouveau contenu';
document.body.appendChild(div);

button.addEventListener('click', (e) => {
  console.log('cliqué !', e.target);
});

const handler = () => console.log('click');
button.addEventListener('click', handler);
button.removeEventListener('click', handler);

element.classList.add('active');
element.classList.remove('active');
element.classList.toggle('active');
element.classList.contains('active'); // true/false

element.style.color = 'red';
element.style.display = 'none';

element.dataset.userId       // lit data-user-id
element.dataset.userId = '5' // écrit data-user-id="5"