javascript

Airbnb JavaScript Style Guide() { *Une approche généralement raisonnable de JavaScript* > **Note** : ce guide suppose que vous utilisez Babel et exige que vous utilisiez babel-preset-airbnb ou l'équivalent. Il suppose également que vous installez des shims/polyfills dans votre application, avec airbnb-browser-shims ou l'équivalent. Ce guide est également disponible dans d'autres langues. Voir traduction Autres guides de style - ES5 (déprécié) - Réagir - CSS-in-JavaScript - CSS & Sass - Ruby Sommaire 1. Types 1. Références 1. Objets 1. Tableaux 1. Déstructuration 1. Cordes 1. Fonctions 1. Fonctions fléchées 1. Classes et constructeurs 1. Modules 1. Itérateurs et générateurs 1. Propriétés 1. Variables 1. Hommage 1. Opérateurs de comparaison et égalité 1. Blocs 1. Déclarations de contrôle 1. Commentaires 1. Espace blanc 1. Les virgules 1. Semicolons 1. Type Casting & Coercion 1. Conventions de désignation 1. Accessoires 1. Événements 1. jQuery 1. ECMAScript 5 Compatibilité 1. ECMAScript 6+ (ES 2015+) Styles 1. Bibliothèque standard 1. Essais 1. Exécution 1. Ressources 1. Dans la nature 1. Traduction 1. Guide de style JavaScript 1. Dialoguez avec nous sur JavaScript 1. Contributions 1. Licence 1. Amendements Types <a name="types--primitives"></a><a name="1.1"></a> - 1.1 **Primitifs**: Lorsque vous accédez à un type primitif, vous travaillez directement sur sa valeur. - "chaîne" - "numéro" - "booléen" - "null" - "indéfini" - "symbole" - "bigint" <br /> - Les symboles et les BigInts ne peuvent pas être remplis fidèlement, de sorte qu'ils ne devraient pas être utilisés lors du ciblage des navigateurs/environnements qui ne les supportent pas nativement. <a name="types--complexe"></a><a name="1.2"></a> - 1.2 **Complexe**: Lorsque vous accédez à un type complexe, vous travaillez sur une référence à sa valeur. - "objet" - "partage" - "fonction" <br /> Retour en haut Références <a name="references--prefer-const"></a><a name="2.1"></a> 2.1 Utiliser `const` pour toutes vos références; éviter d'utiliser `var`. eslint: `prefer-const`, `no-const-assign` > Pourquoi ? Cela garantit que vous ne pouvez pas réassigner vos références, ce qui peut conduire à des bogues et difficile à comprendre code. <a name="references--disallow-var"></a><a name="2.2"></a> - 2.2 Si vous devez réaffecter des références, utilisez `let` au lieu de `var`. eslint: ' no-var ' > Pourquoi ? `let` est block-scoped plutôt que fonction-scoped comme `var`. <a name="references--block-scope"></a><a name="2.3"></a> - 2.3 Notez que les deux "let` et "const` sont block-scoped, alors que "var` est fonction-scoped. Dans le code ci-dessus, vous pouvez voir que le renvoi `a` et `b` produira un Error de référence, alors que `c` contient le numéro. Cela est dû au fait que `a` et `b` sont des blocs scoped, tandis que `c` est scoped à la fonction contenant. Retour en haut Objets <a name="objet--no-new"></a><a name="3.1"></a> - 3.1 Utilisez la syntaxe littérale pour la création d'objets. eslint: "pas de nouvel objet" <a name="es6-computed-properties"></a><a name="3.4"></a> - 3.2 Utilisez des noms de propriétés calculés lors de la création d'objets avec des noms de propriétés dynamiques. > Pourquoi ? Ils vous permettent de définir toutes les propriétés d'un objet en un seul endroit. <a name="es6-objet-shorthand"></a><a name="3.5"></a> 3.3 Utiliser la méthode objet shorthand. eslint: "objet-shorthand" <un nom="es6-objet-concise"></a><un nom="3.6"></a> 3.4 Utiliser la valeur de propriété shorthand. eslint: "objet-shorthand" > Pourquoi ? Il est plus court et descriptif. <a name="objet--grouped-shorthand"></a><a name="3,7"></a> - 3.5 Groupez vos propriétés shorthand au début de votre déclaration d'objet. > Pourquoi ? Il est plus facile de savoir quelles propriétés utilisent le shorthand. <a name="objet--quoted-props"></a><a name="3.8"></a> - 3,6 Citer uniquement les propriétés qui sont des identifiants invalides. eslint: "quote-props" > Pourquoi ? En général, nous considérons qu'il est subjectivement plus facile à lire. Il améliore la mise en évidence syntaxique, et est également plus facilement optimisé par de nombreux moteurs JS. <un nom="objets--prototype-constructins"></a> - 3.7 N'appelez pas directement les méthodes `Object.prototype`, comme `hasOwnProperty`, `propertyIsEnumerable` et `isPrototypeOf`. eslint: "pas de prototype de constructions" > Pourquoi ? Ces méthodes peuvent être ombragées par des propriétés sur l'objet en question - considérez `{ hasOwnProperty: false }` - ou, l'objet peut être un objet nul (`Object.create(null)`). Dans les navigateurs modernes qui prennent en charge ES2022 ou avec un polyfill tel que <https:/