Neueste Web-Entwicklung Tutorials
 

JavaScript Style Guide und Kodierungskonventionen

❮ Zurück Weiter Kapitel ❯

Verwenden Sie immer die gleiche Codierung Konventionen für alle JavaScript-Projekte.

JavaScript Coding Conventions

Coding - Konventionen sind Stil - Richtlinien für die Programmierung. Sie in der Regel umfassen:

  • Naming und Deklarationsvorschriften für Variablen und Funktionen.
  • Regeln für den Einsatz von Weißraum, Einzug und Kommentare.
  • Programmierung Praktiken und Prinzipien

Coding - Konventionen sichere Qualität:

  • Verbessert die Lesbarkeit des Codes
  • Machen Code Wartung einfacher

Coding-Konventionen können Regeln dokumentiert werden für die Teams zu folgen, oder einfach nur die individuelle Codierung der Praxis sein.

Diese Seite beschreibt die allgemeinen Konventionen JavaScript-Code von w3ii verwendet.
Sie sollten auch das nächste Kapitel "Best Practices", lesen und lernen, wie Codierung Fehler zu vermeiden.

Variablennamen

Bei w3ii verwenden wir camelcase für Bezeichnernamen (Variablen und Funktionen).

Alle Namen mit einem Buchstaben beginnen.

Am unteren Ende dieser Seite finden Sie eine breitere Diskussion über Benennungsregeln finden.

firstName = "John";
lastName = "Doe";

price = 19.90;
tax = 0.20;

fullPrice = price + (price * tax);

Räume um Operatoren

Setzen Sie immer Räume um Operatoren ( = + - * / ) , und nach dem Komma:

Beispiele:

var x = y + z;
var values = ["Volvo", "Saab", "Fiat"];

Code Einrückungen

Verwenden Sie immer 4 Leerzeichen für die Einrückung von Code-Blöcke:

Funktionen:

function toCelsius(fahrenheit) {
    return (5 / 9) * (fahrenheit - 32);
}

Verwenden Sie keine Tabs (Tabulatoren) für Einzug. Verschiedene Editoren interpretieren Registerkarten anders.

Statement Regeln

Allgemeine Regeln für die einfache Aussagen:

  • Immer eine einfache Anweisung mit einem Semikolon enden.

Beispiele:

var values = ["Volvo", "Saab", "Fiat"];

var person = {
    firstName: "John",
    lastName: "Doe",
    age: 50,
    eyeColor: "blue"
};

Allgemeine Regeln für komplexe (Verbindung) Angaben:

  • Setzen Sie die öffnende Klammer am Ende der ersten Zeile.
  • Verwenden Sie ein Leerzeichen vor der öffnenden Klammer.
  • Setzen Sie den Schließbügel auf einer neuen Zeile, ohne führende Leerzeichen.
  • Verwenden Sie keine komplexe Anweisung mit einem Semikolon enden.

Funktionen:

function toCelsius(fahrenheit) {
    return (5 / 9) * (fahrenheit - 32);
}

Loops:

for (i = 0; i < 5; i++) {
    x += i;
}

conditionals:

if (time < 20) {
    greeting = "Good day";
} else {
    greeting = "Good evening";
}

Object Rules

Allgemeine Regeln für die Objektdefinitionen:

  • Legen Sie die öffnende Klammer auf der gleichen Linie wie den Objektnamen.
  • Verwenden Sie Doppelpunkt und ein Leerzeichen zwischen den einzelnen Eigenschaften und ihre Werte.
  • Verwenden Sie Anführungszeichen, um String-Werte, nicht um numerische Werte.
  • Kein Komma nach dem letzten Objekt-Wert-Paar hinzu.
  • Platzieren Sie den Schließbügel auf einer neuen Zeile, ohne führende Leerzeichen.
  • Immer eine Objektdefinition mit einem Semikolon enden.

Beispiel

var person = {
    firstName: "John",
    lastName: "Doe",
    age: 50,
    eyeColor: "blue"
};

Kurze Objekte komprimiert werden kann, geschrieben auf einer Linie, die Verwendung von Leerzeichen nur zwischen den Eigenschaften, wie folgt aus:

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

