JavaScript-stylgids
Gebruik altyd dieselfde koderingskonvensies vir al jou JavaScript-projekte.
JavaScript Kodering Konvensies
Koderkonvensies is stylriglyne vir programmering . Hulle dek gewoonlik:
- Benoemings- en verklaringreëls vir veranderlikes en funksies.
- Reëls vir die gebruik van wit spasie, inkeping en opmerkings.
- Programmeringspraktyke en -beginsels
Koderkonvensies verseker kwaliteit :
- Verbeter kode leesbaarheid
- Maak kode-onderhoud makliker
Koderkonvensies kan gedokumenteerde reëls wees wat spanne moet volg, of net jou individuele koderingpraktyk wees.
Hierdie bladsy beskryf die algemene JavaScript-kode-konvensies wat deur W3Schools gebruik word.
Jy moet ook die volgende hoofstuk "Beste praktyke" lees en leer hoe om koderingsslaggate te vermy.
Veranderlike name
By W3schools gebruik ons camelCase vir identifiseerdername (veranderlikes en funksies).
Alle name begin met 'n letter .
Onderaan hierdie bladsy vind u 'n wyer bespreking oor naamreëls.
firstName = "John";
lastName = "Doe";
price = 19.90;
tax = 0.20;
fullPrice = price + (price * tax);
Ruimtes rondom operateurs
Plaas altyd spasies om operateurs ( = + - * / ), en na kommas:
Voorbeelde:
let x = y + z;
const myArray = ["Volvo", "Saab",
"Fiat"];
Kode inkeping
Gebruik altyd 2 spasies vir inkeping van kodeblokke:
Funksies:
function toCelsius(fahrenheit) {
return (5 / 9) * (fahrenheit - 32);
}
Moenie oortjies (tabulators) vir inkeping gebruik nie. Verskillende redigeerders interpreteer oortjies verskillend.
Verklaring Reëls
Algemene reëls vir eenvoudige stellings:
- Eindig altyd 'n eenvoudige stelling met 'n kommapunt.
Voorbeelde:
const cars = ["Volvo", "Saab",
"Fiat"];
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor:
"blue"
};
Algemene reëls vir komplekse (saamgestelde) stellings:
- Plaas die openingsbeugel aan die einde van die eerste reël.
- Gebruik een spasie voor die openingsbeugel.
- Plaas die sluitingsbeugel op 'n nuwe lyn, sonder voorste spasies.
- Moenie 'n komplekse stelling met 'n kommapunt beëindig nie.
Funksies:
function toCelsius(fahrenheit) {
return (5 / 9) * (fahrenheit - 32);
}
Lusse:
for (let i = 0; i < 5; i++) {
x += i;
}
Voorwaardes:
if (time < 20) {
greeting = "Good day";
} else {
greeting = "Good evening";
}
Voorwerpreëls
Algemene reëls vir objekdefinisies:
- Plaas die openingshakie op dieselfde lyn as die voorwerpnaam.
- Gebruik dubbelpunt plus een spasie tussen elke eiendom en sy waarde.
- Gebruik aanhalings om stringwaardes, nie om numeriese waardes nie.
- Moenie 'n komma na die laaste eiendom-waarde-paar byvoeg nie.
- Plaas die sluitingsbeugel op 'n nuwe lyn, sonder voorste spasies.
- Eindig altyd 'n voorwerpdefinisie met 'n kommapunt.
Voorbeeld
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor:
"blue"
};
Kort voorwerpe kan saamgepers, op een lyn geskryf word, deur slegs spasies tussen eienskappe te gebruik, soos volg:
const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
Lynlengte < 80
Vir leesbaarheid, vermy reëls langer as 80 karakters.
As 'n JavaScript-stelling nie op een reël pas nie, is die beste plek om dit te breek na 'n operateur of 'n komma.
Voorbeeld
document.getElementById("demo").innerHTML =
"Hello Dolly.";
Naamkonvensies
Gebruik altyd dieselfde naamkonvensie vir al jou kode. Byvoorbeeld:
- Veranderlike en funksie name geskryf as camelCase
- Globale veranderlikes geskryf in HOOFLETTERS (Ons doen dit nie, maar dit is redelik algemeen)
- Konstante (soos PI) geskryf in HOOFLETTERS
Moet jy hip-hens , camelCase , of under_scores in veranderlike name gebruik?
Dit is 'n vraag wat programmeerders dikwels bespreek. Die antwoord hang af van wie jy vra:
Koppeltekens in HTML en CSS:
HTML5-kenmerke kan begin met data- (data-hoeveelheid, data-prys).
CSS gebruik koppeltekens in eiendomsname (font-grootte).
Koppeltekens kan as aftrekpogings verwar word. Koppeltekens word nie in JavaScript-name toegelaat nie.
Onderstrepe:
Baie programmeerders verkies om onderstrepe (geboortedatum) te gebruik, veral in SQL-databasisse.
Onderstrepe word dikwels in PHP-dokumentasie gebruik.
PascalCase:
PascalCase word dikwels deur C-programmeerders verkies.
kameelkas:
camelCase word deur JavaScript self, deur jQuery en ander JavaScript-biblioteke gebruik.
Moenie name met 'n $-teken begin nie. Dit sal jou in konflik plaas met baie JavaScript-biblioteekname.
Laai JavaScript in HTML
Gebruik eenvoudige sintaksis om eksterne skrifte te laai (die tipe kenmerk is nie nodig nie):
<script src="myscript.js"></script>
Toegang tot HTML-elemente
'n Gevolg van die gebruik van "slordige" HTML-style kan tot JavaScript-foute lei.
Hierdie twee JavaScript-stellings sal verskillende resultate lewer:
const obj = getElementById("Demo")
const obj = getElementById("demo")
Indien moontlik, gebruik dieselfde naamkonvensie (as JavaScript) in HTML.
Lêeruitbreidings
HTML-lêers moet 'n .html- uitbreiding hê ( .htm word toegelaat).
CSS-lêers moet 'n .css- uitbreiding hê.
JavaScript-lêers moet 'n .js- uitbreiding hê.
Gebruik kleinletter lêername
Die meeste webbedieners (Apache, Unix) is hooflettersensitief oor lêername:
london.jpg kan nie as London.jpg verkry word nie.
Ander webbedieners (Microsoft, IIS) is nie hooflettersensitief nie:
london.jpg kan verkry word as London.jpg of london.jpg.
As jy 'n mengsel van hoofletters en kleinletters gebruik, moet jy uiters konsekwent wees.
As jy van 'n kas-onsensitiewe bediener na 'n kas-sensitiewe bediener beweeg, kan selfs klein foute jou webwerf breek.
Om hierdie probleme te vermy, gebruik altyd kleinletter lêername (indien moontlik).
Optrede
Koderkonvensies word nie deur rekenaars gebruik nie. Die meeste reëls het min impak op die uitvoering van programme.
Inkeping en ekstra spasies is nie betekenisvol in klein skrifte nie.
Vir kode in ontwikkeling moet leesbaarheid voorkeur geniet. Groter produksieskrifte moet verklein word.