Forem: Claire D.

La gestion de fichiers et Streams en Node.js avec fs

Claire D. — Fri, 26 Jan 2024 10:26:49 +0000

Le module fs (File System) de Node.js est un outil fondamental pour interagir avec le système de fichiers, offrant un éventail de fonctionnalités puissantes et flexibles.

Il permet d'accomplir une variété de tâches, des actions simples comme la lecture et l'écriture de fichiers, à des opérations plus complexes telles que la gestion de répertoires et l'obtention de statistiques sur le système de fichiers.

Comment l'utiliser ? 🛠️

Voici les méthodes les plus fréquemment utilisées.

📖 Lire un fichier : `fs.readFile(path[, options], callback)`

const fs = require('fs');

fs.readFile('text.txt', 'utf8', (err, data) => {
    if (err) {
        console.error(`Error reading file: ${err.message}`);
        return;
    }
    console.log('File content:', data);
});

📝 Écrire dans un fichier : `fs.writeFile(file, data[, options], callback)`

const fs = require('fs');

const contentToWrite = 'Bonjour tout le monde !';

fs.writeFile('output.txt', contentToWrite, 'utf8', (err) => {
    if (err) {
        console.error(`Error writing to file: ${err.message}`);
        return;
    }
    console.log('File has been written successfully.');
});

✨ Renommer un fichier : `fs.rename(oldPath, newPath, callback)`

const fs = require('fs');

const oldFilePath = 'oldfile.txt';
const newFilePath = 'newfile.txt';

fs.rename(oldFilePath, newFilePath, (err) => {
    if (err) {
        console.error(`Error renaming file: ${err.message}`);
        return;
    }
    console.log('File has been renamed successfully.');
});

📂 Copier un fichier : `fs.copyFile(srcPath, destPath, callback)`

const fs = require('fs');

const sourceFilePath = 'sourcefile.txt';
const destinationFilePath = 'destinationfile.txt';

fs.copyFile(sourceFilePath, destinationFilePath, (err) => {
    if (err) {
        console.error(`Error copying file: ${err.message}`);
        return;
    }
    console.log('File has been copied successfully.');
});

🗑️ Supprimer un fichier : `fs.unlink(path, callback)`

const fs = require('fs');

const filePathToRemove = 'filetoremove.txt';

fs.unlink(filePathToRemove, (err) => {
    if (err) {
        console.error(`Error removing file: ${err.message}`);
        return;
    }
    console.log('File has been removed successfully.');
});

📂 Lire le contenu d'un répertoire : `fs.readdir(path[, options], callback)`

const fs = require('fs');

const directoryPath = './';

fs.readdir(directoryPath, 'utf8', (err, files) => {
    if (err) {
        console.error(`Error reading directory: ${err.message}`);
        return;
    }
    console.log('Files in the directory:', files);
});

📂 Créer un répertoire : `fs.mkdir(path[, options], callback)`

const fs = require('fs');

const newDirectoryPath = './new_directory';

fs.mkdir(newDirectoryPath, (err) => {
    if (err) {
        console.error(`Error creating directory: ${err.message}`);
        return;
    }
    console.log('Directory created successfully.');
});

📊 Obtenir les informations sur un fichier : `fs.stat(path, callback)`

const fs = require('fs');

const filePath = 'example.txt';

fs.stat(filePath, (err, stats) => {
    if (err) {
        console.error(`Error getting file stats: ${err.message}`);
        return;
    }
    console.log('File stats:', stats);
});

🔍 Vérifier l'accessibilité d'un fichier : `fs.access(path[, mode], callback)`

const fs = require('fs');

fs.readFile('text.txt', 'utf8', (err, data) => {
    if (err) {
        console.error(`Error reading file: ${err.message}`);
        return;
    }
    console.log('File content:', data);
});

🌊 Les Streams Node.js

Les flux Node.js fournissent un mécanisme asynchrone et piloté par les événements pour traiter efficacement les données, ce qui est particulièrement utile lorsqu'il s'agit de fichiers volumineux . L'intégration avec le module fs améliore les capacités de lecture et d'écriture des fichiers.

📖 Lire des fichiers avec un flux : `fs.createReadStream(path[, options])`

const readStream = fs.createReadStream('largeFile.txt', 'utf8');

readStream.on('data', (chunk) => {
    console.log(`Received ${chunk.length} bytes of data.`);
});

readStream.on('end', () => {
    console.log('Reading file using stream completed.');
});

📝 Créer des fichiers avec un flux : `fs.createWriteStream(path[, options])`

const writeStream = fs.createWriteStream('output.txt', 'utf8');

writeStream.write('Writing data using streams.');

writeStream.end();

writeStream.on('finish', () => {
    console.log('Writing to file using stream completed.');
});

Avantages des flux de données :

Efficacité de la mémoire

Les flux fonctionnent par morceaux, ce qui optimise l'utilisation de la mémoire pour les fichiers volumineux.

Performances

Le traitement parallèle avec les flux améliore les performances globales des opérations de fichiers.

Canalisation

Les flux peuvent être facilement regroupés pour rationaliser le traitement des données.

L'intégration du module fs et des flux dans les applications Node.js dote les développeurs d'une puissante boîte à outils pour une manipulation des fichiers et un traitement des données efficaces, évolutifs et réactifs. Qu'il s'agisse de fichiers de petite ou de grande taille, ces modules contribuent à des solutions performantes et économes en ressources.

CORS

Claire D. — Wed, 29 Nov 2023 16:33:20 +0000

Lorsque différents sites web interagissent entre eux, des questions de sécurité se posent. Comment un site peut-il savoir s'il doit faire confiance à un autre pour partager ses ressources ? Voici où entre en jeu CORS, ou Cross-Origin Resource Sharing .

Comprendre CORS

CORS (Cross-Origin Resource Sharing) est un mécanisme de sécurité mis en place par les navigateurs pour contrôler les requêtes faites entre différentes origines (ou domaines). Une "origine" est composée du protocole (http, https), du nom de domaine et du port.

Lorsqu'un site web, comme www.monsite.fr, tente de charger des ressources depuis un autre domaine, comme www.autresite.com le navigateur vérifie si www.autresite.com autorise explicitement www.monsite.fr à accéder à ses ressources. Si cette autorisation est absente ou incorrecte, le navigateur bloque la requête pour des raisons de sécurité.

Mais comment faire si j'ai besoin d'accéder à une API sur un autre domaine quand je développe ?

Pour contourner ces blocages lors du développement

Extensions de Navigateur : Des outils comme "CORS Everywhere" ou des paramètres spécifiques permettent de désactiver temporairement la sécurité CORS sur le navigateur, pratique pour tester les requêtes entre domaines pendant le développement.
- Serveur Proxy : En utilisant un serveur intermédiaire (un proxy) côté serveur, les requêtes peuvent être redirigées. De cette façon, la requête provient du même domaine que le serveur, évitant ainsi les restrictions CORS.

Mais alors, je peux désactiver CORS sur mon site ? 🤔

Quel est le rôle de CORS ?

Non, on ne doit pas autoriser tous les sites !

CORS joue un rôle crucial dans la sécurisation des échanges entre sites web, en abordant plusieurs problèmes de sécurité :

Protection contre les Attaques CSRF : CORS empêche les requêtes non autorisées depuis des sites tiers, ce qui réduit le risque de manipulation de session ou de vol de données.
- Contrôle d'Accès aux Ressources : CORS limite l'accès aux ressources d'un serveur à des domaines spécifiques autorisés, empêchant ainsi des sites malveillants d'accéder à des données sensibles d'un autre site sans autorisation.
- Prévention des Fuites d'Informations : CORS réduit les risques de fuite d'informations sensibles en bloquant les requêtes d'origines non autorisées qui pourraient récupérer des données confidentielles.

Bien configurer les règles CORS

Pour définir des règles CORS, on peut utiliser l'annotation @CrossOrigin dans le contrôleur.

// Exemple de requête GET
fetch('https://tonserveur.com/api/public', {
    method: 'GET',
    headers: {
        'Origin': 'https://www.monclient.com' // Origine autorisée pour cette requête
    }
})
.then(response => response.text())
.then(data => console.log(data))
.catch(error => console.error('Erreur :', error));

En résumé, CORS joue un rôle crucial dans la sécurisation des échanges entre différents sites web. Il est essentiel pour éviter les risques de sécurité sans bloquer complètement les interactions entre domaines. 🛡️

Les Endpoints dans REST

Claire D. — Tue, 28 Nov 2023 16:33:51 +0000

Dans une API RESTful, les endpoints sont les URL spécifiques auxquelles les requêtes HTTP sont adressées pour effectuer des opérations sur les ressources. Ils définissent les actions disponibles pour interagir avec ces ressources.

Qu'est-ce qu'un endpoint ?

Un endpoint est une URL associée à une ressource ou une action sur cette ressource dans une API RESTful.

Chaque endpoint utilise une méthode HTTP spécifique (GET, POST, PUT, DELETE) pour définir l'opération sur la ressource.

Un endpoint suit la structure de l'URL de base de l'API, complétée par un chemin spécifique pour accéder à une ressource.

Par exemple : https://api.exemple.com/users représente la collection des utilisateurs.

Avec les méthodes HTTP :

📥 GET : Récupère des données, par exemple pour accéder à une liste d'utilisateurs https://api.exemple.com/users/
📤 POST : Crée de nouvelles ressources, par exemple créer un nouvel utilisateur https://api.exemple.com/users
🔄 PUT : Met à jour une ressource existante, comme changer des informations sur un utilisateur existant https://api.exemple.com/users/123
🗑️ DELETE : Supprime une ressource https://api.exemple.com/users/123

Maintenant, on peut utiliser des paramètres pour ajouter des informations à nos requêtes.

Query Strings

Les Query Strings sont des paires clé-valeur ajoutées à la fin d'une URL après un point d'interrogation ? . Ils permettent de transmettre des données à une application serveur.

