Variables globales, disponibilité de fetch, API de fichiers et de réseau
Détectez l’environnement d’exécution en toute sécurité (globalThis/window/global), vérifiez la disponibilité de fetch et comprenez pourquoi les fichiers nécessitent Node tandis que le navigateur se concentre sur le DOM et le réseau
Variables globales, disponibilité de fetch, API de fichiers et de réseau est une leçon JavaScript Academy gratuite sur CoddyKit. Ceci est la leçon 1 sur 3. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage JavaScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours JavaScript Academy comprend 3 leçons au total.
Vue d’ensemble
Objectif : savoir où votre code s’exécute.
- Objets globaux : globalThis, window, global
- fetch : détectez la fonctionnalité, ne la présumez pas
- Fichiers : Node has fs ; les navigateurs non
- URL : l’API URL fonctionne dans les deux environnements

Détection sûre de l’environnement d’exécution (safe)
Utilisez des vérifications avec typeof pour éviter les ReferenceErrors et déterminer où vous exécutez le code.
// Detect presence of common globals
const hasWindow = typeof window !== "undefined";
const hasGlobal = typeof global !== "undefined";
const hasProcess = typeof process !== "undefined" && process && typeof process.version === "string";
console.log("globalThis exists?", typeof globalThis !== "undefined");
console.log("window?", hasWindow);
console.log("global?", hasGlobal);
console.log("Node process?", hasProcess);

fetch : détection de fonctionnalité
Les navigateurs disposent généralement de fetch ; les anciennes versions de Node ne l’ont peut-être pas. Vérifiez d’abord typeof fetch.
// Feature-detect fetch; do not assume it exists everywhere
const hasFetch = typeof fetch === "function";
console.log("fetch available?", hasFetch);
// If available, you could call fetch(...). For a safe demo we only log.
if (!hasFetch) {
console.log("Provide a fallback or use a library in Node versions without fetch.");
}

Fichiers : Node et navigateur
Node expose fs pour les fichiers ; le navigateur ne le fait pas. Gardez le même chemin d’exécution sûr grâce à une vérification de fonctionnalité.
// Files are a Node concern; browsers cannot read your disk directly
const hasRequire = typeof require === "function";
console.log("CommonJS require available?", hasRequire);
// Safe message instead of real file I/O (keeps the demo runnable everywhere)
if (hasRequire) {
console.log("In Node you can use fs for files; in browsers you cannot.");
} else {
console.log("No require here; likely a browser-like or sandboxed runtime.");
}

Partagée : API URL
La classe URL analyse les adresses de manière cohérente dans les différents environnements d’exécution ; elle est pratique pour les petits outils.
// URL is available in both environments
const u = new URL("https://example.com/path?x=1#top");
console.log("host:", u.host);
console.log("pathname:", u.pathname);
console.log("search:", u.search);
console.log("hash:", u.hash);

Bonnes habitudes pour débuter
Conseils :
- Vérifiez typeof fetch avant de l’utiliser.
- Les fichiers nécessitent Node (par ex. fs) ; les navigateurs se concentrent sur le DOM et le réseau.
- Utilisez globalThis pour les objets globaux portables.
- Préférez les petites vérifications de fonctionnalité aux suppositions sur l’environnement.

Quiz sur la détection de fetch
Vérification rapide : détecter fetch en toute sécurité.

Récapitulatif
Récapitulatif : détectez l’environnement d’exécution avec des vérifications sûres de typeof, détectez la présence de fetch, souvenez-vous que les fichiers sont du côté de Node et utilisez URL dans les deux environnements.

Questions Fréquemment Posées
La leçon « Variables globales, disponibilité de fetch, API de fichiers et de réseau » est-elle gratuite ?
Oui — le texte complet de « Variables globales, disponibilité de fetch, API de fichiers et de réseau » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours JavaScript Academy, passe à CoddyKit PRO. Le cours JavaScript Academy comprend 3 leçons au total.
Qu'est-ce que j'apprendrai dans « Variables globales, disponibilité de fetch, API de fichiers et de réseau » ?
Détectez l’environnement d’exécution en toute sécurité (globalThis/window/global), vérifiez la disponibilité de fetch et comprenez pourquoi les fichiers nécessitent Node tandis que le navigateur se c… Tu pratiques JavaScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.
Dois-je avoir de l'expérience pour commencer JavaScript Academy ?
Aucune expérience préalable n'est requise. JavaScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 1 sur 3.
Combien de temps prend la leçon « Variables globales, disponibilité de fetch, API de fichiers et de réseau » ?
La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.
Peux-tu écrire et exécuter du code dans cette leçon JavaScript Academy ?
Oui. Chaque leçon JavaScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.
Toutes les leçons de ce cours
- Variables globales, disponibilité de fetch, API de fichiers et de réseau
- Particularités du chargeur ESM, différences entre chemins et URL
- Variables d’environnement et modèles de configuration