{"id":16974763,"url":"https://github.com/nulldev/javascript-styleguide","last_synced_at":"2025-10-06T06:48:07.635Z","repository":{"id":44245569,"uuid":"145119806","full_name":"NullDev/JavaScript-Styleguide","owner":"NullDev","description":":page_with_curl: The NullDev JavaScript Styleguide","archived":false,"fork":false,"pushed_at":"2024-08-14T09:03:00.000Z","size":494,"stargazers_count":24,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-10T16:50:23.619Z","etag":null,"topics":["es6","eslint","javascript","js","linter","nodejs","nulldev","styleguide"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/NullDev.png","metadata":{"files":{"readme":"README-German-DE.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-08-17T12:48:42.000Z","updated_at":"2024-08-14T09:03:03.000Z","dependencies_parsed_at":"2024-01-17T16:59:19.882Z","dependency_job_id":"3ca634c1-2c2c-4b2a-b97e-2065d4d959ea","html_url":"https://github.com/NullDev/JavaScript-Styleguide","commit_stats":null,"previous_names":["nulldev/javascript-styleguide"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NullDev%2FJavaScript-Styleguide","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NullDev%2FJavaScript-Styleguide/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NullDev%2FJavaScript-Styleguide/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NullDev%2FJavaScript-Styleguide/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/NullDev","download_url":"https://codeload.github.com/NullDev/JavaScript-Styleguide/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243853647,"owners_count":20358454,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["es6","eslint","javascript","js","linter","nodejs","nulldev","styleguide"],"created_at":"2024-10-14T01:07:58.254Z","updated_at":"2025-10-06T06:48:02.593Z","avatar_url":"https://github.com/NullDev.png","language":"JavaScript","readme":"[![NullDev JavaScript Styleguide](https://i.imgur.com/VcFtkgK.png)](https://nulldev.org)\n\n# NullDev JavaScript StyleGuide auf Deutsch (WIP)\n\n\u003cp align=\"center\"\u003e\u003cimg height=\"150\" width=\"auto\" src=\"https://i.imgur.com/eCmJFjH.png\" /\u003e\u003c/p\u003e\n\u003cp align=\"center\"\u003e\u003cb\u003eEin \u003ci\u003ezumeist\u003c/i\u003e vernünftiger Ansatz für JavaScript\u003c/b\u003e\u003c/p\u003e\n\u003cp align=\"center\"\u003e\u003csub\u003eOder... Hauptsächlich NodeJS...\u003c/sub\u003e\u003c/p\u003e\n\n\u003c/p\u003e\n\n## Inhalt\n\n  1. :clipboard: [Typen](#types)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n       - [1.1](#types--primitives) Primitive Typen\n       - [1.2](#types--complex) Komplexe Typen\n\n     \u003c/details\u003e\n\n  1. :link: [Referenzen](#references)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n       - [2.1](#references--prefer-const) `const` bevorzugen\n       - [2.2](#references--disallow-var) `var` verbieten\n       - [2.3](#references--let-require) `let` für `require()`\n       - [2.4](#references--block-scope) Block scope\n\n     \u003c/details\u003e\n\n  1. :package: [Objekte](#objects)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [3.1](#objects--no-new) Literals\n     - [3.2](#es6-computed-properties) Computed properties\n     - [3.3](#es6-object-shorthand) Objekt Kurzform\n     - [3.4](#es6-object-concise) Object concise\n     - [3.5](#objects--grouped-shorthand) Grouped shorthand\n     - [3.6](#objects--quoted-props) Quoted properties\n     - [3.7](#objects--prototype-builtins) Prototype Builtins\n     - [3.8](#objects--rest-spread) Rest spread\n\n     \u003c/details\u003e\n\n  1. :bookmark_tabs: [Arrays](#arrays)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [4.1](#arrays--literals) Literale\n     - [4.2](#arrays--push) Push\n     - [4.3](#es6-array-spreads) Array spreads\n     - [4.4](#arrays--from-iterable) spread für iterable\n     - [4.5](#arrays--from-array-like) Array-ähnliche Objekte\n     - [4.6](#arrays--mapping) Mapping\n     - [4.7](#arrays--callback-return) Callback return\n     - [4.8](#arrays--bracket-newline) Zeilenumbrüche\n\n     \u003c/details\u003e\n\n  1. :hammer: [Destructuring](#destructuring)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [5.1](#destructuring--object) Object destructuring\n     - [5.2](#destructuring--array) Array destructuring\n     - [5.3](#destructuring--object-over-array) Object over array\n\n     \u003c/details\u003e\n\n  1. :page_facing_up: [Strings](#strings)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [6.1](#strings--quotes) Quotes\n     - [6.2](#strings--line-length) Length\n     - [6.3](#es6-template-literals) Template literals\n     - [6.4](#strings--eval) Eval\n     - [6.5](#strings--escaping) Escaping\n\n     \u003c/details\u003e\n\n  1. :pager: [Functions](#functions)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [7.1](#functions--use-strict) Strict mode\n     - [7.2](#functions--declarations) Deklarationen\n     - [7.3](#functions--iife) IIFE's\n     - [7.4](#functions--in-blocks) Nicht-Funktionsblöcke\n     - [7.5](#functions--note-on-blocks) Blöcke (Info)\n     - [7.6](#functions--arguments-shadow) Arguments shadow\n     - [7.7](#es6-rest) Rest\n     - [7.8](#es6-default-parameters) Standard-Parameter\n     - [7.9](#functions--default-side-effects) Side effects\n     - [7.10](#functions--defaults-last) Standardwerte zuletzt\n     - [7.11](#functions--constructor) Funktionskonstruktor\n     - [7.12](#functions--signature-spacing) Signature spacing\n     - [7.13](#functions--mutate-params) Mutating parameters\n     - [7.14](#functions--reassign-params) Neuzuweisung von Parametern\n     - [7.15](#functions--spread-vs-apply) Spread\n     - [7.16](#functions--signature-invocation-indentation) Signaturaufrufseinrückungen\n\n     \u003c/details\u003e\n\n  1. :arrow_right: [Arrow Functions](#arrow-functions)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [8.1](#arrows--use-them) Verwendung\n     - [8.2](#arrows--implicit-return) Implizite Rückgaben\n     - [8.3](#arrows--paren-wrap) Wrap\n     - [8.4](#arrows--one-arg-parens) Weglassen von Klammern\n     - [8.5](#arrows--confusing) Verwirrende Funktionen\n     - [8.6](#whitespace--implicit-arrow-linebreak) Zeilenumbrüche\n\n     \u003c/details\u003e\n\n  1. :triangular_ruler: [Classes \u0026 Constructors](#classes--constructors)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [9.1](#constructors--use-class) `class` verwenden\n     - [9.2](#constructors--extends) Vererbung\n     - [9.3](#constructors--chaining) Verkettung\n     - [9.4](#constructors--tostring) toString Methoden\n     - [9.5](#constructors--no-useless) Keine leeren Konstruktoren\n     - [9.6](#classes--no-duplicate-members) Keine redundanten member\n\n     \u003c/details\u003e\n\n  1. :postbox: [Modules](#modules)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [10.1](#modules--use-them) CommonJS \n     - [10.2](#modules--no-duplicate-imports) Redundante imports\n     - [10.3](#modules--no-mutable-exports) Veränderbare exports\n     - [10.4](#modules--imports-first) Imports zuerst\n     - [10.5](#modules--multiline-imports-over-newlines) Mehrzeilige imports\n\n     \u003c/details\u003e\n\n  1. :arrows_clockwise: [Iterators and Generators](#iterators-and-generators)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [11.1](#iterators--nope) Higher-order functions\n     - [11.2](#generators--nope) Generators\n     - [11.3](#generators--spacing) Spacing\n\n     \u003c/details\u003e\n\n  1. :bookmark_tabs: [Properties](#properties)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [12.1](#properties--dot) Punkt Notation\n     - [12.2](#properties--bracket) Klammer Notation\n     - [12.3](#es2016-properties--exponentiation-operator) Exponenzial operator\n\n     \u003c/details\u003e\n\n  1. :floppy_disk: [Variables](#variables)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [13.1](#variables--const) Globaler Namespace\n     - [13.2](#variables--one-const) Deklaration per Variabel\n     - [13.3](#variables--const-let-group) Gruppierung\n     - [13.4](#variables--define-where-used) Platzierung\n     - [13.5](#variables--no-chain-assignment) Ketten-Zuweisung\n     - [13.6](#variables--unary-increment-decrement) Inkrementierung \u0026 Dekrementierung\n     - [13.7](#variables--linebreak) Zeilenumbrüche\n     - [13.8](#variables--no-unused-vars) Nicht benutzte Variablen\n     - [13.9](#variables--bitwise-floor) Bitwise floor\n\n     \u003c/details\u003e\n\n  1. :arrow_heading_up: [Hoisting](#hoisting)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [14.1](#hoisting--about) About\n     - [14.2](#hoisting--anon-expressions) Anonymous function expressions\n     - [14.3](#hoisting--named-expressions) Named function expressions\n     - [14.4](#hoisting--declarations) Function declarations\n\n     \u003c/details\u003e\n\n  1. :left_right_arrow: [Comparison Operators \u0026 Equality](#comparison-operators--equality)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [15.1](#comparison--eqeqeq) Strict comparison\n     - [15.2](#comparison--if) Conditional statements\n     - [15.3](#comparison--shortcuts) Shortcuts\n     - [15.4](#comparison--moreinfo) Truth Equality\n     - [15.5](#comparison--switch-blocks) Switch blocks\n     - [15.6](#comparison--nested-ternaries) Nested ternaries\n     - [15.7](#comparison--unneeded-ternary) Unneeded-ternaries\n     - [15.8](#comparison--no-mixed-operators) Mixed operators\n\n     \u003c/details\u003e\n\n  1. :black_square_button: [Blocks](#blocks)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [16.1](#blocks--braces) Braces\n     - [16.2](#blocks--cuddled-elses) Cuddled elses\n     - [16.3](#blocks--no-else-return) Returns\n\n     \u003c/details\u003e\n\n  1. :wrench: [Control Statements](#control-statements)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [17.1](#control-statements) Length\n     - [17.2](#control-statements--value-selection) Selection operators\n\n     \u003c/details\u003e\n\n  1. :pencil: [Comments](#comments)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [18.1](#comments--multiline) Multi-line\n     - [18.2](#comments--singleline) Single-line\n     - [18.3](#comments--spaces) Spaces\n     - [18.4](#comments--actionitems) Prefixing / Action-items\n     - [18.5](#comments--fixme) FixMe\n     - [18.6](#comments--todo) ToDo\n\n     \u003c/details\u003e\n\n  1. :white_circle: [Whitespace](#whitespace)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [19.1](#whitespace--spaces) Soft tabs\n     - [19.2](#whitespace--before-blocks) Before blocks\n     - [19.3](#whitespace--around-keywords) Around keywords\n     - [19.4](#whitespace--infix-ops) Infix operators\n     - [19.5](#whitespace--newline-at-end) End of file\n     - [19.6](#whitespace--chains) Chains\n     - [19.7](#whitespace--after-blocks) After blocks\n     - [19.8](#whitespace--padded-blocks) Padded blocks\n     - [19.9](#whitespace--in-parens) Inside parentheses\n     - [19.10](#whitespace--in-brackets) Inside brackets\n     - [19.11](#whitespace--in-braces) Inside curly braces\n     - [19.12](#whitespace--max-len) Line length\n     - [19.13](#whitespace--block-spacing) Block spacing\n     - [19.14](#whitespace--comma-spacing) Comma spacing\n     - [19.15](#whitespace--computed-property-spacing) Computed properties\n     - [19.17](#whitespace--key-spacing) Key spacing\n     - [19.18](#whitespace--no-trailing-spaces) Trailing spaces\n     - [19.19](#whitespace--no-multiple-empty-lines) Multiple empty lines \n\n     \u003c/details\u003e\n\n  1. :small_red_triangle_down: [Commas](#commas)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n       - [20.1](#commas--leading-trailing) Leading commas\n       - [20.2](#commas--dangling) Comma Dangling\n\n     \u003c/details\u003e\n\n  1. :heavy_exclamation_mark: [Semicolons](#semicolons)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n       - [21.1](#semicolons--required) Use semicolons\n\n     \u003c/details\u003e\n\n  1. :twisted_rightwards_arrows: [Type Casting \u0026 Coercion](#type-casting--coercion)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [22.1](#coercion--explicit) Explicit coercion\n     - [22.2](#coercion--strings) Strings\n     - [22.3](#coercion--numbers) Numbers\n     - [22.4](#coercion--comment-deviations) Deviations\n     - [22.5](#coercion--bitwise) Bitwise\n     - [22.6](#coercion--booleans) Booleans\n\n     \u003c/details\u003e\n\n  1. :scroll: [Naming Conventions](#naming-conventions)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [23.1](#naming--descriptive) Beschreibend\n     - [23.2](#naming--camelCase) camelCase\n     - [23.3](#naming--PascalCase) PascalCase\n     - [23.4](#naming--leading-underscore) Unterstriche\n     - [23.5](#naming--self-this) `this`\n     - [23.6](#naming--filename-matches-export) Dateinamen\n     - [23.7](#naming--camelCase-default-export) Standard export\n     - [23.8](#naming--PascalCase-singleton) Singleton\n     - [23.9](#naming--Acronyms-and-Initialisms) Akronyme und Inizialisierungen\n     - [23.10](#naming--uppercase) Großbuchstaben\n\n     \u003c/details\u003e\n\n  1. :arrow_down: [Accessors](#accessors)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [24.1](#accessors--not-required) Not required accessors\n     - [24.2](#accessors--no-getters-setters) Getters \u0026 Setters\n     - [24.3](#accessors--boolean-prefix) Boolean prefix\n     - [24.4](#accessors--consistent) Consistency\n\n     \u003c/details\u003e\n\n  1. :high_brightness: [Events](#events)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [25.1](#events--hash) Hash\n\n     \u003c/details\u003e\n\n  1. :book: [Standard Library](#standard-library)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [26.1](#standard-library--isnan) isNaN\n     - [26.2](#standard-library--isfinite) isFinite\n\n     \u003c/details\u003e\n\n  1. :nut_and_bolt: [jQuery](#jquery)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [27.1](#jquery--dollar-prefix) Prefix\n     - [27.2](#jquery--cache) Cache\n     - [27.3](#jquery--queries) DOM Abfragen\n     - [27.4](#jquery--find) Find\n     - [27.5](#jquery--on) Shorthands\n\n     \u003c/details\u003e\n\n  1. :arrows_counterclockwise: [ECMAScript 5 Kompartibilität](#ecmascript-5-compatibility)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [28.1](#es5-compat--kangax) Kompartibilitäts Tabelle\n\n     \u003c/details\u003e\n\n  1. :six: [ECMAScript 6+ (ES 2015+) Styles](#ecmascript-6-es-2015-styles)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [29.1](#es6-styles) ES6 Styles\n     - [29.2](#tc39-proposals) Proposals\n\n     \u003c/details\u003e\n\n  1. :electric_plug: [Testen](#testing)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [30.1](#testing--tests) Tests\n\n     \u003c/details\u003e\n\n  1. :chart_with_upwards_trend: [Performance](#performance)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [31.1](#performance--performance) Performance\n\n     \u003c/details\u003e\n\n  1. :books: [Resourcen](#resources)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [32.1](#resources--learning-es6) ES6+ lernen\n     - [32.2](#resources--read-this) Zum lesen\n     - [32.3](#resources--tools) Tools\n     - [32.4](#resources--further-reading) Mehr zum lesen\n     - [32.5](#resources--books) Bücher\n     - [32.6](#resources--blogs) Blogs\n     - [32.7](#resources--podcasts) Podcasts\n\n     \u003c/details\u003e\n\n  1. :copyright: [Copyright](#copyright)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [33.1](#copyright--base) Basis\n     - [33.2](#copyright--license) Lizenz\n     - [33.3](#copyright--german) Englisch\n\n     \u003c/details\u003e\n\n  1. :recycle: [Änderungen](#amendments)\n     \u003cdetails\u003e\n     \u003csummary\u003eInhalte anzeigen\u003c/summary\u003e\n\n     - [34.1](#amendments--forking) Forking\n\n     \u003c/details\u003e\n\n## Typen\n  \n  \u003ca name=\"types--primitives\"\u003e\u003c/a\u003e\u003ca name=\"1.1\"\u003e\u003c/a\u003e\n  - [1.1](#types--primitives) **Primitive Typen**: Bei primitiven Datentypen wird immer direkt auf deren Wert zugegriffen.\n\n    - `string`\n    - `number`\n    - `boolean`\n    - `null`\n    - `undefined`\n    - `symbol`\n\n    ```javascript\n    const foo = 1;\n    let bar = foo;\n\n    bar = 9;\n\n    console.log(foo, bar); // =\u003e 1, 9\n    ```\n\n    - Symbols können oft nicht richtig polyfilled werden. Deshalb sollte man sie vermeiden, wenn man für Browserumgebungen entwickelt, die diese nicht nativ unterstützen.\n\n  \u003ca name=\"types--complex\"\u003e\u003c/a\u003e\u003ca name=\"1.2\"\u003e\u003c/a\u003e\n  - [1.2](#types--complex) **Komplexe Typen**: Bei komplexen Datentypen wird immer auf eine Referenz zugegriffen.\n\n    - `object`\n    - `array`\n    - `function`\n\n    ```javascript\n    const foo = [1, 2];\n    const bar = foo;\n\n    bar[0] = 9;\n\n    console.log(foo[0], bar[0]); // =\u003e 9, 9\n    ```\n\n**[⬆ zurück zum Anfang](#table-of-contents)**\n\n## Referenzen\n\n  \u003ca name=\"references--prefer-const\"\u003e\u003c/a\u003e\u003ca name=\"2.1\"\u003e\u003c/a\u003e\n  - [2.1](#references--prefer-const) `const` für alle Referenzen benutzen; Die Verwendung von `var` vermeiden. eslint: [`prefer-const`](https://eslint.org/docs/rules/prefer-const.html), [`no-const-assign`](https://eslint.org/docs/rules/no-const-assign.html)\n\n    \u003e Wieso? Es stellt sicher, dass man Referenzen nicht neu zuweisen kann. Das kann sonst zu Fehlern und schwer verständlichem Code führen.\n\n    ```javascript\n    // schlecht\n    var a = 1;\n    var b = 2;\n\n    // gut\n    const a = 1;\n    const b = 2;\n    ```\n\n  \u003ca name=\"references--disallow-var\"\u003e\u003c/a\u003e\u003ca name=\"2.2\"\u003e\u003c/a\u003e\n  - [2.2](#references--disallow-var) Wenn man eine Referenz neu zuweisen muss, sollte `let` an Stelle von `var` benutzt werden. eslint: [`no-var`](https://eslint.org/docs/rules/no-var.html)\n\n    \u003e Wieso? `let` ist block-scoped und nicht function-scoped wie `var`.\n\n    ```javascript\n    // schlecht\n    var count = 1;\n    if (true){\n        count += 1;\n    }\n\n    // gut\n    let count = 1;\n    if (true){\n        count += 1;\n    }\n    ```\n\n  \u003ca name=\"references--let-require\"\u003e\u003c/a\u003e\u003ca name=\"2.3\"\u003e\u003c/a\u003e\n  - [2.3](#references--let-require) `let` für `require()` imports in NodeJS benutzen.\n\n    \u003e Wieso? Mit `const` kann man die Import-Variable später nicht neu definieren falls nötig. Außerdemn kann die Variable nicht verwendet werden, ohne sie explizit zu inizialisieren. \n\n    ```javascript\n    // schlecht\n    var x = require(\"x\");\n    const y = require(\"y\");\n    \n    // gut\n    let x = require(\"x\");\n    let y = require(\"y\");\n    ```\n    \n  \u003ca name=\"references--block-scope\"\u003e\u003c/a\u003e\u003ca name=\"2.3\"\u003e\u003c/a\u003e\n  - [2.4](#references--block-scope) Beachten, dass `let` und `const` block-scoped sind.\n\n    ```javascript\n    // const und let existieren nur in dem Block, in dem sie definiert wurden.\n    {\n        let a = 1;\n        const b = 1;\n        var c = 1;\n    }\n    console.log(a); // ReferenceError: a ist nicht definiert\n    console.log(b); // ReferenceError: b ist nicht definiert\n    console.log(c); // 1\n    ```\n\n**[⬆ zurück zum Anfang](#table-of-contents)**\n\n## Objekte\n\n  \u003ca name=\"objects--no-new\"\u003e\u003c/a\u003e\u003ca name=\"3.1\"\u003e\u003c/a\u003e\n  - [3.1](#objects--no-new) \"literal syntax\" für die Erstellung von Objekten benutzen. eslint: [`no-new-object`](https://eslint.org/docs/rules/no-new-object.html)\n\n    ```javascript\n    // schlecht\n    const item = new Object();\n\n    // gut\n    const item = {};\n    ```\n\n  \u003ca name=\"es6-computed-properties\"\u003e\u003c/a\u003e\u003ca name=\"3.4\"\u003e\u003c/a\u003e\n  - [3.2](#es6-computed-properties) Automatisch berechnete Eigenschaftsnamen verwenden, wenn Objekte mit dynamischen Eigenschaftennamen erstellt werden.\n\n    \u003e Wieso? Sie erlauben es, alle Eigenschaften eines Objekts an einer Stelle zu definieren.\n\n    ```javascript\n\n    function getKey(k){\n        return `ein key mit dem Namen ${k}`;\n    }\n\n    // schlecht\n    const obj = {\n        id: 5,\n        name: \"foo\",\n    };\n    obj[getKey(\"enabled\")] = true;\n\n    // gut\n    const obj = {\n        id: 5,\n        name: \"foo\",\n        [getKey(\"enabled\")]: true,\n    };\n    ```\n\n  \u003ca name=\"es6-object-shorthand\"\u003e\u003c/a\u003e\u003ca name=\"3.5\"\u003e\u003c/a\u003e\n  - [3.3](#es6-object-shorthand) Objekt-Methoden-Shorthands verwenden. eslint: [`object-shorthand`](https://eslint.org/docs/rules/object-shorthand.html)\n\n    ```javascript\n    // schlecht\n    const foo = {\n        value: 1,\n\n        addValue: function (value) {\n            return foo.value + value;\n        },\n    };\n\n    // gut\n    const foo = {\n        value: 1,\n\n        addValue(value) {\n            return foo.value + value;\n        },\n    };\n    ```\n\n  \u003ca name=\"es6-object-concise\"\u003e\u003c/a\u003e\u003ca name=\"3.6\"\u003e\u003c/a\u003e\n  - [3.4](#es6-object-concise) Eigenschaftsnamen-Shorthands benutzen. eslint: [`object-shorthand`](https://eslint.org/docs/rules/object-shorthand.html)\n\n    \u003e Wieso? Es ist kürzer und funktionsbeschreibend.\n\n    ```javascript\n    const foo = \"bar\";\n\n    // schlecht\n    const obj = {\n        foo: foo,\n    };\n\n    // gut\n    const obj = {\n        foo,\n    };\n    ```\n\n  \u003ca name=\"objects--grouped-shorthand\"\u003e\u003c/a\u003e\u003ca name=\"3.7\"\u003e\u003c/a\u003e\n  - [3.5](#objects--grouped-shorthand) Shorthand Eigenschaften am Anfang der Objekt Deklaration gruppieren.\n\n    \u003e Wieso? Man kann einfacher und schneller erkennen, welche Eigenschaften den Shorthand verwenden.\n\n    ```javascript\n    const foo = \"bar\";\n    const bar = \"foo\";\n\n    // schlecht\n    const obj = {\n        test: 1,\n        key: 2,\n        foo,\n        abc: 3,\n        xyz: 4,\n        bar,\n    };\n\n    // gut\n    const obj = {\n        foo,\n        bar,\n        test: 1,\n        key: 2,\n        abc: 3,\n        xyz: 4,\n    };\n    ```\n\n\u003ca name=\"objects--quoted-props\"\u003e\u003c/a\u003e\u003ca name=\"3.8\"\u003e\u003c/a\u003e\n  - [3.6](#objects--quoted-props) Nur Properties unter Anführungszeichen setzen, die invalide identifier darstellen würden. eslint: [`quote-props`](https://eslint.org/docs/rules/quote-props.html)\n\n    \u003e Warum? Im Allgemeinen ist es subjektiv einfacher zu lesen. Es verbessert die Syntaxhervorhebung und wird auch von vielen JS-Engines leichter optimiert.\n\n    ```javascript\n    // schlecht\n    const bad = {\n        \"foo\": 3,\n        \"bar\": 4,\n        \"data-foo\": 5\n    };\n\n    // gut\n    const good = {\n        foo: 3,\n        bar: 4,\n        \"data-foo\": 5\n    };\n    ```\n\n  \u003ca name=\"objects--prototype-builtins\"\u003e\u003c/a\u003e\n  - [3.7](#objects--prototype-builtins) `Object.prototype` Methoden wie `hasOwnProperty`, `propertyIsEnumerable`, und `isPrototypeOf` niemals direkt aufrufen. eslint: [`no-prototype-builtins`](https://eslint.org/docs/rules/no-prototype-builtins)\n\n    \u003e Warum? Diese Methoden könnten durch Eigenschaften des Ursprungsobjektes \"shadowed\" werden - z.B. `{ hasOwnProperty: false }` - oder, das Objekt könnte ein null-Objekt sein (`Object.create(null)`).\n\n    ```javascript\n    // schlecht\n    object.hasOwnProperty(key);\n\n    // gut\n    Object.prototype.hasOwnProperty.call(object, key);\n\n    // am besten - Stage 3 Proposal:\n    // https://github.com/tc39/proposal-accessible-object-hasownproperty\n    Object.hasOwn(object, key);\n    ```\n\n  \u003ca name=\"objects--rest-spread\"\u003e\u003c/a\u003e\n  - [3.8](#objects--rest-spread) Den Objekt \"spread\" Operator an Stelle von [`Object.assign`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) bevorzugen, um shallow-copy's von Objekten zu machen. Den Objekt \"rest\" Operator verwenden, um ein neues Objekt zu erzeugen, bei dem gewissen Eigenschaften weggelassen werden.\n\n    ```javascript\n    // sehr schlecht\n    const original = { a: 1, b: 2 };\n    const copy = Object.assign(original, { c: 3 }); // dies modifiziert `original`\n    delete copy.a; // das auch\n\n    // schlecht\n    const original = { a: 1, b: 2 };\n    const copy = Object.assign({}, original, { c: 3 }); // copy =\u003e { a: 1, b: 2, c: 3 }\n\n    // gut\n    const original = { a: 1, b: 2 };\n    const copy = { ...original, c: 3 }; // copy =\u003e { a: 1, b: 2, c: 3 }\n\n    const { a, ...noA } = copy; // noA =\u003e { b: 2, c: 3 }\n    ```\n\n**[⬆ back to top](#table-of-contents-bookmark_tabs)**\n\n## Copyright\n\n  \u003ca name=\"copyright--base\"\u003e\u003c/a\u003e\u003ca name=\"33.1\"\u003e\u003c/a\u003e\n  - [33.1](#copyright--base) Dieser Styleguide basiert auf dem [AirBnB JavaScript Styleguide](https://github.com/airbnb/javascript) \n  \n  \u003ca name=\"copyright--license\"\u003e\u003c/a\u003e\u003ca name=\"33.2\"\u003e\u003c/a\u003e\n  - [33.2](#copyright--license) Der Styleguide steht unter der selben [Lizenz](https://github.com/NullDevCo/JavaScript-Styleguide/blob/master/LICENSE). \n\n\u003cbr\u003e\u003cbr\u003e\u003cbr\u003e\n\n\u003cp align=\"center\"\u003e\n\u003ca href=\"https://github.com/NullDevCo/JavaScript-Styleguide/blob/master/LICENSE\"\u003e\n\u003cimg src=\"https://img.shields.io/badge/License-MIT-F8E301.svg?style=flat-square\"/\u003e\n\u003c/a\u003e\n\u003c/p\u003e\n\n[![NullDev JavaScript Styleguide](https://i.imgur.com/52YayNH.png)](https://nulldev.org)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnulldev%2Fjavascript-styleguide","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnulldev%2Fjavascript-styleguide","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnulldev%2Fjavascript-styleguide/lists"}