On les utilise pour filtrer des résultats ou pour les paginer en fournissant des critères de recherche.

https://api.example.com/users?id=123&name=Claire

Les paramètres sont séparés par des &.
Chaque paramètre est une paire clé-valeur avec = pour assigner une valeur à la clé.

Path parameters

Les Path Parameters font partie de l'URL elle-même et sont utilisés pour capturer des parties variables de l'URL.

On les utilise pour accéder à des ressources spécifiques au sein de l'API REST.

https://api.example.com/users/{id}

Bonnes Pratiques

Voilà quelques conseils pour bien structurer tes endpoints.

🌟 Clarté et Cohérence : Utiliser des noms descriptifs pour les endpoints.
🔄 Versionnement : Inclure des numéros de version pour garantir la compatibilité avec les futures mises à jour de l'API.
🔒 Sécurité : Restreindre l'accès aux endpoints sensibles en utilisant des méthodes d'authentification et d'autorisation appropriées.

Les endpoints sont fondamentaux pour manipuler les ressources d'une API RESTful, définissant les actions pour créer, lire, mettre à jour ou supprimer des données. Une conception réfléchie contribue à une API plus accessible, compréhensible et sécurisée.

Tout ce que tu dois savoir sur les statuts HTTP 🌐

Claire D. — Mon, 27 Nov 2023 13:00:22 +0000

Les codes de réponse HTTP ne sont pas de simples nombres. Ils jouent le rôle de messagers entre ton navigateur et les serveurs web, transmettant des informations cruciales sur l'état des requêtes. Voici un tour d'horizon pour comprendre l'importance de ces statuts et leur impact sur ton expérience en ligne.

C'est quoi un statut HTTP ?

Les statuts HTTP, également connus sous le nom de codes de réponse HTTP sont des indicateurs numériques renvoyés par un serveur web en réponse à une requête émise par ton navigateur ou tout client HTTP. Ils se divisent en plusieurs catégories qui signalent différents états.

1xx - Informations : Signifie que le serveur continue le processus.
2xx - Succès : Indique que la requête a été acceptée avec succès.
3xx - Redirection : Implique des actions supplémentaires pour compléter la requête.
4xx - Erreur côté client : Révèle une erreur du côté du navigateur ou de la requête.
5xx - Erreur côté serveur : Signale une défaillance du serveur lors du traitement de la requête.

Pourquoi les utilise-t-on ?

🔍 Avoir une communication plus transparente

Les statuts HTTP permettent une communication claire entre le serveur et le client. En cas d'échec d'une requête, ces codes aident les développeurs à cerner rapidement la nature du problème pour le résoudre efficacement.

👩‍💻 Une meilleure gestion des erreurs

Par exemple, le code 404 (Not Found) indique qu'une ressource est introuvable, permettant aux développeurs de personnaliser un message d'erreur pour guider les utilisateurs.

🔄 La redirection permet une navigation fluide

Les codes de redirection (301, 302) orientent les utilisateurs vers de nouvelles URL, favorisant une navigation sans interruption. Ils jouent également un rôle clé dans le référencement, aidant les moteurs de recherche à trouver les nouvelles adresses des pages.

🚀 Des performances optimisées

Certains codes, tels que le 304 (Not Modified), minimisent la consommation de bande passante en indiquant au navigateur d'utiliser une version mise en cache d'une ressource inchangée.

En somme, les statuts HTTP sont la langue commune du web. Ils permettent une communication fluide, aident à résoudre les problèmes, offrent une gestion efficace des erreurs et garantissent une expérience utilisateur optimale.

Les requêtes HTTP

Claire D. — Wed, 22 Nov 2023 14:15:14 +0000

Internet repose sur des échanges d'informations entre des ordinateurs (clients) et des serveurs. Pour standardiser ces échanges, des protocoles ont été développés. HTTP est l'un des plus utilisés pour le web.

Le protocole HTTP (Hypertext Transfer Protocol) est utilisé pour la communication entre un navigateur web et un serveur. Ces méthodes ont été créées pour permettre des interactions spécifiques entre les navigateurs et les serveurs.

Les méthodes HTTP, telles que GET, POST, PUT, DELETE, etc., ont été créées pour spécifier l'action que le client souhaite effectuer sur une ressource donnée sur le serveur. Elles fournissent un moyen standardisé pour demander des données, en envoyer, les mettre à jour ou les supprimer.

Nous allons voir ensemble les méthodes les plus souvent utilisées lors de la création d'une application web.

GET

Le verbe GET est utilisé pour demander des données depuis un serveur. Par exemple, lorsque tu entres une URL dans ton navigateur et que tu appuies sur "Entrée", il va envoyer une requête GET au serveur pour obtenir la page web correspondante.

POST

Le verbe POST est utilisé pour envoyer des données au serveur. Par exemple, lorsque tu remplis un formulaire en ligne et clique sur "Envoyer", les données du formulaire sont envoyées au serveur via une requête POST.

PUT

Le verbe PUT est utilisé pour mettre à jour des données existantes sur le serveur. Par exemple, si tu modifies le contenu d'un article de blog, le navigateur peut envoyer une requête PUT au serveur pour enregistrer ces modifications.

DELETE

Le verbe DELETE est utilisé pour supprimer des données sur le serveur. Par exemple, lorsque tu souhaites supprimer un message sur un forum, le navigateur envoie une requête DELETE au serveur pour effectuer cette action.

Les verbes HTTP sont des outils fondamentaux pour interagir avec les serveurs web. En utilisant ces verbes (GET, POST, PUT, DELETE, etc.), tu peux récupérer, envoyer, mettre à jour et supprimer des données sur le web, ce qui constitue la base des interactions entre votre navigateur et les serveurs web.

Le mot-clé this en JavaScript

Claire D. — Tue, 07 Nov 2023 13:55:53 +0000

Le mot-clé this en JavaScript est un concept important, mais il peut être un peu déroutant pour les débutants.

La définition de MDN nous dit que : "L'objet JavaScript [this représente] le contexte dans lequel le code courant est exécuté."

Autrement dit, this est comme une sorte de caméléon qui change selon le contexte dans lequel il se trouve. 🦎

Voici quelques exemples concrets pour mieux comprendre ce concept.

Dans le contexte d'une méthode d'objet

let personne = {
    nom: "Alice",
    direBonjour: function() {
        console.log("Bonjour, je m'appelle " + this.nom);
    }
};

personne.direBonjour(); // Affiche "Bonjour, je m'appelle Alice"

Dans ce cas, this fait référence à l'objet personne, donc this.nom renvoie la valeur de nom dans cet objet.

Dans le contexte d'un constructeur de classe

Les constructeurs de classe sont comme les usines à objets de JavaScript. 🏭 Le mot-clé this fait référence à l'instance d'objet créée lors de l'utilisation du constructeur.

class Personne {
    constructor(nom) {
        this.nom = nom;
    }
}

let alice = new Personne("Alice");
console.log(alice.nom); // Affiche "Alice"

Dans le contexte d'un événement

Lorsqu'un événement se produit, "this" est comme un détective qui pointe du doigt la chose qui a déclenché l'événement, généralement un élément DOM. 🕵️‍♀️ Par exemple, dans un gestionnaire d'événements de clic :

let bouton = document.querySelector("#monBouton");

bouton.addEventListener("click", function() {
    console.log("Bouton cliqué : " + this.id);
});

En résumé, this en JavaScript dépend du contexte d'exécution, et il est utilisé pour faire référence à l'objet sur lequel une fonction est appelée. Comprendre comment "this" fonctionne dans différents contextes est essentiel pour devenir un maître du JavaScript ! 🚀🤓

Merci d'avoir lu cet article jusqu'au bout! Je t'invite à me laisser ton avis en commentaire, ou à me suivre sur Twitter pour plus d'astuces JavaScript! 🚀👩‍💻👍

L'asynchronisme en JavaScript

Claire D. — Mon, 06 Nov 2023 16:18:17 +0000

JavaScript est souvent qualifié de single-threaded (à un seul thread) en raison de la manière dont il gère l'exécution des opérations. 🧵

Cela signifie que le code s'exécute dans un seul processus à la fois, de manière séquentielle.

Pour éviter de bloquer le thread principal et permettre des opérations non-blocantes, JavaScript utilise des mécanismes comme les fonctions de rappel (callbacks), les promesses et l'API async/await. Ces approches permettent de gérer des opérations asynchrones de manière plus efficace. 🚀

Voici des exemples d'utilisation de chacune de ces approches :

Les `callbacks`, ou fonctions de rappel

function téléchargerDonnées(url, callback) {
  // Simuler une opération asynchrone
  setTimeout(function () {
    let données = "Données téléchargées depuis " + url;
    callback(données);
  }, 1000); // Simule un délai de 1 seconde
}

téléchargerDonnées("http://exemple.com/données", function (résultat) {
  console.log(résultat);
});

Cette approche est efficace, mais lorsque de nombreuses fonctions de rappel (callbacks) sont utilisées, le code devient très vite difficile à lire et complexe. On surnomme cette situation le callback hell.

téléchargerDonnées("http://exemple.com/premiere-donnee", function (donnée1) {
  // Première opération asynchrone
  console.log(donnée1);

  téléchargerDonnées("http://exemple.com/deuxieme-donnee", function (donnée2) {
    // Deuxième opération asynchrone imbriquée
    console.log(donnée2);

    téléchargerDonnées("http://exemple.com/troisieme-donnee", function (donnée3) {
      // Troisième opération asynchrone encore plus imbriquée
      console.log(donnée3);

      // ... et ainsi de suite
    });
  });
});

Comme on peut voir dans l'exemple ci-dessus, de nombreuses fonctions de rappel sont imbriquées les unes dans les autres, ce qui rend le code difficile à suivre et à maintenir. 😫

