Beste praksis innen JavaScript-programmering

Denne artikkelen forklarer beste praksis innen JavaScript-programmering.

Vi vil introdusere viktige beste praksiser i JavaScript sammen med konkrete kodeeksempler.

YouTube Video

Beste praksis innen JavaScript-programmering

I programmering er det viktig ikke bare å skrive "kode som fungerer", men å skrive kode som er vedlikeholdbar, effektiv og pålitelig. Ved å følge "beste praksis" blir koden din enklere for andre utviklere å forstå, enklere å vedlikeholde og utvide, og fører til slutt til færre feil og bedre ytelse.

Med kodeeksempler ser vi på de viktigste beste praksisene i JavaScript.

Bruk klare og beskrivende navn på variabler og funksjoner

Gjør det mulig å forstå hva en variabel eller funksjon betyr bare ved å lese koden. Foretrekk beskrivende navn fremfor forkortede navn eller forkortelser.

Dårlig eksempel

1/* Bad Example */
2let x = 10;
3function fn() {
4    // ...
5}

• Navn som x eller fn tilslører hensikten med koden.

Godt eksempel

1/* Good Example */
2let totalItems = 10;
3function calculateDiscount(price) {
4    // ...
5}

• Å bruke meningsfulle navn som totalItems eller calculateDiscount hjelper leseren å forstå koden.

Bruk const / let og unngå var

Siden var er utsatt for problemer med omfang og redeklarering, anbefales det å alltid bruke const eller let.

Dårlig eksempel

1/* Bad Example */
2var count = 5;

• var har funksjonsomfang og kan føre til utilsiktede redeklareringer og hoisting.

Godt eksempel

1/* Good Example */
2let count = 5; // Reassignable
3const MAX_COUNT = 10; // Not reassignable

• let og const har blokkomfang og er tryggere å bruke, noe som gir mer forutsigbar og stabil kode.

Bruk passende kommentarer

{^ i18n_speak 単にコードの動作をそのまま繰り返すコメントではなく、コードの「目的」や「理由」を説明するためにコメントを使います。^}

Dårlig eksempel

1/* Bad Example */
2let a = 100; // assign 100 to a

Godt eksempel

1/* Good Example */
2// Initialize the maximum value to 100
3let maxItems = 100;

• Foretrekk kommentarer som forklarer hvorfor noe gjøres, fremfor hva som gjøres. Dette er spesielt nyttig der logikken er kompleks.

Følg DRY-prinsippet (Don't Repeat Yourself)

I stedet for å gjenta den samme logikken, trekk den ut i funksjoner eller klasser. Å redusere duplisering forbedrer vedlikeholdbarheten og bidrar til å forhindre feil.

Dårlig eksempel

1/* Bad Example */
2let totalPrice = price * quantity;
3let discountedPrice = (price * 0.9) * quantity;

Godt eksempel

1/* Good Example */
2function calculatePrice(price, quantity, discount = 0) {
3    return (price * (1 - discount)) * quantity;
4}
5
6let totalPrice = calculatePrice(price, quantity);
7let discountedPrice = calculatePrice(price, quantity, 0.1);

• Ved å samle duplisert logikk i en funksjon kan endringer og feilrettinger gjøres ett sted. Dette er spesielt viktig i utvikling i stor skala.

Gi funksjoner ett ansvar og minimer sideeffekter

Hver funksjon bør ha ett tydelig formål. Unngå å endre globale variabler eller ekstern tilstand for å holde sideeffekter på et minimum.

Dårlig eksempel

1/* Bad Example */
2let total = 0;
3function addItem(price) {
4    total += price; // modifies external state
5    console.log('Item added');
6}

Godt eksempel

1/* Good Example */
2function calculateTotal(items) {
3    return items.reduce((sum, item) => sum + item.price, 0);
4}

• Å designe funksjoner som er rene—som returnerer samme resultat for samme input—gjør dem enklere å teste og mer pålitelige. Det forbedrer også gjenbrukbarhet og gjør feilsøking enklere.

Utfør feilhåndtering

Sørg for at appen ikke krasjer ved uventet input eller unntak. Bruk try...catch-syntaksen for å håndtere feil på en passende måte.

Dårlig eksempel

1/* Bad Example */
2let data = JSON.parse(inputData);

Godt eksempel

1/* Good Example */
2try {
3    let data = JSON.parse(inputData);
4} catch (error) {
5    console.error('Failed to parse JSON:', error);
6}

• Siden JSON.parse() kan kaste unntak, håndter det trygt med try-catch. Grundig feilhåndtering hjelper deg å bygge robuste applikasjoner.

Produser strukturerte logger

Skriv logger i et konsistent format for å gjøre systemets oppførsel lettere å spore. Å bruke JSON-formaterte logger gjør dem enklere å jobbe med i analyse- og overvåkingsverktøy.

Dårlig eksempel

1/* Bad Example */
2console.log('Error occurred!');

Godt eksempel

1/* Good Example */
2console.log(JSON.stringify({
3    level: 'error',
4    message: 'Database connection failed',
5    timestamp: new Date().toISOString()
6}));

• Enkle strenglogger kan miste informasjon; strukturerte logger gjør loganalyse, visualisering og overvåking enklere. Dette er spesielt effektivt i JavaScript på serversiden (Node.js).

Forbedre lesbarheten til koden

Kode leses av andre (eller ditt fremtidige jeg). Bruk riktig innrykk, linjeskift og mellomrom for å gjøre koden lett å lese.

Dårlig eksempel

1/* Bad Example */
2if(a===b){doSomething();}

Godt eksempel

1/* Good Example */
2if (a === b) {
3    doSomething();
4}

• Godt formatert, lesbar kode er raskere å forstå og gjør det enklere å oppdage feil. Ikke press alt inn på én linje; gjør strukturen visuelt tydelig.

Tenk alltid på sikkerhet

Siden JavaScript ofte kjører i webmiljøer, er sikkerhetsbevissthet avgjørende. Valider alltid brukerinput, beskytt mot XSS og CSRF, og hold avhengigheter oppdatert.

Dårlig eksempel

1/* Bad Example */
2// Directly inserting user input into HTML (vulnerable to XSS)
3element.innerHTML = userInput;

Godt eksempel

1/* Good Example */
2// Use textContent to prevent XSS attacks
3element.textContent = userInput;

• Å håndtere brukerinput som den er kan introdusere sårbarheter som skriptinjeksjon. Bruk sikre API-er og gjør det til en vane å alltid validere og sanere data.

Utføre kode-testing

Å innføre automatiserte tester gjør det enklere å oppdage og forhindre feil. I JavaScript brukes ofte testrammeverk som Jest og Mocha.

Eksempel

1// Simple test using Jest
2function sum(a, b) {
3    return a + b;
4}
5
6test('adds 1 + 2 to equal 3', () => {
7    expect(sum(1, 2)).toBe(3);
8});

• Å ha tester sikrer at feil ikke dukker opp igjen når du legger til funksjoner eller gjør endringer. Tester er uunnværlige for kontinuerlig kvalitetssikring.

Konklusjon

Å følge beste praksis kan i stor grad forbedre kodekvalitet, vedlikeholdbarhet og pålitelighet. Når du lærer JavaScript, er det viktig å bygge vaner ikke bare rundt syntaks, men også "hvordan skrive god kode.". Ved å lære kontinuerlig kan du gjøre koden din mer lesbar, sikker og effektiv.

Du kan følge med på artikkelen ovenfor ved å bruke Visual Studio Code på vår YouTube-kanal. Vennligst sjekk ut YouTube-kanalen.

YouTube Video