Maîtrisez le système de fichiers : travailler avec les fichiers en JavaScript

Introduction : pourquoi la gestion des fichiers en JavaScript est incontournable

Imaginez que vous êtes le capitaine d'un vaisseau spatial. Votre mission : gérer les soutes, les réserves d'oxygène et le journal de bord. Dans le développement web, le système de fichiers représente ces soutes, et JavaScript est votre tableau de bord. Sans savoir manipuler les fichiers, vous restez en orbite : impossible de sauvegarder les préférences utilisateur, charger une configuration serveur ou traiter des fichiers journaux.

Beaucoup de débutants pensent que JavaScript ne vit que dans le navigateur et ne peut pas toucher aux fichiers sur le disque. C'est un mythe ! Avec l'arrivée de Node.js (et même dans les navigateurs modernes via l'API File), JavaScript est devenu un outil complet pour interagir avec le système de fichiers. Aujourd'hui, nous allons voir comment lire, écrire, supprimer et déplacer des fichiers, tout en évitant les pièges de l'asynchronisme.

D'ailleurs, si vous débutez en programmation, je vous recommande d'abord d'étudier les bases de JavaScript — cela vous aidera à comprendre plus rapidement les exemples ci-dessous.

Où JavaScript manipule-t-il les fichiers ? Deux mondes, deux approches

Avant de plonger dans le code, clarifions les choses : les opérations sur les fichiers en JS se divisent en deux catégories.

1. JavaScript côté serveur (Node.js)

Ici, nous avons un accès complet au système de fichiers : création, suppression, renommage, lecture de flux — tout ce que vous voulez. On utilise le module intégré fs (File System). C'est un couteau suisse pour la manipulation des fichiers.

2. JavaScript côté client (navigateur)

Le navigateur est une "sandbox" avec des restrictions. Vous ne pouvez pas lire n'importe quel fichier sur l'ordinateur de l'utilisateur (sinon les hackers feraient la fête). Mais vous pouvez travailler avec les fichiers que l'utilisateur a lui-même sélectionnés via <input type="file">, ou via les API FileReader et Blob.

Dans cet article, nous nous concentrerons sur Node.js, mais à la fin, nous vous offrirons un bonus : un exemple pour le navigateur.

Le module fs : votre outil principal

Dans Node.js, la manipulation des fichiers commence par l'importation du module fs :

const fs = require('fs'); // ancienne syntaxe\n// ou\nimport fs from 'fs'; // si vous utilisez les modules ES

Le module fs propose trois modes de fonctionnement : synchrone, asynchrone avec callbacks, et asynchrone avec promesses. Nous utiliserons ce dernier avec async/await, car c'est l'approche moderne et la plus lisible.

Lire un fichier : du simple au complexe

Imaginons que nous ayons un fichier data.txt contenant du texte. La façon la plus simple de le lire :

import { readFile } from 'fs/promises';\n\nasync function lireMonFichier() {\n  try {\n    const data = await readFile('data.txt', 'utf-8');\n    console.log(data);\n  } catch (err) {\n    console.error('Erreur de lecture :', err.message);\n  }\n}\n\nlireMonFichier();

Qu'est-ce qui est important ici ? 'utf-8' — l'encodage. Si vous ne le spécifiez pas, vous obtiendrez un buffer brut qu'il faudra convertir en chaîne de caractères. Pour les fichiers texte, indiquez toujours l'encodage.

Si le fichier est volumineux (par exemple, un fichier journal de 500 Mo), le lire en entier est une mauvaise idée. C'est là que les flux (streams) entrent en jeu :

import { createReadStream } from 'fs';\nimport { createInterface } from 'readline';\n\nasync function lireGrosFichier() {\n  const stream = createReadStream('grosfichier.log', 'utf-8');\n  const rl = createInterface({ input: stream });\n\n  for await (const line of rl) {\n    console.log('Ligne :', line);\n    // Traitez chaque ligne au fur et à mesure de la lecture\n  }\n}\n\nlireGrosFichier();

Écrire dans un fichier : créer et ajouter

L'écriture se fait de deux manières : l'écrasement (write) et l'ajout (append). La différence est évidente : write efface l'ancien fichier, append ajoute à la fin.

import { writeFile, appendFile } from 'fs/promises';\n\n//