Zeilenlänge <80

Zur besseren Lesbarkeit vermeiden Linien länger als 80 Zeichen.

Wenn eine JavaScript-Anweisung nicht in eine Zeile passt, der beste Ort, um sie zu brechen, ist nach einem Operator oder ein Komma.

Beispiel

document.getElementById("demo").innerHTML =
    "Hello Dolly.";
Versuch es selber "

Regeln der Namensgebung

Verwenden Sie immer die gleiche Namenskonvention für den gesamten Code. Beispielsweise:

  • Variable und Funktionsnamen als Camelcase geschrieben
  • Globale Variablen geschrieben in GROSSBUCHSTABEN (Wir wissen nicht, aber es ist durchaus üblich)
  • Konstanten (wie PI) geschrieben in GROSSBUCHSTABEN

Sollten Sie hyp-Hühner, Camelcase oder under_scores in Variablennamen verwenden?

Dies ist eine Frage Programmierer oft diskutieren. Die Antwort hängt davon ab, wen Sie fragen:

Bindestriche in HTML und CSS:

HTML5-Attribute können mit Datenübertragung (Datenmenge, Daten-Preis) starten.

CSS verwendet Bindestriche in Immobilien-Namen (font-size).

Bindestriche kann als Subtraktion Versuche verwechselt werden. Bindestriche sind nicht in JavaScript Namen erlaubt.

unterstreicht:

Viele Programmierer bevorzugen Unterstrichen verwenden (DATE_OF_BIRTH), insbesondere in SQL-Datenbanken.

Unterstrichen werden häufig in PHP-Dokumentation verwendet.

Pascal:

Pascal wird oft von C-Programmierer bevorzugt.

Camelcase:

Camelcase wird von JavaScript selbst, von jQuery und anderen JavaScript-Bibliotheken verwendet.

Beginnen Sie nicht Namen mit einem $ -Zeichen. Es wird Sie in Konflikt mit vielen JavaScript-Bibliothek Namen setzen.

Laden Sie JavaScript in HTML

Verwenden Sie einfache Syntax für das Laden externer Skripte (das type-Attribut ist nicht erforderlich):

<script src="myscript.js">

Der Zugriff auf HTML-Elemente

Eine Folge von "unordentlichen" HTML-Stile verwenden, kann in JavaScript-Fehlern führen.

Diese beiden JavaScript-Anweisungen werden zu unterschiedlichen Ergebnissen führen:

var obj = getElementById("Demo")

var obj = getElementById("demo")

Wenn möglich, verwenden Sie die gleiche Namenskonvention (wie JavaScript) in HTML.

Besuchen Sie den HTML - Style Guide .

Dateierweiterungen

HTML - Dateien sollten eine Erweiterung .html (nicht .htm).

CSS - Dateien sollten eine CSS - Erweiterung haben.

JavaScript - Dateien sollten eine Js - Erweiterung haben.

Verwenden Lower Case File Names

Die meisten Webserver (Apache, Unix) Groß- und Kleinschreibung zu den Dateinamen:

london.jpg kann nicht als zugegriffen werden London.jpg .

Andere Web-Server (Microsoft, IIS) sind nicht case sensitive:

london.jpg kann zugegriffen werden London.jpg oder london.jpg .

Wenn Sie eine Mischung aus Groß- und Kleinbuchstaben verwenden, müssen Sie extrem konsistent sein.

Wenn Sie von einem Groß- und Kleinschreibung, auf einen Fall sensible Server zu verschieben, selbst kleine Fehler können Sie Ihre Website zu brechen.

Um diese Probleme zu vermeiden, verwenden Sie immer Kleinbuchstaben Dateinamen (wenn möglich).

Performance

Coding Konventionen werden nicht von Computern verwendet. Die meisten Regeln haben wenig Einfluss auf die Ausführung von Programmen.

Einrückungen und zusätzliche Leerzeichen sind in kleinen Skripten nicht signifikant.

Für Code in Entwicklung sollte Lesbarkeit bevorzugt werden. Größere Produktions Skripte sollte minimierte.


❮ Zurück Weiter Kapitel ❯