Pour simplifier la gestion des opérations asynchrones et rendre le code plus lisible, JavaScript propose des alternatives telles que les promesses. Les promesses permettent de gérer ces opérations de manière plus linéaire et propre. 🌟

Utilisation de promesses (Promises)

L'objet Promise représente une valeur qui n'est pas nécessairement connue au moment de la création de la promesse.

Une Promise peut avoir trois états :

pending (en attente) : état initial, la promesse n'est ni tenue, ni rompue
fulfilled (tenue) : l'opération a réussi
rejected (rompue) : l'opération a échoué.

On peut gérer la promesse quand elle est résolue avec le mot-clé .then() et gérer les erreurs potentielles avec .catch()

téléchargerDonnées("http://exemple.com/premiere-donnee")
  .then(function (donnée1) {
    console.log(donnée1);
    return téléchargerDonnées("http://exemple.com/deuxieme-donnee");
  })
  .then(function (donnée2) {
    console.log(donnée2);
    return téléchargerDonnées("http://exemple.com/troisieme-donnee");
  })
  .then(function (donnée3) {
    console.log(donnée3);
    // ...
  })
  .catch(function (erreur) {
    console.error(erreur);
  });

L'API `async/await`

La dernière méthode pour gérer des opérations asynchrones est celle considérée la plus propre et la plus facile à gérer par beaucoup de développeurs.

En utilisant l'API async/await, vous pouvez déclarer une fonction comme asynchrone avec le mot-clé async. Cela permet d'attendre la résolution d'une promesse à l'aide de l'opérateur await, rendant le code plus lisible et fluide. 🌐

async function afficherDonnées() {
  try {
    let résultat = await téléchargerDonnées("http://exemple.com/données");
    console.log(résultat);
  } catch (erreur) {
    console.error(erreur);
  }
}

afficherDonnées();

En utilisant async/await, le code devient plus expressif et plus proche de la manière dont nous pensons naturellement les opérations asynchrones. Cela facilite le développement et la maintenance des applications JavaScript tout en maintenant leur réactivité. 🚀😄

Cette syntaxe est fréquemment utilisée avec l'instruction try...catch pour gérer les erreurs éventuelles.

En résumé, JavaScript est "single-threaded" par nature, mais il utilise des mécanismes comme les promesses et l'API async/await pour gérer les opérations asynchrones de manière propre, évitant ainsi les problèmes de "callback hell" et offrant une meilleure expérience de développement. 🥳

Merci d'avoir lu cet article jusqu'au bout! Je t'invite à me laisser ton avis en commentaire, ou à me suivre sur Twitter pour plus d'astuces JavaScript! 🚀👩‍💻👍

Quelles sont les nouveautés d'ECMAScript 14 ?

Claire D. — Sat, 04 Nov 2023 08:57:15 +0000

Les normes ECMAScript (ES) sont des règles pour le langage JavaScript. Elles évoluent avec des nouvelles versions, comme ES6 ou ES2015, qui ajoutent de chouettes fonctionnalités pour améliorer les fonctionnalités de JavaScript. La bonne nouvelle, c'est que le vieux code continue de marcher avec les nouvelles versions.

Mais attention, tous les navigateurs et environnements JavaScript ne peuvent pas tout de suite comprendre les nouveautés. Parfois, on utilise un outil pour transformer le code récent en un code utilisable partout.

Ces règles sont gérées par une organisation, Ecma International, et les développeurs peuvent aider à décider des nouvelles règles. C'est important de suivre ces règles pour écrire du bon code JavaScript et rester à la page avec les dernières astuces de programmation. 😎

Voilà sans plus attendre les nouveautés présentes dans d'ECMAScript 14 , autrement appelé ECMAScript 2023 .

`Array.prototype.toSorted()`

Cette méthode crée un nouveau tableau trié à partir du tableau existant, contrairement à sort(), qui modifie le tableau existant.

const numbers = [10, 5, 2, 7, 3, 9, 1, 6, 4];
const sortedNumbers = numbers.toSorted((a, b) => b - a);
console.log(sortedNumbers); // [10, 9, 8, 7, 6, 5, 4, 3, 2, 1]

`Array.prototype.toReversed()`

Cette méthode est similaire à reverse() mais elle crée un nouveau tableau au lieu de modifier le tableau existant.

const colors = ["red", "orange", "yellow", "green", "blue", "purple"];
const reversedColors = colors.toReversed();
console.log(reversedColors); // ['purple', 'blue', 'green', 'yellow', 'orange', 'red']

`Array.prototype.with()`

Cette méthode permet de remplacer un élément d'un tableau à un index donné et renvoie un nouveau tableau.

const arr = ["I", "am", "the", "Walrus"];
const newArr = arr.with(3, "Ape Man");
console.log(newArr); // ["I", "am", "the", "Ape Man"]

`Array.prototype.findLast()`

Cette méthode renvoie la dernière instance d'un élément correspondant dans un tableau.

const numbers = [54, 34, 55, 75, 98, 77];
const lastEven = numbers.findLast((element) => element % 2 === 0);
console.log(lastEven); // 98

`Array.prototype.findLastIndex()`

Cette méthode renvoie l'index de la dernière occurrence d'un élément correspondant dans un tableau.

const numbers = [54, 34, 55, 75, 98, 77];
const lastIndex = numbers.findLastIndex((element) => element % 2 === 0);
console.log(lastIndex); // 4

`Array.prototype.toSpliced()`

Cette méthode crée un nouveau tableau en utilisant la méthode splice() pour effectuer des modifications, sans modifier le tableau original.

const arr = ["red", "orange", "yellow", "green", "blue", "purple"];
const newArr = arr.toSpliced(2, 1, "pink", "cyan");
console.log(newArr); // ["red", "orange", "pink", "cyan", "green", "blue", "purple"]

Support Shebang ( `(#!/)` )

Le shebang est maintenant officiellement pris en charge pour exécuter des scripts JavaScript directement à l'aide de commandes telles que ./script.js.

#!/usr/bin/env node
console.log("Hello, world!");

Il y a beaucoup de nouveautés pour manipuler des tableaux. As-tu déjà eu l'occasion de tester ces nouvelles fonctionnalités ?

Merci d'avoir lu cet article jusqu'au bout! Je t'invite à me laisser ton avis en commentaire, ou à me suivre sur Twitter pour plus d'astuces JavaScript! 🚀👩‍💻👍

Les 8 concepts de base de JavaScript

Claire D. — Fri, 03 Nov 2023 09:15:28 +0000

🚀 Si tu commences à coder ou que tu veux revoir les bases de JavaScript, cet article est fait pour toi.

Pourquoi JavaScript ?

Il est largement utilisé pour le développement web, et peut être utilisé coté serveur avec Node.js notamment.

1. Déclarer des variables

On peut déclarer des variables avec les mots-clés var , let , ou const .

Javascript compte plusieurs types

number : nombre
Représente à la fois les nombres entiers et les nombres à virgule flottante.
string : chaîne de caractères
Représente une séquence de caractères.
"Hello, World!", 'JavaScript'
boolean : booléen
Représente une valeur binaire qui peut être soit true (vrai) soit false (faux).
Null
Représente une valeur nulle ou inexistante.
undefined : Indéfini
Représente une variable qui a été déclarée mais n'a pas encore été initialisée.
object : Objet
Un type de données complexe qui peut contenir des collections de propriétés et de méthodes.

let personne = {
  nom: "John",
  age: 30,
  sexe: "homme"
};

array : Tableau Représente une collection ordonnée d'éléments.

let fruits = ["pomme", "banane", "fraise"];

function : Fonction Les fonctions sont des objets de première classe en JavaScript. Elles peuvent être assignées à des variables, passées en tant qu'arguments, et retournées par d'autres fonctions.

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

symbol : Symbole Un type de données introduit dans ES6, utilisé pour créer des propriétés uniques dans les objets.

const mySymbol = Symbol("description")

BigInt : BigInt Un type de données introduit dans ES11 (ES2020) pour représenter des nombres entiers très grands.

const bigIntValue = 1234567890123456789012345678901234567890n

2. Les opérateurs

JavaScript prend en charge une variété d'opérateurs pour effectuer des opérations sur des données.

🔢 Opérateurs mathématiques

+ : Addition
- : Soustraction
* : Multiplication
/ : Division
% : Modulo (reste de la division)
** : Exponentiation (introduit dans ES6) 🔗 Opérateurs de comparaison
== : Égal à (valeur)
=== : Égal à (valeur et type)
!= : Différent de (valeur)
!== : Différent de (valeur et type)
< : Inférieur à
> : Supérieur à
<= : Inférieur ou égal à
>= : Supérieur ou égal à 🔲 Opérateurs logiques
&& : ET
|| : OU
! : NON

3. Les Structures de controle

Les instructions conditionnelles

L'instruction if permet d'exécuter un bloc de code si une condition est vraie.

if (condition) {
  // Code à exécuter si la condition est vraie
}

L'instruction else if permet d'ajouter des conditions alternatives à une instruction if.

if (condition1) {
  // Code à exécuter si condition1 est vraie
} else if (condition2) {
  // Code à exécuter si condition1 est fausse et condition2 est vraie
}

L'instruction else permet d'exécuter un bloc de code si aucune des conditions précédentes n'est vraie.

if (condition) {
  // Code à exécuter si la condition est vraie
} else {
  // Code à exécuter si la condition est fausse
}

Boucles

🔁 La boucle for permet d'itérer sur un bloc de code un certain nombre de fois en spécifiant une condition d'arrêt.

for (initialisation; condition; itération) {
  // Code à répéter
}

🔄 La boucle while répète un bloc de code tant qu'une condition est vraie.

while (condition) {
  // Code à répéter tant que la condition est vraie
}

🔁 La boucle do...while est similaire à la boucle while, mais garantit qu'au moins une itération sera effectuée avant de vérifier la condition.

do {
  // Code à répéter au moins une fois
} while (condition);

