Heim  >  Artikel  >  Web-Frontend  >  JavaScript-Codierungsregeln

JavaScript-Codierungsregeln

高洛峰
高洛峰Original
2016-11-25 13:30:58938Durchsuche

Keine Regeln, keine Regeln. JavaScript bringt Flexibilität, aber auch unkontrollierte Variablen und Zugriffe, daher müssen Regeln verwendet werden, um diese einzuschränken. Ob es sich um ein ausgereiftes Team oder ein neues Team handelt, ich habe nur einige gängige oder wirksame Methoden aufgelistet, um den Sprung zu bremsen, aber der Code muss weiterhin kontrolliert werden. Natürlich basieren alle Regeln auf einer bestimmten kognitiven Basis, und die Grundlage von objektorientiertem JavaScript ist unerlässlich, sonst kann nichts diskutiert werden.

Variablen- und Methodensteuerung:
Die Modulentwicklung erlaubt nicht die Speicherung unabhängiger globaler Variablen und globaler Methoden. Nur Variablen und Methoden dürfen im „Namespace“ des entsprechenden Moduls platziert werden Eine Erklärung hierzu finden Sie in diesem Artikel. Es ist wirklich nervig. Wie wäre es also mit der Verwendung anonymer Funktionen?
Java-Code
(function() {
var value = 'xxx';
var func = function() {...};
})(); 🎜>Modularisierung erfordert eine strikte Kontrolle der Codekultur. Dies ist nicht nur ein Aspekt der Wartbarkeit und Anpassbarkeit des Codes, sondern ermöglicht der JavaScript-Engine auch, Eigenschaften und Methoden nach der Verwendung zeitnah wiederzuverwenden.
Das Verschmutzen nativer Objekte im Modulcode ist nicht zulässig, z. B.
Js-Code
String.prototype.func = new function(){...};

Solcher Code muss kontrolliert werden zentral zum Beispiel einheitlich in common.js platziert und streng geschützt.

Einschränkungen bei der Datenspeicherung:
Dividieren und Erobern von gewöhnlichen Variablen, Prototypvariablen und Funktionsvariablen müssen alle mit Großbuchstaben beginnen:
Java-Code
function T(name){
T.prototype._instance_number++;
this.name = name;
this.showName=function(){
warning(this.name);
};
T.prototype = {
_instance_number:0,
getInstanceNum: function(){
return T.prototype._instance_number; >
var t = new T("PortalONE");
new T("Again"); : 2

Eines wird hier absichtlich gemacht. Die Eigenschaften und privaten Methoden in T beginnen mit einem Unterstrich, der die Kapselung gut implementiert (wenn t.instanceNum im obigen Code verwendet wird, kann auf diesen Wert nicht zugegriffen werden). Wenn Sie den Code nicht verstehen, sollten Sie schnell die objektorientierte Natur von JavaScript auffrischen :). JavaScript bietet Abschlüsse und Prototypen zur Implementierung von Vererbung und Polymorphismus. Ich werde dies in den folgenden Kapiteln diskutieren. Darüber hinaus werden die nativen Objekte und Container von JavaScript wie Array und Ajax-Datentypen vereinheitlicht Versuchen Sie bei JSON, keine versteckten Felder zu verwenden. Außerdem ist es normalerweise nicht erlaubt, DOM-Objekte nach Belieben zu erweitern.
Was die Kommunikation zwischen Modulen betrifft: Kommunikation zwischen Modulen bedeutet eine Kopplung zwischen Modulen, die strikt vermieden werden muss. Kommunikationsmethoden verwenden normalerweise Attribute auf Methodenebene oder Prototypvariablen auf Modulebene.

DOM-Manipulationsregeln:
Im Modulcode ist es normalerweise erforderlich, die Manipulation von DOM in Modul-JS zu unterteilen. Sie sollten es vermeiden, explizit zeitgesteuerte Funktionen auf dem DOM-Modell zu schreiben, wie zum Beispiel:
< ;div onclick="xxx" />
Mithilfe der auf bind basierenden Methodenreihe von JQuery können Sie nach der Trennung der Verhaltenslogik die erfrischenden HTML-Tags vollständig sehen.
Der Zugriff auf DOM-Objekte erfolgt normalerweise über die ID und gelegentlich über den Namen. Das zu häufige und unangemessene Durchlaufen des DOM-Baums ist ein Tabu für die Aufrechterhaltung der Front-End-Leistung.

CSS-Stilsteuerung:
(1) Versuchen Sie, style="xxx" abzulehnen. Der Hauptzweck besteht darin, den Stil im Theme-Stylesheet zu vereinheitlichen Modul zur Anpassung verschiedener Sprachen und zum Wechseln zwischen verschiedenen Stilen.
(2) Standardisieren Sie die Stilmanipulation durch JavaScript. Im Idealfall kann eine gut gekapselte Benutzeroberfläche ihre Stilsammlung frei ersetzen.

Das oben Genannte kann nur als die Spitze des Eisbergs angesehen werden. In tatsächlichen Projekten muss es während des Entwicklungsprozesses schrittweise verfeinert und verbessert werden.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:js allgemeine FormatierungNächster Artikel:js allgemeine Formatierung