Apprendre JavaScript avec une structure claire, pratique et maintenable.

040 • Array Big Introduction

Les tableaux permettent de stocker plusieurs valeurs dans un ordre précis.

let myFriends = ["Ahmed", "Mohamed", "Sayed"];

042 • Add And Remove From Array

Les méthodes `unshift`, `push`, `shift` et `pop` servent à ajouter ou retirer des éléments au début ou à la fin.

066 • Arrow Function Syntax

Les fonctions fléchées raccourcissent la syntaxe, surtout avec les callbacks et transformations de tableaux.

071 • Higher Order Functions - Map

`map()` crée un nouveau tableau en transformant chaque élément de l’original.

let array = [1, 2, 3, 4];
let doubled = array.map((element) => element + element);

console.log(doubled);

074 • Higher Order Functions - Filter

`filter()` conserve seulement les éléments répondant à une condition.

let sentence = "I Love Food Code Too Playing Much";
let smallWords = sentence
  .split(" ")
  .filter((word) => word.length <= 4)
  .join(" ");

115 • Destructuring Arrays

Le destructuring permet d’extraire rapidement des valeurs d’un tableau et même de faire des permutations.

let myFriends = ["Ahmed", "Sayed", "Ali"];
let [x, y, z] = myFriends;

[x, y] = [y, x];

118 • Destructuring Objects

Très utile pour lire des propriétés profondes et renommer des variables localement.

const user = {
  theName: "Osama",
  theAge: 39,
  skills: { html: 70, css: 80 }
};

const {
  theName: name,
  skills: { html, css }
} = user;

123 • Set Data Types And Methods

`Set` stocke des valeurs uniques et supprime naturellement les doublons.

let myData = [1, 1, 1, 2, 3];
let myUniqueData = new Set(myData);

124 • Set vs WeakSet

• `Set` peut stocker tout type de valeur.
• `WeakSet` ne stocke que des objets.
• `WeakSet` n’a pas de propriété `size`.

129 • Array.copyWithin Method

Copie une portion d’un tableau vers une autre position du même tableau, sans changer sa longueur.

148 • Constructor Function Introduction

function User(id, username, salary) {
  this.id = id;
  this.u = username;
  this.s = salary + 1000;
}

let userOne = new User(100, "Hassan", 5000);

150 • Properties And Methods

class User {
  constructor(id, username, salary) {
    this.i = id;
    this.u = username || "Unknown";
    this.s = salary < 6000 ? salary + 500 : salary;
  }

  writeMsg() {
    return `Hello ${this.u} Your Salary Is ${this.s}`;
  }
}

151 • Update Properties

class User {
  constructor(id, username, salary) {
    this.i = id;
    this.u = username;
    this.s = salary;
  }

  updateName(newName) {
    this.u = newName;
  }
}

152–154 • Static, Inheritance, Encapsulation

Les `static` appartiennent à la classe, `extends` permet l’héritage, et les champs privés encapsulent les données.

155 • Prototype Introduction

Les prototypes permettent aux objets JavaScript d’hériter de comportements communs.

class User {
  constructor(id, username) {
    this.i = id;
    this.u = username;
  }
}

User.prototype;

Generator Function

Une fonction génératrice produit des valeurs à la demande via `yield`.

function* generateNumbers() {
  yield 1;
  yield 2;
}

const generator = generateNumbers();
generator.next();

169 • What Is JSON

JSON est un format léger d’échange de données entre client et serveur.

172 • Parse And Stringify

const fromServer = '{"Username":"Osama","Age":39}';
const jsObject = JSON.parse(fromServer);

jsObject["Username"] = "Elzero";

const toServer = JSON.stringify(jsObject);

173 • Asynchronous

• Le synchrone exécute dans l’ordre.
• L’asynchrone permet de continuer sans bloquer l’interface.
• Base nécessaire pour comprendre `fetch`, `Promise` et AJAX.

174 • Call Stack And Web API

setTimeout(() => {
  console.log("Web API");
}, 0);

function one() {
  console.log("One");
}

176 • What Is AJAX

AJAX combine JavaScript, DOM et `XMLHttpRequest` pour échanger des données sans recharger toute la page.

177 • Request And Response

Les réponses HTTP, les états de requête et la gestion d’erreurs sont des bases essentielles pour les APIs réelles.