Hva er en linter? Kort sagt, en linter er et verktøy for å hjelpe deg å forbedre din kode. Begrepet linter er ikke eksklusivt for JavaScript. Likevel vil jeg si at de fleste mennesker som prøver å lære om linters er interessert i de som mål JavaScript (eller, mer generelt, dynamisk-skrevet språk.)

I dagens innlegg, vi vil svare tittelen på spørsmålet, og mer. Vi starter med å definere begrepet «linter.,»Du vil forstå hva denne tingen er, og hvordan det kom til å bli. Så, vi snakker om fordelene av linters og gå videre til å snakke om de forskjellige typer sjekker de tilbyr.

til Slutt, kan vi vise deg flere eksempler på linters til din disposisjon, gi noen praktiske tips om hvordan å komme i gang, og wrap-up med noen avsluttende betraktninger.

La oss komme i gang.

Hva Er en Linter? En Kort Oversikt

La oss starte med å definere hva en linter er. Som du har lest i innledningen, en linter er et verktøy for å hjelpe deg å forbedre din kode. Men hvordan gjør den det?, Svaret er: ved å analysere kildekoden leter etter problemer.

begrepet linter kommer fra et verktøy som opprinnelig ble kalt «lo» at analysert C kildekoden. Datamaskinen forsker Stephen C. Johnson utviklet dette verktøyet i 1978 da han jobbet ved Bell Labs.

Både den opprinnelige lo-verktøy, så vel som tidligere lignende verktøy, hadde som mål å analysere kildekoden for å komme opp med kompilatoren optimaliseringer. Over tid, lo-som verktøy i gang med å legge til mange andre typer kontroll og verifisering.,

Imidlertid, som vi har nevnt i innledningen, linters er ikke begrenset til kompilert språk. Tvert imot: vi kan si at linters er langt mer verdifullt for tolket språk siden det er ingen kompilatoren til å oppdage feil under utviklingen.

Fordeler av Linting

Du har nettopp lært definisjonen av linter. Du nå også vite når denne type verktøy ble oppfunnet, og av hvem. Du har sannsynligvis nå minst en generell ide om hva en linter kan gjøre for din kode., Men i mer praktisk, hva er fordelene at denne type verktøy kan gi? Her er noen av dem:

  • Færre feil i produksjonen
  • Lesbar, stabile og mer konsekvent kode
  • Færre diskusjoner om koden stil og estetiske valgene under kode anmeldelser
  • Objektiv måling av koden kvalitet
  • Mer sikkert og effektivt kode

Den neste delen dekker noen av de typer kontroller at linters gi. Etter å ha lest den, vil du forstå hvordan linters gi fordeler ovenfor.,

Typer Sjekker Linters Gi

Som du nettopp har lest, den opprinnelige lo verktøyet analysert kode for å aktivere optimaliseringer for samlerne, men over tid, mer avansert og komplett verktøy ble utgitt. I dag har vi et utall forskjellige linters, som gir mange typer kontroller. La oss raskt gå gjennom noen av dem.

syntaksfeil

Den mest grunnleggende og mer viktig type av sjekker som en linter kan gi er syntaksfeil verifikasjoner når det kommer til JavaScript og andre tolket språk., Utviklere bør ikke selv push-koden til mainline uten at det passerer syntaks verifikasjoner.

En måte å oppnå dette på er å bruke pre-commit-kroker som hindrer brukere fra å skyve sine koden når linter bekreftelse indikerer at det er problemer med koden.

– Koden Standarder for Overholdelse

en Annen viktig type kontroller at linters gi er overholdelse av standarder for koding. Noen mennesker kan avfeie dette som et rent estetisk problem, men de ville være galt., Å ha en enkelt konsistent koding stil er gunstig for å redusere den kognitive belastningen av å lese, forstå og vedlikeholde kode. En codebase som har en konsistent kode stil vil være enklere å forstå, og utviklere som bruker vil det være mindre sannsynlighet for å introdusere feil.

Det er grunnen til at det er linters som spesialiserer seg i å verifisere codebases for tilslutning til koden stiler. Noen verktøy er sta, det vil si at de kommer med en pre-definert sett av regler og konvensjoner som ikke kan endres., På den annen side, det finnes verktøy som kan være svært konfigurerbart, tillater brukeren å tilpasse verktøyet til deres foretrukne koding stiler.

Potensielle Problemer (en.k.a. Koden Lukter)