4. Les fonctions

🔧 Les fonctions sont des blocs de code réutilisables que vous pouvez définir et appeler. Les fonctions sont définies à l'aide du mot-clé function.
Les fonctions peuvent accepter des paramètres et renvoyer des valeurs.

function multiplier(a, b) {
  return a * b;
}

5. Les objets

🧩 Les objets sont des structures de données complexes qui peuvent contenir des propriétés et des méthodes. Les propriétés sont des variables, tandis que les méthodes sont des fonctions associées à un objet.

// Création d'un objet représentant une personne
const personne = {
  nom: "John",
  age: 30,
  sexe: "homme",
};

// Accès aux propriétés de l'objet
console.log("Nom de la personne : " + personne.nom);
console.log("Âge de la personne : " + personne.age);

6. Les événements et les gestionnaires d'événements

🎯 Les événements et les gestionnaires d'événements en JavaScript permettent de surveiller et de réagir aux actions de l'utilisateur sur une page web, comme les clics de souris, les saisies au clavier, etc. Les gestionnaires d'événements sont des fonctions JavaScript attachées aux éléments HTML pour définir des réponses spécifiques à ces événements, ajoutant ainsi de l'interactivité aux applications web.

// On sélectionne un bouton par son ID
const monBouton = document.getElementById("monBouton");

// On ajoute un gestionnaire d'événements de clic
monBouton.addEventListener("click", function() {
  alert("Le bouton a été cliqué !");
});

7. Promesses et asynchronicité

🌐 Les promesses en JavaScript sont des objets qui représentent des opérations asynchrones, telles que les requêtes réseau, les lectures de fichiers, etc. Elles permettent de gérer ces opérations de manière plus lisible et ordonnée, en fournissant des callbacks pour les résultats (résolues) ou les erreurs (rejetées).

L' asynchronicité signifie que le programme peut continuer à s'exécuter sans attendre la fin d'une opération longue. Les promesses aident à gérer ces opérations asynchrones en garantissant un contrôle plus efficace de la séquence d'exécution du code.

// Création d'une promesse
const maPromesse = new Promise((resolve, reject) => {
  setTimeout(() => {
    const reussite = true;
    if (reussite) {
      resolve("Opération réussie");
    } else {
      reject("Erreur");
    }
  }, 2000);
});

// Utilisation de la promesse
maPromesse
  .then(resultat => console.log(resultat))
  .catch(erreur => console.error(erreur));

8. Portée et fermeture

🔍 La portée (scope) en JavaScript détermine où une variable est accessible dans le code. Les fermetures (closures) sont des fonctions imbriquées qui peuvent accéder aux variables de leur fonction parente, même après que cette fonction parente ait terminé son exécution. Cela permet de stocker et de protéger des valeurs pour une utilisation ultérieure.

Merci d'avoir lu cet article jusqu'au bout! Je t'invite à me laisser ton avis en commentaire, ou à me suivre sur Twitter pour plus d'astuces JavaScript! 🚀👩‍💻👍

Guide des méthodes JS [chaînes de caractères]

Claire D. — Wed, 14 Jun 2023 10:12:50 +0000

Cet article recense les méthodes Javascript permettant de manipuler des chaînes de caractères les plus utilisées. Si tu souhaites lire un résumé plus court, je t'encourage à consulter cet article.

Voici la liste des méthodes mentionnées dans cet article :

`.charAt()`

Définition

La méthode charAt() renvoie une nouvelle chaîne de caractère contenant le caractère à l'indice indiqué en argument.

Syntaxe

str.charAt(indice)

str : chaîne sur laquelle on effectue l'opération
indice : indice du caractère que l'on souhaite récupérer

Complexité temporelle

La complexité temporelle de la méthode .charAt() est O(1), ce qui signifie que le temps d'exécution de la méthode ne dépend pas de la longueur de la chaîne. Peu importe la taille de la chaîne, la méthode charAt() renvoie le caractère à l'index spécifié en temps constant.

Cas d'usage

Accéder au premier caractère d'une chaîne


const str = "Hello, world!";
const firstCharacter = str.charAt(0);
console.log(firstCharacter); // Output: "H"

Ce code utilise charAt(0) pour accéder au premier caractère de la chaîne str et le stocke dans la variable firstCharacter.

Parcourir une chaîne caractère par caractère

const str = "Hello";
for (let i = 0; i < str.length; i++) {
  const character = str.charAt(i);
  console.log(character);
}

Dans cet exemple, nous utilisons charAt(i) à l'intérieur d'une boucle for pour parcourir chaque caractère de la chaîne str. À chaque itération, le caractère à l'index i est récupéré et affiché.

Vérifier si une chaîne contient un caractère spécifique

const str = "Hello, world!";
const index = str.indexOf("w");
if (index !== -1) {
  const character = str.charAt(index);
  console.log(character); // Output: "w"
} else {
  console.log("Le caractère spécifié n'a pas été trouvé.");
}

Dans ce cas, nous utilisons indexOf("w") pour trouver l'index de la première occurrence du caractère "w" dans la chaîne str. Si l'index est différent de -1, cela signifie que le caractère a été trouvé, alors nous utilisons charAt(index) pour récupérer le caractère correspondant à cet index.

`.charCodeAt()`

Définition

La méthode .charCodeAt() renvoie le code Unicode d'un caractère situé à un index donné dans la chaîne.

Le code Unicode représente un identifiant numérique unique attribué à chaque caractère dans le système Unicode.

Syntaxe

str.charCodeAt(indice)

str : chaîne sur laquelle on effectue l'opération
indice : indice du caractère dont on souhaite obtenir le code Unicode.

Complexité temporelle

La complexité temporelle de la méthode .charCodeAt() est O(1). Comme pour .charAt(), cela signifie que le temps d'exécution de la méthode ne dépend pas de la longueur de la chaîne.

Cas d'usage

Obtenir le code Unicode d'un caractère spécifique

const str = "Hello";
const charCode = str.charCodeAt(0);
console.log(charCode); // Sortie : 72

Ce code utilise charCodeAt(0) pour obtenir le code Unicode du premier caractère de la chaîne str.

Parcourir une chaîne et afficher les codes Unicode de chaque caractère

const str = "Hello";
for (let i = 0; i < str.length; i++) {
  const charCode = str.charCodeAt(i);
  console.log(charCode);
}

Dans cet exemple, nous utilisons charCodeAt(i) à l'intérieur d'une boucle for pour parcourir chaque caractère de la chaîne str et afficher son code Unicode.

Vérifier si une chaîne contient un caractère spécial en utilisant son code Unicode

const str = "Hello, world!";
const targetCharCode = 33; // Code Unicode du point d'exclamation
for (let i = 0; i < str.length; i++) {
  const charCode = str.charCodeAt(i);
  if (charCode === targetCharCode) {
    console.log("Le caractère spécial a été trouvé à l'index", i);
    break;
  }
}

