Votre code JavaScript est-il nul ?

JavaScript, le langage qui fait fonctionner les sites web, a été créé en 1995 par Brendan Eich en seulement 10 jours. Il est rapidement devenu populaire, même si de nombreuses personnes ont critiqué ses caractéristiques étranges. Au fil du temps, JavaScript est devenu un langage fort et flexible, crucial pour le développement Web moderne. Cependant, de nombreux programmeurs écrivent encore du code JavaScript lent, risqué et mal conçu.

Examinons quelques erreurs courantes que les programmeurs peuvent commettre lors de l'écriture de code JavaScript. Et vous montrer également la correction de ces erreurs, pour rendre votre code plus sûr et plus facile à comprendre.

1. Variables globales et espace de noms pollué

JavaScript est très flexible, ce qui peut parfois entraîner des problèmes. Les programmeurs peuvent accidentellement créer des variables pouvant être utilisées n'importe où dans le code, ce qui peut provoquer des erreurs inattendues, en particulier dans les grands projets.

var user = "Admin"; // Declared in the global scope
function setUser() {
    user = "Guest"; // Accidentally overwrites the global variable
}
setUser();
console.log(user); // "Guest" - Unintended behavior

L'utilisation d'une IIFE (Immediately Invoked Function Expression) maintient les variables cachées dans une partie spécifique du code, les empêchant d'interférer avec d'autres parties du code. Cela rend le code plus sûr et plus facile à gérer.

(() => {
    let user = "Admin"; // Scoped to this block
    function setUser() {
        user = "Guest";
    }
    setUser();
    console.log(user); // "Guest" - Intended behavior
})();

2. Gestion des données non sécurisée

Un code JavaScript mal écrit peut parfois révéler des informations secrètes ou ne pas nettoyer correctement les entrées de l'utilisateur, ce qui peut entraîner des problèmes de sécurité tels que des attaques de type Cross-Site Scripting (XSS).

const userInput = "<script>alert('Hacked!')</script>";
document.getElementById("output").innerHTML = userInput; // Wrong!

L'utilisation de textContent ou la désinfection correcte des entrées empêchent l'exécution de scripts malveillants.

const userInput = "<script>alert('Hacked!')</script>";
const sanitizedInput = userInput.replace(/</g, "<").replace(/>/g, ">");
document.getElementById("output").textContent = sanitizedInput;

3. Dépendance excessive à l'égard de eval()

La fonction eval() est dangereuse car elle permet d'exécuter du code à partir d'une chaîne. Cela peut être utilisé par des pirates informatiques pour introduire du code malveillant.

const userCode = "alert('Hacked!')";
eval(userCode); // Wrong!

Évitez complètement d'utiliser eval(), mais utilisez plutôt des alternatives plus sûres comme Function avec un contrôle strict.

const userCode = "alert('Hacked!')";
// Avoid eval(); implement safer alternatives
try {
    const safeFunction = new Function(userCode); // Limited scope execution
    safeFunction();
} catch (e) {
    console.error("Execution failed:", e);
}

4. Faible gestion des erreurs

Ignorer ou mal gérer les erreurs peut provoquer le crash de votre application ou même la fuite d'informations privées.

const fetchData = async () => {
    const response = await fetch("https://api.example.com/data");
    return response.json(); // Assuming API always returns valid JSON
};

Validez toujours les réponses et mettez en œuvre une gestion structurée des erreurs.

const fetchData = async () => {
    try {
        const response = await fetch("https://api.example.com/data");
        if (!response.ok) throw new Error("Network response was not ok");
        return await response.json();
    } catch (error) {
        console.error("Fetch failed:", error.message);
        return null; // Graceful degradation
    }
};

5. Secrets codés en dur

Maintenant, c'est là que beaucoup de développeurs débutants font des erreurs. Stocker des informations secrètes telles que des clés API ou des mots de passe directement dans des fichiers JavaScript est une mauvaise idée car elles sont facilement accessibles à toute personne consultant le code.

const API_KEY = "12345-SECRET";
fetch(`https://api.example.com/data?key=${API_KEY}`);

Utilisez des variables d'environnement (.env ou .env.local) ou des solutions de stockage sécurisées pour garder les secrets hors de votre base de code.

var user = "Admin"; // Declared in the global scope
function setUser() {
    user = "Guest"; // Accidentally overwrites the global variable
}
setUser();
console.log(user); // "Guest" - Unintended behavior

---

Écrire un bon code JavaScript ne consiste pas seulement à le faire fonctionner. Il est également important de s’assurer qu’il est sûr, rapide et facile à comprendre et à modifier. En corrigeant les erreurs courantes et en suivant les bonnes pratiques, vous pouvez transformer votre JavaScript désordonné en un code propre et professionnel.

La prochaine fois que vous écrirez du JavaScript, demandez-vous : "Est-ce que mon code est nul ?" Si la réponse est « oui », il est temps de l'améliorer, mon pote !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!