– Koden lukter, er tegn på at noe kan være galt med din kode. Det er utrolig nyttig å ha et verktøy for å oppdage disse tegnene automatisk, slik at du kan undersøke dem videre, hvis det er nødvendig.

For eksempel, mange mennesker, inkludert meg—tenk lang funksjoner for å være en kode lukt. Så, du kan konfigurere din linter å oppdage funksjoner som er lengre enn en angitt antall linjer.,

en Annen ofte sitert kode lukten er kode som er for komplekse. Men vi snakker ikke om kompleksiteten i en subjektiv måte, men en veldig objektiv ett. Cyclomatic kompleksitet er en nyttig koden beregningen, som er antall mulige gjennomføring stier inne i en funksjon. Linters kan beregne cyclomatic kompleksiteten av funksjoner og flagge dem som er høyere enn en viss grense.

Sikkerhet Sjekker

Sist, men ikke minst, vi har sikkerhet, som er, uten tvil, den mest avgjørende fasett av et moderne program, spesielt en web-app., Få det galt, og konsekvensene kan være katastrofale, ikke bare i forhold til penger og omdømme, men også juridiske (tror GDPR og samme reglene.)

Heldigvis, dette er et annet område hvor linters kan være til hjelp siden det er verktøy som gir viktig sikkerhet verifikasjoner.

Forstå Statisk Analyse

Vi har forklart hva linters er og hvorfor de er nyttige. Også, vi har dekket de viktigste typer linters. Du er nå klar til å lære mer om noen eksempler på linting verktøy for en rekke bruksområder og mål programmeringsspråk.,

Før vi får det, men la oss ta en kort digresjon til å snakke om statisk analyse, siden dette begrepet vises i den neste delen, og vi har ikke definert det ennå.

Så, hva er statisk analyse? Du kan tenke av statisk analyse som en pre-kjør debug. Statisk analyse består av å bruke verktøy som analyserer din kildekoden på jakt etter feil, mangel på overholdelse av regler eller konvensjoner, eller andre potensielle problemer.

Den neste delen viser eksempler på linters kategorisert i henhold til type verifisering de utfører., Oppføringer kategorisert under statisk analyse se det meste til den første og tredje typer linters nevnt i avsnittet over.

Eksempler på Linters