Dans cet exemple, nous utilisons charCodeAt(i) pour obtenir le code Unicode de chaque caractère de la chaîne str. Nous comparons ensuite ces codes avec le code Unicode du caractère spécial recherché (dans ce cas, le point d'exclamation) pour vérifier s'il est présent dans la chaîne. Si nous trouvons le caractère spécial, nous affichons son index et nous quittons la boucle avec break.

`.concat()`

Définition

La méthode .concat() est une méthode de chaîne de caractères en JavaScript qui permet de concaténer, c'est-à-dire de fusionner, deux ou plusieurs chaînes en une seule chaîne. Elle renvoie une nouvelle chaîne qui est le résultat de la concaténation des chaînes d'origine.

Syntaxe

str.concat(string2, string3, ..., stringN)

str : chaîne d'origine à laquelle on ajoute d'autres chaînes
string2, string3, ..., stringN : la ou les chaîne(s) à concaténer avec la chaîne d'origine.

Complexité temporelle

La complexité temporelle de la méthode .concat() dépend de la longueur totale des chaînes à concaténer. Dans le pire des cas, où la longueur totale des chaînes est grande, la complexité peut être linéaire, soit O(n), où n est la longueur totale des chaînes.

Cas d'usage

Concaténer deux chaînes

const str1 = "Hello";
const str2 = " world!";
const concatenated = str1.concat(str2);
console.log(concatenated); // Sortie : "Hello world!"

Dans cet exemple, nous utilisons .concat() pour concaténer les chaînes str1 et str2 en une seule chaîne, qui est ensuite stockée dans la variable concatenated.

Concaténer plusieurs chaînes

const str1 = "Hello";
const str2 = ", ";
const str3 = "world";
const str4 = "!";
const concatenated = str1.concat(str2, str3, str4);
console.log(concatenated); // Sortie : "Hello, world!"

Dans cet exemple, nous utilisons .concat() pour concaténer les chaînes str1, str2, str3 et str4 en une seule chaîne, qui est ensuite stockée dans la variable concatenated.

Concaténer une chaîne avec une valeur non textuelle

const str1 = "The value is: ";
const value = 42;
const concatenated = str1.concat(value);
console.log(concatenated); // Sortie : "The value is: 42"

Dans cet exemple, nous utilisons .concat() pour concaténer la chaîne str1 avec la valeur numérique value. La méthode .concat() convertit automatiquement la valeur non textuelle en une chaîne avant de la concaténer avec la chaîne d'origine.

`.includes()`

Définition

La méthode .includes() permet de déterminer si une chaîne de caractères contient une autre chaîne spécifiée. Elle effectue une recherche de correspondance et renvoie un booléen indiquant si la sous-chaîne est présente ou non.

Syntaxe

str.includes(élémentRecherché)

str : chaîne où l'on effectue la recherche
élémentRecherché : la sous-chaîne que l'on cherche

Complexité temporelle

La complexité temporelle de la méthode .includes() est linéaire, soit O(n), où n est la longueur de la chaîne principale. Cela signifie que le temps d'exécution de la méthode dépend de la longueur de la chaîne sur laquelle elle est appelée.

Cas d'usage

Vérifier si une chaîne contient une sous-chaîne

const str = "Hello, world!";
const hasSubstring = str.includes("world");
console.log(hasSubstring); // Sortie : true

Dans cet exemple, nous utilisons .includes() pour vérifier si la chaîne str contient la sous-chaîne "world". La méthode renvoie true car la sous-chaîne est présente dans la chaîne principale.

Vérifier si une chaîne contient un caractère spécifique

const str = "Hello, world!";
const hasCharacter = str.includes("o");
console.log(hasCharacter); // Sortie : true

Dans cet exemple, nous utilisons .includes() pour vérifier si la chaîne str contient le caractère "o". La méthode renvoie true car le caractère est présent dans la chaîne principale.

Vérifier si une chaîne ne contient pas une sous-chaîne

const str = "Hello, world!";
const hasSubstring = str.includes("foo");
console.log(hasSubstring); // Sortie : false

Dans cet exemple, nous utilisons .includes() pour vérifier si la chaîne str contient la sous-chaîne "foo". La méthode renvoie false car la sous-chaîne n'est pas présente dans la chaîne principale.

`.indexOf()`

Définition

La méthode .indexOf() recherche la première occurrence d'une sous-chaîne dans la chaîne principale et renvoie l'indice de cette occurrence. Si la sous-chaîne n'est pas trouvée, elle renvoie -1.

Syntaxe

str.indexOf(sousChaine, elementDepart)

str : La chaîne dans laquelle on recherche la sous-chaîne.
sousChaine : chaîne que l'on recherche
elementDepart : (facultatif) L'indice à partir duquel la recherche doit commencer. Par défaut, la recherche commence à l'indice 0.

Complexité temporelle

La complexité temporelle de la méthode .indexOf() dépend de la longueur de la chaîne principale. Dans le pire des cas, où la sous-chaîne n'est pas trouvée ou est située à la fin de la chaîne, la complexité est linéaire, soit O(n), où n est la longueur de la chaîne principale.

Cas d'usage

Rechercher la première occurrence d'une sous-chaîne

const str = "Hello, world!";
const index = str.indexOf("world");
console.log(index); // Sortie : 7

Dans cet exemple, nous utilisons .indexOf() pour rechercher la première occurrence de la sous-chaîne "world" dans la chaîne str. La méthode renvoie l'index 7, qui est la position où la sous-chaîne commence dans la chaîne principale.

Rechercher une sous-chaîne à partir d'un index spécifique

const str = "Hello, world!";
const index = str.indexOf("o", 5);
console.log(index); // Sortie : 8

Dans cet exemple, nous utilisons .indexOf() pour rechercher la première occurrence du caractère "o" dans la chaîne str, à partir de l'index 5. La méthode renvoie l'index 8, qui est la position de la première occurrence du caractère "o" après l'index spécifié.

Vérifier si une sous-chaîne existe dans la chaîne principale

const str = "Hello, world!";
const substring = "foo";
const index = str.indexOf(substring);
if (index !== -1) {
  console.log("La sous-chaîne existe à l'index", index);
} else {
  console.log("La sous-chaîne n'existe pas dans la chaîne principale.");
}

Dans cet exemple, nous utilisons .indexOf() pour rechercher la première occurrence de la sous-chaîne "foo" dans la chaîne str. Si la sous-chaîne est trouvée (c'est-à-dire si l'index n'est pas -1), nous affichons un message indiquant l'index où la sous-chaîne commence. Sinon, nous indiquons que la sous-chaîne n'existe pas dans la chaîne principale.

`.match()`

Définition

La méthode .match() recherche les correspondances d'une expression régulière dans une chaîne de caractères et renvoie un tableau contenant les correspondances trouvées. Si aucune correspondance n'est trouvée, la méthode renvoie null.

Syntaxe

str.match(regexp)

str : La chaîne dans laquelle on recherche les correspondances.
regexp : une expression régulière utilisée pour rechercher les correspondances dans la chaîne

Complexité temporelle

La complexité temporelle de la méthode .match() dépend de la taille de la chaîne de caractères et de la complexité de l'expression régulière. Dans certains cas, la complexité peut être élevée, en particulier avec des expressions régulières complexes. Dans le pire des cas, elle peut avoir une complexité exponentielle. Il est important de noter que la complexité dépend de l'expression régulière elle-même, et non de la méthode .match().

Cas d'usage

*Obtenir les correspondances d'un motif dans une chaîne *

const str = "Hello, world!";
const matches = str.match(/o/g);
console.log(matches); // Sortie : ["o", "o"]

Dans cet exemple, nous utilisons .match() avec l'expression régulière /o/g pour rechercher toutes les occurrences de la lettre "o" dans la chaîne str. La méthode renvoie un tableau contenant les correspondances trouvées, c'est-à-dire ["o", "o"].

*Utiliser une expression régulière avec des groupes de capture *

const str = "Hello, world!";
const matches = str.match(/(H\w+)\s*,\s*(\w+)/);
console.log(matches); // Sortie : ["Hello, world!", "Hello", "world"]

Dans cet exemple, nous utilisons .match() avec l'expression régulière /(H\w+)\s*,\s*(\w+)/ pour rechercher une correspondance qui correspond à un mot commençant par "H" suivi de tous les caractères alphanumériques (\w+), suivi d'une virgule, suivie de zéro ou plusieurs espaces (\s*), suivis d'un autre mot. La méthode renvoie un tableau contenant la correspondance complète ainsi que les groupes de capture, c'est-à-dire ["Hello, world!", "Hello", "world"].

Utiliser une expression régulière avec le drapeau "i" pour une recherche insensible à la casse

const str = "Hello, world!";
const matches = str.match(/WORLD/i);
console.log(matches); // Sortie : ["world"]

Dans cet exemple, nous utilisons .match() avec l'expression régulière /WORLD/i et le drapeau "i" pour rechercher une correspondance insensible à la casse du mot "WORLD" dans la chaîne str. La méthode renvoie un tableau contenant la correspondance trouvée, c'est-à-dire ["world"].

`.repeat()`

Définition

La méthode .repeat() répète une chaîne de caractères un certain nombre de fois et renvoie une nouvelle chaîne contenant les répétitions. Elle crée une nouvelle chaîne en concaténant la chaîne originale autant de fois que spécifié.

Syntaxe

str.repeat(count)

str : La chaîne de caractères à répéter
count : Le nombre de fois que vous souhaitez répéter la chaîne. Doit être un nombre entier positif.

Complexité temporelle

La complexité temporelle de la méthode .repeat() est linéaire, soit O(n), où n est le nombre de répétitions spécifié par le paramètre count. Cela signifie que le temps d'exécution de la méthode est proportionnel au nombre de répétitions.

Cas d'usage

Répéter une chaîne un nombre fixe de fois

const str = "Hello ";
const repeatedStr = str.repeat(3);
console.log(repeatedStr); // Sortie : "Hello Hello Hello "

Dans cet exemple, nous utilisons .repeat() pour répéter la chaîne "Hello " trois fois. La méthode renvoie une nouvelle chaîne contenant la chaîne originale répétée, c'est-à-dire "Hello Hello Hello ".

Répéter une chaîne un nombre de fois dynamique

const str = "abc";
const count = 4;
const repeatedStr = str.repeat(count);
console.log(repeatedStr); // Sortie : "abcabcabcabc"

Dans cet exemple, nous utilisons .repeat() pour répéter la chaîne "abc" un nombre dynamique de fois défini par la variable count (dans ce cas, 4). La méthode renvoie une nouvelle chaîne contenant la chaîne originale répétée quatre fois, c'est-à-dire "abcabcabcabc".

Répéter une chaîne avec un paramètre nul ou négatif

const str = "Hello";
const count = 0;
const repeatedStr = str.repeat(count);
console.log(repeatedStr); // Sortie : ""

Dans cet exemple, nous utilisons .repeat() avec un paramètre count égal à zéro. Comme zéro signifie qu'il n'y a pas de répétition, la méthode renvoie une chaîne vide (""). Si count était négatif, la méthode renverrait également une chaîne vide.

`.replace()`

Définition

La méthode .replace() recherche des occurrences d'une sous-chaîne dans une chaîne de caractères et les remplace par une autre sous-chaîne spécifiée. Elle renvoie une nouvelle chaîne résultante avec les remplacements effectués.

Syntaxe

str.replace(chaineARemplacer, nouvelleChaine)

str : La chaîne de caractères dans laquelle on effectue les remplacements
chaineARemplacer : La sous-chaîne que vous souhaitez rechercher et remplacer.
nouvelleChaine : La sous-chaîne qui va remplacer les occurrences trouvées.
Il est également possible d'utiliser une expression régulière comme searchValue pour effectuer des remplacements plus complexes.

Complexité temporelle

La complexité temporelle de la méthode .replace() dépend de la taille de la chaîne de caractères et de la complexité de la recherche et du remplacement effectués. Dans la plupart des cas, la complexité est linéaire, soit O(n), où n est la longueur de la chaîne de caractères. Cependant, lorsqu'une expression régulière est utilisée pour la recherche, la complexité peut varier en fonction de la complexité de l'expression régulière elle-même.

Cas d'usage

** Remplacer une occurrence spécifique dans une chaîne**

const str = "Hello, World!";
const newStr = str.replace("World", "Universe");
console.log(newStr); // Sortie : "Hello, Universe!"

Dans cet exemple, nous utilisons .replace() pour rechercher la première occurrence de la sous-chaîne "World" dans la chaîne str et la remplacer par la sous-chaîne "Universe". La méthode renvoie une nouvelle chaîne contenant les remplacements, c'est-à-dire "Hello, Universe!".

Utiliser une expression régulière pour effectuer des remplacements globaux

const str = "Hello, Hello, Hello!";
const newStr = str.replace(/Hello/g, "Hi");
console.log(newStr); // Sortie : "Hi, Hi, Hi!"

Dans cet exemple, nous utilisons .replace() avec l'expression régulière /Hello/g pour rechercher toutes les occurrences de la sous-chaîne "Hello" dans la chaîne str et les remplacer par la sous-chaîne "Hi". En utilisant le drapeau "g" de l'expression régulière, tous les Hello sont remplacés. La méthode renvoie une nouvelle chaîne avec les remplacements effectués, c'est-à-dire "Hi, Hi, Hi!".

Utiliser une fonction de remplacement dynamique

const str = "Hello, World!";
const newStr = str.replace("World", (match) => match.toUpperCase());
console.log(newStr); // Sortie : "Hello, WORLD!"

Dans cet exemple, nous utilisons .replace() pour rechercher la sous-chaîne "World" dans la chaîne str et effectuer un remplacement dynamique à l'aide d'une fonction de rappel. La fonction de rappel reçoit en argument la correspondance trouvée, et nous l'utilisons pour convertir la correspondance en majuscules à l'aide de la méthode toUpperCase(). La méthode renvoie une nouvelle chaîne avec les remplacements effectués, c'est-à-dire "Hello, WORLD!".

`.search()`

Définition

La méthode search() recherche une correspondance entre une expression régulière et une chaîne de caractères, renvoyant l'index de la première occurrence de la correspondance.

Syntaxe

str.search(expressionReguliere)

str : La chaîne de caractères sur laquelle on effectue la recherche
chaineARemplacer : La sous-chaîne que vous souhaitez rechercher et remplacer.
expressionReguliere : Une expression régulière pour spécifier le motif à rechercher.

Complexité temporelle

La complexité temporelle de la méthode search() dépend de la complexité de l'expression régulière fournie. Dans le pire des cas, la complexité peut être linéaire en fonction de la taille de la chaîne et de l'expression régulière.

Cas d'usage

Rechercher la position d'un mot dans une chaîne

const str = "Hello, world! Welcome to JavaScript.";
const position = str.search("world");
console.log(position); // Output: 7
Dans cet exemple, search("world") recherche le mot "world" dans la chaîne str et renvoie l'index de la première occurrence trouvée, qui est 7.

Utiliser une expression régulière pour la recherche

const str = "Hello, world! Welcome to JavaScript.";
const position = str.search(/w\w+/i);
console.log(position); // Output: 7
Ici, nous utilisons une expression régulière /w\w+/i pour rechercher le premier mot commençant par "w" (indépendamment de la casse) dans la chaîne str. La méthode search() renvoie l'index de la première occurrence du mot correspondant, qui est 7.

Vérifier la présence d'un motif dans une chaîne

const str = "Hello, world! Welcome to JavaScript.";
const pattern = /javascript/i;
if (str.search(pattern) !== -1) {
  console.log("Le motif 'JavaScript' a été trouvé.");
} else {
  console.log("Le motif 'JavaScript' n'a pas été trouvé.");
}

Dans cet exemple, nous utilisons une expression régulière /javascript/i pour rechercher le mot "JavaScript" (indépendamment de la casse) dans la chaîne str. Si la méthode search() renvoie une valeur différente de -1, cela signifie que le motif a été trouvé et nous affichons un message correspondant.

`.slice()`

Définition

La méthode slice() extrait une partie d'une chaîne de caractères et renvoie une nouvelle chaîne contenant cette portion. Elle prend en compte les index de début et de fin spécifiés, permettant de délimiter la portion à extraire.

Syntaxe

str.slice(début, fin)

str : La chaîne sur laquelle on effectue l'extraction.
début : L'index de départ de la portion à extraire. Si début est négatif, il est traité comme str.length + début, où str.length est la longueur de la chaîne.
fin : (Optionnel) L'index de fin de la portion à extraire (non inclus). Si fin est négatif, il est traité comme str.length + fin.

Complexité temporelle

La complexité temporelle de la méthode slice() est linéaire en fonction de la taille de la portion extraite. Dans le pire des cas, si la portion extraite est la chaîne d'origine, la complexité serait linéaire par rapport à la taille de la chaîne.

Cas d'usage

Extraire une sous-chaîne d'une chaîne

const str = "Hello, world!";
const subStr = str.slice(7, 12);
console.log(subStr); // Output: "world"

Dans cet exemple, slice(7, 12) extrait la portion de la chaîne str comprise entre les index 7 et 11 (12 est exclu). La sous-chaîne extraite est "world".

Utiliser des indices négatifs pour extraire une portion depuis la fin

const str = "Hello, world!";
const subStr = str.slice(-6, -1);
console.log(subStr); // Output: "world"

Ici, slice(-6, -1) extrait la portion de la chaîne str comprise entre les 6 derniers caractères et l'avant-dernier caractère. La sous-chaîne extraite est toujours "world".

Extraire une portion jusqu'à la fin de la chaîne

const str = "Hello, world!";
const subStr = str.slice(7);
console.log(subStr); // Output: "world!"

Dans cet exemple, slice(7) extrait la portion de la chaîne str à partir de l'index 7 jusqu'à la fin de la chaîne. La sous-chaîne extraite est "world!".

`.split()`

Définition

La méthode split() divise une chaîne de caractères en utilisant un séparateur spécifié et renvoie un tableau de sous-chaînes. Le séparateur peut être un caractère, une sous-chaîne ou une expression régulière. Les portions de la chaîne entre les occurrences du séparateur sont extraites en tant qu'éléments du tableau résultant.

Syntaxe

str.split(séparateur, limite)

str : La chaîne à diviser.
séparateur : Le séparateur utilisé pour diviser la chaîne. Il peut être un caractère, une sous-chaîne ou une expression régulière. Si aucun séparateur n'est spécifié, la méthode renverra un tableau contenant la chaîne entière comme seul élément.
limite : (Optionnel) Un entier indiquant le nombre maximum de divisions à effectuer. Si cette limite est atteinte, les éléments restants sont ajoutés tels quels dans le tableau résultant. Si limite est négatif, aucune limite ne sera appliquée.

Complexité temporelle

La complexité temporelle de la méthode split() dépend de la taille de la chaîne d'entrée et du séparateur utilisé. Dans le pire des cas, la complexité peut être linéaire par rapport à la taille de la chaîne.

Cas d'usage

Diviser une chaîne en fonction d'un séparateur

const str = "Hello, world!";
const result = str.split(", ");
console.log(result); // Output: ["Hello", "world!"]

Dans cet exemple, split(", ") divise la chaîne str en utilisant la virgule suivie d'un espace comme séparateur. Le tableau résultant contient les sous-chaînes "Hello" et "world!".

Diviser une chaîne en utilisant une expression régulière

const str = "Hello, world!";
const result = str.split(/[o,]/);
console.log(result); // Output: ["Hell", " w", "rld!"]

Ici, split(/[o,]/) divise la chaîne str en utilisant une expression régulière qui correspond à la lettre "o" ou à la virgule. Le tableau résultant contient les sous-chaînes "Hell", " w" et "rld!".

Limiter le nombre de divisions effectuées

const str = "Hello, world, how, are, you";
const result = str.split(", ", 3);
console.log(result); // Output: ["Hello", "world", "how"]

Dans cet exemple, split(", ", 3) divise la chaîne str en utilisant la virgule suivie d'un espace comme séparateur et limite le nombre de divisions à 3. Le tableau résultant contient les trois premières sous-chaînes obtenues.

`.substr()`

Définition

La méthode substr() extrait une sous-chaîne à partir d'une chaîne de caractères en utilisant un index de départ et une longueur spécifiée. Elle renvoie la sous-chaîne extraite sans modifier la chaîne d'origine.

Syntaxe

str.substr(indexDépart, longueur)

str : La chaîne à partir de laquelle extraire la sous-chaîne..
indexDépart : L'index de départ à partir duquel extraire la sous-chaîne. Si indexDépart est négatif, il est traité comme (longueur de la chaîne + indexDépart). Par exemple, -1 correspond à l'index du dernier caractère.
longueur : (Optionnel) La longueur de la sous-chaîne à extraire. Si longueur est omis ou dépasse la longueur de la chaîne, la méthode extraira la sous-chaîne jusqu'à la fin de la chaîne.

Complexité temporelle

La complexité temporelle de la méthode substr() est linéaire par rapport à la longueur de la sous-chaîne extraite. Dans le pire des cas, la complexité peut être proportionnelle à la longueur de la chaîne d'origine.

Cas d'usage

Extraire une sous-chaîne à partir d'un index de départ

const str = "Hello, world!";
const result = str.substr(7);
console.log(result); // Output: "world!"

Dans cet exemple, substr(7) extrait une sous-chaîne de str à partir de l'index 7 (correspondant au caractère "w") jusqu'à la fin de la chaîne. Le résultat est la sous-chaîne "world!".

Extraire une sous-chaîne avec une longueur spécifiée

const str = "Hello, world!";
const result = str.substr(0, 5);
console.log(result); // Output: "Hello"

Ici, substr(0, 5) extrait une sous-chaîne de str à partir de l'index 0 jusqu'à une longueur de 5 caractères. Le résultat est la sous-chaîne "Hello".

** Utiliser un index de départ négatif **

const str = "Hello, world!";
const result = str.substr(-6);
console.log(result); // Output: "world!"

Dans cet exemple, substr(-6) extrait une sous-chaîne de str à partir de l'index calculé en traitant -6 comme (longueur de la chaîne + indexDépart), ce qui correspond à l'index du caractère "w". Le résultat est la sous-chaîne "world!".

`.toLowerCase()`

Définition

La méthode toLowerCase() convertit tous les caractères d'une chaîne de caractères en minuscules. Elle ne modifie pas la chaîne d'origine mais renvoie une nouvelle chaîne avec les caractères en minuscules.

Syntaxe

str.toLowerCase()

str : La chaîne de caractères à convertir en minuscules.

Complexité temporelle

La complexité temporelle de la méthode toLowerCase() dépend de la longueur de la chaîne d'origine. En général, elle est linéaire, ce qui signifie que la complexité est proportionnelle à la longueur de la chaîne.

Cas d'usage

Convertir une chaîne en minuscules

const str = "Hello, World!";
const result = str.toLowerCase();
console.log(result); // Output: "hello, world!"

Dans cet exemple, toLowerCase() convertit tous les caractères de la chaîne str en minuscules, produisant la nouvelle chaîne "hello, world!".

Comparaison de chaînes insensible à la casse

const str1 = "Hello";
const str2 = "hello";
const areEqual = str1.toLowerCase() === str2.toLowerCase();
console.log(areEqual); // Output: true

Ici, toLowerCase() est utilisé pour convertir les deux chaînes (str1 et str2) en minuscules avant de les comparer. Cela permet de comparer les chaînes de manière insensible à la casse, et dans cet exemple, les deux chaînes sont considérées comme égales.

Validation d'une entrée utilisateur

const userInput = "Mercredi";
const lowerCaseInput = userInput.toLowerCase();

if (lowerCaseInput === "mercredi") {
  console.log("L'utilisateur a entré Mercredi.");
} else {
  console.log("L'utilisateur n'a pas entré Mercredi.");
}

Dans ce cas, toLowerCase() est utilisé pour convertir l'entrée utilisateur en minuscules, permettant de faire une comparaison insensible à la casse. Si l'utilisateur entre "mErCreDi" ou "Mercredi", la condition sera vraie et le message approprié sera affiché.

`.toUpperCase()`

Définition

La méthode toUpperCase() convertit tous les caractères d'une chaîne de caractères en majuscules. Elle ne modifie pas la chaîne d'origine mais renvoie une nouvelle chaîne avec les caractères en majuscules.

Syntaxe

str.toUpperCase()

str : La chaîne de caractères à convertir en majuscules.

Complexité temporelle

La complexité temporelle de la méthode toUpperCase() dépend de la longueur de la chaîne d'origine. En général, elle est linéaire, ce qui signifie que la complexité est proportionnelle à la longueur de la chaîne.

Cas d'usage

Convertir une chaîne en majuscules

const str = "Hello, World!";
const result = str.toUpperCase();
console.log(result); // Output: "HELLO, WORLD!"
Dans cet exemple, toUpperCase() convertit tous les caractères de la chaîne str en majuscules, produisant la nouvelle chaîne "HELLO, WORLD!".

Comparaison de chaînes insensible à la casse

const str1 = "HELLO";
const str2 = "hello";
const areEqual = str1.toUpperCase() === str2.toUpperCase();
console.log(areEqual); // Output: true

Ici, toUpperCase() est utilisé pour convertir les deux chaînes (str1 et str2) en majuscules avant de les comparer. Cela permet de comparer les chaînes de manière insensible à la casse, et dans cet exemple, les deux chaînes sont considérées comme égales.

Validation d'une entrée utilisateur

const userInput = "motdepasse";
const upperCaseInput = userInput.toUpperCase();

if (upperCaseInput === "MOTDEPASSE") {
  console.log("L'utilisateur a entré motdepasse en majuscules.");
} else {
  console.log("L'utilisateur n'a pas entré motdepasse en majuscules.");
}

Dans ce cas, toUpperCase() est utilisé pour convertir l'entrée utilisateur en majuscules, permettant de faire une comparaison insensible à la casse. Si l'utilisateur entre "MotDePasse" ou "MOTDEPASSE", la condition sera vraie et le message approprié sera affiché.

`.trim()`

Définition

La méthode trim() supprime les espaces en début et en fin d'une chaîne de caractères. Les espaces à l'intérieur de la chaîne ne sont pas affectés. La méthode trim() est souvent utilisée pour nettoyer les entrées utilisateur en éliminant les espaces inutiles.

Syntaxe

str.trim()

str : La chaîne de caractères à nettoyer en supprimant les espaces en début et en fin.

Complexité temporelle

La complexité temporelle de la méthode trim() dépend de la longueur de la chaîne d'origine. En général, elle est linéaire, ce qui signifie que la complexité est proportionnelle à la longueur de la chaîne.

Cas d'usage

Supprimer les espaces en début et en fin d'une chaîne

const str = "   Hello, World!   ";
const result = str.trim();
console.log(result); // Output: "Hello, World!"

Dans cet exemple, trim() supprime les espaces en début et en fin de la chaîne str, produisant la nouvelle chaîne "Hello, World!".

Comparaison de chaînes insensible aux espaces

const str1 = " Hello ";
const str2 = "Hello";
const areEqual = str1.trim() === str2.trim();
console.log(areEqual); // Output: true

Ici, trim() est utilisé pour supprimer les espaces en début et en fin des deux chaînes (str1 et str2) avant de les comparer. Cela permet de comparer les chaînes de manière insensible aux espaces, et dans cet exemple, les deux chaînes sont considérées comme égales.

Nettoyage d'une entrée utilisateur

const userInput = "   Salut   ";
const cleanedInput = userInput.trim();

console.log(cleanedInput); // Output: "Salut"

Dans ce cas, trim() est utilisé pour supprimer les espaces en début et en fin de l'entrée utilisateur, nettoyant ainsi la chaîne. Cela permet de s'assurer que la chaîne ne contient pas d'espaces inutiles.

Et voilà, nous avons terminé la liste des méthodes utiles pour manipuler les chaînes de caractère en Javascript. Si vous avez apprécié cet article, n'hésitez pas à laisser un commentaire pour me le faire savoir.

Manipuler les tableaux en Javascript

Claire D. — Sun, 11 Jun 2023 14:53:18 +0000

Cet article fait suite à mon précédent article intitulé Comprendre les tableaux en Javascript.
Si tu as oublié ce qu'est un tableau, ou si tu veux connaître les méthodes pour ajouter et supprimer des éléments, je t'invite à le consulter en premier lieu.

Alors, prêt(e) ? Accroche-toi, nous allons explorer ensemble les méthodes les plus utiles pour manipuler les tableaux en Javascript ! 🛫

Parfois, on n'est pas sûr si l'objet qu'on souhaite manipuler est réellement un tableau. Dans ce cas, on peut utiliser :

`Array.isArray(valeur)` : renvoie `true` si l'objet passé en argument est un Array, et `false` sinon

Array.isArray([23, 22, 21]); // true
Array.isArray("pantoufle"); // false

Itération

Passons maintenant aux choses sérieuses. Que faire si je veux effectuer une action sur chaque élément de mon tableau ? C'est ce qu'on appelle "itérer" sur un tableau.

`array.forEach(function(item, index, array){ //... });` : exécute une fonction sur chaque élément du tableau.

const fruits = ['pomme', 'banane', 'orange'];
fruits.forEach((fruit) => {
  console.log(fruit);
});
// 'pomme'
// 'banane'
// 'orange'

Recherche dans un tableau

Il existe également des méthodes pratiques pour chercher des éléments dans un tableau sans avoir à les parcourir un par un (sans boucle).

`array.indexOf(element, indiceDepart);` : recherche un élément à partir de l'indice de départ spécifié, et renvoie son indice s'il est trouvé.

Si l'élément n'est pas présent dans le tableau, la méthode renvoie -1.

const fruits = ['pomme', 'banane', 'orange'];
console.log(fruits.indexOf('orange')); // 2
console.log(fruits.indexOf('kiwi')); // -1

`array.includes(valeur, indiceDepart);` : renvoie `true` si le tableau contient la valeur spécifiée, et `false` sinon.

const fruits = ['pomme', 'banane', 'orange'];
console.log(fruits.includes('pomme')); // true
console.log(fruits.includes('kiwi')); // false

`array.find(fonction);` : renvoie la valeur du premier élément qui satisfait la condition spécifiée par la fonction de test.

Si aucun élément ne satisfait la condition, la méthode renvoie undefined.

const personnes = [
  { nom: 'Alice', age: 25 },
  { nom: 'Bob', age: 17 },
  { nom: 'Charlie', age: 20 },
  { nom: 'Dave', age: 16 }
];

const personneMajeure = personnes.find(personne => personne.age >= 18);

console.log(personneMajeure); // { nom: 'Alice', age: 25 }

`array.filter(fonction);` : créé une copie du tableau en ne conservant que les éléments qui satisfont la condition spécifiée par la fonction de test.

const etudiants = [
  { nom: 'Alice', moyenne: 90 },
  { nom: 'Bob', moyenne: 75 },
  { nom: 'Charlie', moyenne: 85 },
  { nom: 'Dave', moyenne: 95 }
];

const etudiantsSelectionnes = etudiants.filter(etudiant => etudiant.moyenne >= 80);

console.log(etudiantsSelectionnes);
// [
//   { nom: 'Alice', moyenne: 90 },
//   { nom: 'Charlie', moyenne: 85 },
//   { nom: 'Dave', moyenne: 95 }
// ]

Transformation d'un tableau

Pour finir, voici quelques méthodes pour modifier un tableau.

`array.map(fonction);` : appelle une fonction pour chaque élément du tableau et renvoie un nouveau tableau contenant les résultats.

const fruits = [
  { id: 1, nom: 'Pomme' },
  { id: 2, nom: 'Banane' },
  { id: 3, nom: 'Orange' },
  { id: 4, nom: 'Fraise' }
];

const nomsFruits = fruits.map(fruit => fruit.nom);

console.log(nomsFruits); // ['Pomme', 'Banane', 'Orange', 'Fraise']

`array.sort();` : modifie le tableau en le triant par ordre croissant

Il est possible d'utiliser une fonction pour spécifier l'ordre de tri, comme dans l'exemple ci-dessous.

const etudiants = [
  { nom: 'Alice', moyenne: 90 },
  { nom: 'Bob', moyenne: 75 },
  { nom: 'Charlie', moyenne: 85 },
  { nom: 'Dave', moyenne: 95 }
];

etudiants.sort((a, b) => a.moyenne - b.moyenne);

console.log(etudiants);
// [
//   { nom: 'Bob', moyenne: 75 },
//   { nom: 'Charlie', moyenne: 85 },
//   { nom: 'Alice', moyenne: 90 },
//   { nom: 'Dave', moyenne: 95 }
// ]

`array.reverse();` : inverse l'ordre des éléments du tableau

const nombres = [1, 2, 3, 4, 5];

nombres.reverse();

console.log(nombres); // [5, 4, 3, 2, 1]

`array.reduce(callback, valeurInitiale)` : réduit les éléments d'un tableau à une seule valeur. Cette méthode exécute une fonction de rappel sur chaque élément du tableau et accumule le résultat à chaque itération.

const nombres = [1, 2, 3, 4, 5];

const somme = nombres.reduce((acc, nombre) => acc + nombre, 0);

console.log(somme); // 15

Et voilà, nous avons terminé la liste des méthodes utiles pour manipuler les tableaux en Javascript. Si vous avez apprécié cet article, n'hésitez pas à laisser un commentaire pour me le faire savoir.

Comprendre les tableaux en Javascript

Claire D. — Mon, 05 Jun 2023 09:14:30 +0000

Après avoir vu les méthodes de chaînes de caractères, passons aux tableaux.

Un tableau (ou array en anglais) est similaire à un casier dans des vestiaires.

On peut mettre un élément de notre choix dans chaque casier et il peut y avoir autant d'éléments que souhaité.

// Je peux mettre des nombres dans mon tableau
let nums = [23, 56, 12, 0, 54];

// Ou des chaînes de caractères
let prenoms = ["Marcel", "Pascal", "Michelle"];

// Ou mettre plusieurs types ou
// même mettre des tableaux dans les tableaux #inception
let memo = ["samedi", [453, 23, "pizza"]];

// Ou avoir un tableau vide
let mesAmis = [];

💡 Que peut-on faire avec les tableaux ?

Il y a plusieurs méthodes très pratiques pour manipuler les tableaux et organiser nos données.

Comment ajouter ou supprimer des éléments

Ajouter ou extraire un élément

Il est fréquent de devoir modifier un tableau en ajoutant ou en supprimant des éléments.

`array.push()` ajoute un élément à la fin du tableau

`array.unshift()` ajoute un élément au début du tableau

// Je commence avec cet array
let nourriturePreferee = ["pain", "fromage", "chocolat"]

// ajoute un élément au début de la liste
nourriturePreferee.unshift("pâtes")
console.log(nourriturePreferee) // ['pâtes', 'pain', 'fromage', 'chocolat']

// ajoute quelque chose en fin de liste
nourriturePreferee.push("chou-fleur")
console.log(nourriturePreferee) // ['pâtes', 'pain', 'fromage', 'chocolat', 'chou-fleur']

Pour extraire un élément de notre tableau, nous avons les méthodes suivantes :

`array.pop()` extrait le dernier élément du tableau

`array.shift()` extrait le premier élément du tableau

// On reprend le même exemple
let nourriturePreferee = ["pain", "fromage", "chocolat"]

// extrait le premier élément de la liste
nourriturePreferee.shift()
console.log(nourriturePreferee) // ['fromage', 'chocolat']

// extrait le dernier élément
nourriturePreferee.pop()
console.log(nourriturePreferee) // ['fromage']

Ajouter ou supprimer un ou plusieurs éléments

En plus de ces méthodes de base, il en existe d'autres qui retournent un nouveau tableau sans modifier les tableaux d'origine.

`concat(valeur0, valeur1)` : fusionne deux ou plusieurs tableaux en les concaténant*

concaténer : mettre bout à bout

let sports1 = ["foot", "judo", "basket"]
let sports2 = ["rugby", "pétanque"]
let sportsTotal = sports1.concat(sports2)
console.log(sportsTotal) 
// ['foot', 'judo', 'basket', 'rugby', 'pétanque']

`arr.slice(début, fin)` : renvoie un tableau, contenant une copie superficielle d'une portion du tableau d'origine

let mesSports = ["danse", "musculation", "course", "karaté", "ski"]
sportsDuMardi = mesSports.slice(1,3)
console.log(sportsDuMardi)
// ['musculation', 'course']

⚠️ On note que l'élément 1 de notre tableau est "musculation" et non pas "danse". C'est parce que la numérotation des tableau commence toujours à partir de 0.

La méthode slice est très pratique, mais si je veux modifier mon tableau d'origine en remplaçant ou supprimant un ou des éléments ?

Il existe une autre méthode.

`arr.splice(début, nbASupprimer[, élem1[, élem2[, ...]]])` : insère, retire, remplace un ou des éléments. Change le contenu du tableau.

let mesSports = ["danse", "musculation", "course", "karaté", "ski"]
mesSports.splice(2, 1, "rugby") 
// sélection le 3ème élément du tableau et le remplace par rubgy
console.log(mesSports)
// ['danse', 'musculation', 'rugby', 'karaté', 'ski']

Dans un prochain article, nous verrons davantage de méthodes pour manipuler les tableaux.
Merci d'avoir lu cet article.

Forem: Claire D.

La gestion de fichiers et Streams en Node.js avec fs

Comment l'utiliser ? 🛠️

📖 Lire un fichier : fs.readFile(path[, options], callback)

📝 Écrire dans un fichier : fs.writeFile(file, data[, options], callback)

✨ Renommer un fichier : fs.rename(oldPath, newPath, callback)

📂 Copier un fichier : fs.copyFile(srcPath, destPath, callback)

🗑️ Supprimer un fichier : fs.unlink(path, callback)

📂 Lire le contenu d'un répertoire : fs.readdir(path[, options], callback)

📂 Créer un répertoire : fs.mkdir(path[, options], callback)

📊 Obtenir les informations sur un fichier : fs.stat(path, callback)

🔍 Vérifier l'accessibilité d'un fichier : fs.access(path[, mode], callback)

🌊 Les Streams Node.js

📖 Lire des fichiers avec un flux : fs.createReadStream(path[, options])

📝 Créer des fichiers avec un flux : fs.createWriteStream(path[, options])

Avantages des flux de données :

Efficacité de la mémoire

Performances

Canalisation

CORS

Comprendre CORS

Pour contourner ces blocages lors du développement

Quel est le rôle de CORS ?

Bien configurer les règles CORS

Les Endpoints dans REST

Qu'est-ce qu'un endpoint ?

Avec les méthodes HTTP :

Query Strings

Path parameters

Bonnes Pratiques

Tout ce que tu dois savoir sur les statuts HTTP 🌐

C'est quoi un statut HTTP ?

Pourquoi les utilise-t-on ?

🔍 Avoir une communication plus transparente

👩‍💻 Une meilleure gestion des erreurs

🔄 La redirection permet une navigation fluide

🚀 Des performances optimisées

Les requêtes HTTP

GET

POST

PUT

DELETE

Le mot-clé this en JavaScript

Dans le contexte d'une méthode d'objet

Dans le contexte d'un constructeur de classe

Dans le contexte d'un événement

L'asynchronisme en JavaScript

Les callbacks, ou fonctions de rappel

Utilisation de promesses (Promises)

L'API async/await

Quelles sont les nouveautés d'ECMAScript 14 ?

Array.prototype.toSorted()

Array.prototype.toReversed()

Array.prototype.with()

Array.prototype.findLast()

Array.prototype.findLastIndex()

Array.prototype.toSpliced()

Support Shebang ( (#!/) )

Les 8 concepts de base de JavaScript

1. Déclarer des variables

Javascript compte plusieurs types

2. Les opérateurs

3. Les Structures de controle

Les instructions conditionnelles

Boucles

4. Les fonctions

5. Les objets

6. Les événements et les gestionnaires d'événements

7. Promesses et asynchronicité

8. Portée et fermeture

Guide des méthodes JS [chaînes de caractères]

.charAt()

Définition

Syntaxe

Complexité temporelle

Cas d'usage

.charCodeAt()

Définition

Syntaxe

Complexité temporelle

📖 Lire un fichier : `fs.readFile(path[, options], callback)`

📝 Écrire dans un fichier : `fs.writeFile(file, data[, options], callback)`

✨ Renommer un fichier : `fs.rename(oldPath, newPath, callback)`

📂 Copier un fichier : `fs.copyFile(srcPath, destPath, callback)`

🗑️ Supprimer un fichier : `fs.unlink(path, callback)`

📂 Lire le contenu d'un répertoire : `fs.readdir(path[, options], callback)`

📂 Créer un répertoire : `fs.mkdir(path[, options], callback)`

📊 Obtenir les informations sur un fichier : `fs.stat(path, callback)`

🔍 Vérifier l'accessibilité d'un fichier : `fs.access(path[, mode], callback)`

📖 Lire des fichiers avec un flux : `fs.createReadStream(path[, options])`

📝 Créer des fichiers avec un flux : `fs.createWriteStream(path[, options])`

Les `callbacks`, ou fonctions de rappel

L'API `async/await`

`Array.prototype.toSorted()`

`Array.prototype.toReversed()`

`Array.prototype.with()`

`Array.prototype.findLast()`

`Array.prototype.findLastIndex()`

`Array.prototype.toSpliced()`

Support Shebang ( `(#!/)` )

`.charAt()`

`.charCodeAt()`

`.concat()`

`.includes()`

`.indexOf()`

`.match()`

`.repeat()`

`.replace()`

`.search()`

`.slice()`

`.split()`

`.substr()`

`.toLowerCase()`

`.toUpperCase()`

`.trim()`

`Array.isArray(valeur)` : renvoie `true` si l'objet passé en argument est un Array, et `false` sinon

`array.forEach(function(item, index, array){ //... });` : exécute une fonction sur chaque élément du tableau.