Meine Best Practices für Java- & Webentwicklung

• Die Paradigmen
• Meine Best Practices – Allgemein
• Meine Best Practices – Java
• Meine Best Practices – JavaScript
• Meine Best Practices – CSS
• Best Practices aus "Effective Java (3rd Edition)"

Meine Best Practices – JavaScript

1. Cache deaktivieren

Firefox:
Developer Tools öffnen -> Einstellungen öffnen (F1) -> "HTTP-Cache bei offenem Werkzeugkasten deaktieren"

Chrome:
Developer Tools öffnen -> Einstellungen öffnen (F1) -> "Disable cache (while DevTools is open)"

2. JS-Konsole offen halten

In den Dev Tools den Konsole-Tab öffnen und offen halten, damit Schritt 1. wirksam bleibt und man außerdem Fehler im Netzwerk und JS mitbekommt.

Empfehlenswert ist auch dieses Plugin, welches JS-Fehler noch besser darstellt, wenn man selbst mal drauf vergisst:

2. JavaScript: Pflichtlektüre “You Don't Know JS”

• You Don't Know JS (1st Edition)
• Erklärt, warum this zu vermeiden ist
• Erklärt, warum in JS manchmal scheinbar komische Dinge passieren (Stichwort Lexical Scope, Closures)

3. Das Semikolon

• Immer machen
• Es ist nicht Pflicht, aber kann z. B. helfen, diese Fallgrube zu umgehen: Stack Overflow
• JavaScript setzt automatisch ein Semikolon:

// you want to return 5 and have ugly formatting:
return
5

// JavaScript Interpretation:
return;
5;

4. Logische Operatoren && und ||

• In Java werden a && b und a || b laut Boolescher Algebra evaluiert. a und b müssen Booleans sein.
• In JavaScript:
  • Bei a && b wird b returned, wenn a true ist
  • Bei a || b wird b returned, wenn a false ist

Auch Expressions können so gebunden werden und ermöglichen das kürzeste if-Statement überhaupt – Syntax Sugar:

• isAdmin && showDeleteButton();
• (Genau genommen ist das kein Statement mehr)

Gerne wird das auch für Default Values verwendet:

• let sendNewsletter = form.getNewsletterOptIn() || false;

5. Ist JavaScript pass-by-reference oder pass-by-value?

It's interesting in JavaScript. Beispiel:

function changeStuff(a, b, c) {
    a = a * 10;
    b.item = "changed";
    c = {item: "changed"};
}

var num = 10;
var obj1 = {item: "unchanged"};
var obj2 = {item: "unchanged"};

changeStuff(num, obj1, obj2);

console.log(num);
console.log(obj1.item);
console.log(obj2.item);

Produziert folgenden Output:

10
changed
unchanged

Wenn obj1 überhaupt keine Referenz wäre, dann hätte eine Änderung von obj1.item keinerlei Auswirkungen auf das obj1 außerhalb der Funktion.

Wäre das Argument eine echte Referenz, dann würde sich alles ändern: num wäre 100, und obj2.item würde „changed“ enthalten. Stattdessen bleibt num bei 10 und obj2.item bleibt „unchanged“.

Tatsächlich wird das übergebene Element per Wert übergeben. Allerdings ist das, was per Wert übergeben wird, selbst eine Referenz. Technisch wird dies als call-by-sharing bezeichnet.

In der Praxis bedeutet das: Wenn du den Parameter selbst änderst (wie bei num und obj2), hat das keine Auswirkungen auf das ursprüngliche Objekt, das in die Funktion übergeben wurde. Ändert man jedoch die internen Werte des Parameters, dann werden diese Änderungen übernommen (wie bei obj1).