La oss nå kort nevne noen eksempler på linters. Vi vil vise eksempler for ulike programmeringsspråk, kategorisert etter type kontrollere de gir. Husk at noen verktøy som kan tilby mer enn én form for kontroll, så det er grunnen til at noen verktøy som finnes i mer enn én kategori.,>

  • StandardJS for JavaScript
  • PHPMD for PHP
  • StyleCop for C#
  • Linters for Sikkerhet

    • Gosec for å Gå
    • Bandit for Python
    • LGTM for flere språk, inkludert JavaScript, Python, og C#

    Linters for Koding Konvensjoner / Koding Formatering

    • Penere for JavaScript
    • Rubocop for Ruby
    • StyleCop for C#

    Linters i JavaScript: Hvordan Komme i Gang

    Før vi pakker opp artikkelen, vi ønsker å gi deg en kort, men praktisk guide på hvordan å komme i gang med linting i JavaScript., Siden det er JavaScript-vi snakker om, det er ingen overraskelse at det er mange verktøy for deg å velge fra. Siden vi har å velge en, vi kommer med ESLint.

    Installere ESLint

    Første ting først: la oss installere linter. ESLint er installert via npm, som betyr at du må ha Node.js installert. Hvis du ikke allerede har gjort det, laste det ned og installere det, så vi kan fortsette.

    Med Node.js installert, vi er klar til å installere ESLint via npm., the following command:

    1
    npm install eslint –global

    However, this isn’t the approach recommended in their documentation., I stedet må du sannsynligvis installere ESLint på en per prosjekt basis.,ory for your project:

    1
    mkdir eslint-sample-app

    Then, cd into the directory and run the command below to create a package.,json-fil (det vil være behov nedover veien.)

    1
    npm init

    Npm vil stille deg flere spørsmål., Bare trykk på enter for å bruke standard svar for dem alle.,gjorde, ved å kjøre:

    1
    npx eslint –init

    Når du kjører kommandoen ovenfor, ESLint vil spørre deg om hva du ikke ønsker å bruke det til., Alternativene er: for å sjekke syntaksen bare å sjekke syntaksen og finne problemer, og for å sjekke syntaksen, finne problemer og håndheve kode stil.

    La oss gå med det siste alternativet. Bruk piltastene til å endre valg og ENTER for å bekrefte. ESLint vil da ønsker å vite hvilke typer moduler prosjektet ditt bruk. Svarene er:

    • JavaScript-moduler
    • CommonJS Moduler
    • Ingen av disse

    Velg JavaScript moduler og fortsette. Etter at den ber deg som rammeverket ikke prosjektet ditt bruk., Svarene, igjen, er tre:

    • Reagere
    • Vue
    • Ingen av disse

    I vårt tilfelle, la oss velge «none» – alternativ. Det neste spørsmålet er et «ja/nei» spørsmål: har prosjektet ditt bruk maskinskrevet kopi? Trykk «N» for nei. Etter at den ber om koden kjøres i nettleseren eller i Noden.

    ESLint så spør du hvordan du skal velge en måte å definere en kode stil for prosjektet. Det har du tre muligheter: ved hjelp av en populær stil, guide, svare på spørsmål om din stil preferanser, eller å inspisere .js-filer. Velge det første alternativet., Deretter vil du bli bedt om å velge mellom tre stiler: AirBNB, Standard, og Google. For denne opplæringen, la oss plukke Google.

    ESLint vil deretter be om hvilket format du foretrekker for din konfigurasjon. Plukke YAML. Til slutt, når du blir spurt om du vil laste ned det valgte koden stil ved hjelp av npm, svar «ja.»

    ved Hjelp av ESLint å Sjekke en Fil

    Når nedlastingen er fullført, vil du være klar til å bruke ESLint å sjekke en fil. Men for at du trenger en fil for å sjekke. Hvis du tilfeldigvis har en .js-fil hengende rundt et sted, kopiere den inn i prosjektet katalogen., Alternativt, du kan klone dette depotet, som inneholder en enkelt fil, og bruke den til testing.,

    for Å sjekke filen, bruker du følgende kommando:

    JavaScript

    1
    npx eslint vei-til-din-fil.,js

    Dette er resultatet jeg får fra å kjøre kommandoen målrettet ved hilsenen.,js-fil som du kan laste ned fra depotet på GitHub:

    1
    2
    3
    4
    5
    6

    F:\demos\eslint-demo\greeter.,js
    2:3 feil Mangler JSDoc kommentar krever-jsdoc
    3:1 feil Denne linjen har en lengde på 86. Maksimal tillatt er maks 80-len
    10:4 feil Uventede ‘dette’ no-invalid-dette
    ✖ 3 problemer (3 feil, 0 advarsler)

    Som du kan se, Jeg har fått tre feil og ingen advarsler.

    Hva Er en Linter? Et Flott Verktøy for Din Toolbelt

    I dette innlegget, vi har undersøkt konseptet av en linter verktøyet. Nå har du en solid inntrykk av hva linters er og hvorfor du bør vedta en., I tillegg, du har lært om forskjellige typer linter verktøy og eksempler på hver kategori, rettet mot flere forskjellige programmeringsspråk.

    Foruten alt det, nå vet du hvordan du kommer i gang med en populær linting verktøy for JavaScript: ESLint.

    Hva er neste skritt?, Det er flere ting du kan lære hvordan du gjør neste:

    • Deaktiver regler
    • Aktiver en regel som en advarsel eller en feil
    • Integrere linting inn i byggeprosessen
    • Avansert konfigurasjon alternativ
    • Opprette egendefinerte regler

    Du kan også, selvfølgelig, kan du eksperimentere med andre linters. Bare fordi vi har plukket ESLint for denne guiden, det betyr ikke at du bør bli sittende fast med det.

    til Slutt, ikke glem at linting, mens utrolig verdifullt, er bare et annet våpen i arsenalet ditt., Du bør ikke glemme automatisert testing, kode gjennomgang, refactoring, og mange andre fremgangsmåter, teknikker og verktøy til disposisjon i den endeløse kampen mot kaos i codebase.

    Og blant alle rutinene, teknikker og verktøy du kan ta i bruk for å gjøre din codebase bedre, vi kan ikke hjelpe, men enkelt-out ende-til-ende-testing, som er en ofte oversett type testing. Og det er en skam. Med det rette verktøyet for å hjelpe deg ut, kvalitet ende-til-ende-testing kan være en mektig alliert i kampen mot koden entropi.

    Articles

    Legg igjen en kommentar

    Din e-postadresse vil ikke bli publisert. Obligatoriske felt er merket med *