Ce este un linter? Pe scurt, un linter este un instrument care vă ajută să vă îmbunătățiți codul. Conceptul de linter nu este exclusiv pentru JavaScript. Totuși, aș spune că majoritatea oamenilor care încearcă să învețe despre linters sunt interesați de cele care vizează JavaScript (sau, mai general, limbile tastate dinamic.)

în postarea de astăzi, răspundem la întrebarea din titlu și multe altele. Începem prin definirea termenului ” linter.,”Veți înțelege ce este acest lucru și cum a ajuns să fie. Apoi, vorbim despre beneficiile linterilor și continuăm să vorbim despre diferitele tipuri de verificări pe care le oferă.în cele din urmă, vă vom arăta câteva exemple de linii la dispoziția dvs., vă vom oferi câteva sfaturi practice despre cum să începeți și încheiați cu câteva considerații finale.

Să începem.

ce este un Linter? O scurtă prezentare

Să începem prin a defini ce este un linter. După cum ați citit în introducere, un linter este un instrument care vă ajută să vă îmbunătățiți codul. Dar în ce fel face asta?, Răspunsul este: analizând codul sursă în căutarea problemelor.

termenul linter provine de la un instrument numit inițial „lint” care a analizat codul sursă C. Informaticianul Stephen C. Johnson a dezvoltat această utilitate în 1978, când a lucrat la Bell Labs.atât instrumentul original de scame, cât și utilitățile similare anterioare, au avut scopul de a analiza codul sursă pentru a veni cu optimizări ale compilatorului. De-a lungul timpului, instrumentele asemănătoare scamei au început să adauge multe alte tipuri de verificări și verificări.,

cu toate acestea, așa cum am menționat în timpul introducerii, Linter-urile nu sunt limitate la limbile compilate. Dimpotrivă: am putea spune că Linter-urile sunt mult mai valoroase pentru limbile interpretate, deoarece nu există un compilator care să detecteze erorile în timpul dezvoltării.

avantajele Linting

tocmai ați învățat definiția linter. Acum știți și când a fost inventat acest tip de instrument și de cine. Probabil că aveți până acum cel puțin o idee generală despre ce poate face un linter pentru codul dvs., Dar, în termeni mai practici, care sunt beneficiile pe care acest tip de instrument le poate oferi? Aici sunt unele:

  • mai Puține erori în producție
  • ușor de Citit, de întreținut și mai consistent cod
  • mai Puține discuții despre codul de stil și estetică alegeri în codul de clienți
  • măsurare Obiectivă de cod de calitate
  • Mai sigure si performante de cod

secțiunea următoare se referă la unele dintre tipurile de verificări care linters de a oferi. După ce ați citit-o, veți înțelege modul în care linters oferă beneficiile de mai sus.,după cum tocmai ați citit, instrumentul original de scame a analizat codul pentru a permite optimizări pentru compilatoare, dar în timp, au fost lansate instrumente mai avansate și mai complete. În zilele noastre, avem nenumărate linii diferite, care oferă multe tipuri de verificări. Să trecem repede prin unele dintre ele.

erori de sintaxă

cel mai de bază și mai vital tip de verificări pe care un linter le poate oferi sunt verificările erorilor de sintaxă atunci când vine vorba de JavaScript și alte limbi interpretate., Dezvoltatorii nu ar trebui să împingă nici măcar codul la linia principală fără a trece verificările de sintaxă.o modalitate de a realiza acest lucru este de a utiliza cârlige pre-commit care împiedică utilizatorii să împingă codul lor atunci când verificarea linter indică există probleme cu codul.

respectarea standardelor de cod

Un alt tip vital de verificare pe care Linter-urile îl oferă este respectarea standardelor de codificare. Unii oameni ar putea respinge acest lucru ca o preocupare pur estetică, dar ar fi greșit., Având un singur stil consistent de codificare este benefic pentru scăderea sarcinii cognitive de citire, înțelegere și menținere a codului. O bază de cod care are un stil de cod consistent va fi mai ușor de înțeles, iar dezvoltatorii care o folosesc vor fi mai puțin susceptibili să introducă bug-uri.de aceea există linters care se specializează în verificarea codebases pentru aderarea la stiluri de cod. Unele instrumente sunt avizate, adică vin cu un set predefinit de reguli și convenții care nu pot fi schimbate., Pe de altă parte, există instrumente care pot fi extrem de configurabile, permițând utilizatorului să adapteze instrumentul la stilurile de codare preferate.

probleme potențiale (aka Code Smells)

code smells sunt semne că ceva ar putea fi în neregulă cu codul. Este uimitor de util să aveți un instrument pentru a detecta automat aceste semne, astfel încât să le puteți investiga mai departe, dacă este necesar.de exemplu, mulți oameni—inclusiv eu-consideră că funcțiile lungi sunt un miros de cod. Deci, ai putea configura linter dvs. pentru a detecta funcții care sunt mai lungi decât un anumit număr de linii.,

Un alt miros de cod adesea citat este un cod prea complex. Dar nu vorbim despre complexitate într-un mod subiectiv, ci unul foarte obiectiv. Complexitatea ciclomatică este o valoare de cod utilă care reprezintă numărul de căi de execuție posibile în interiorul unei funcții. Linters poate calcula cyclomatic complexity de funcții și steag pe cei care sunt mai mari decât un anumit prag.nu în ultimul rând, avem securitate, care este, fără îndoială, cea mai critică fațetă a unei aplicații moderne, în special a unei aplicații web., Înțelegeți greșit, iar consecințele pot fi catastrofale, nu numai în ceea ce privește banii și reputația, ci chiar și cele legale (gândiți-vă la GDPR și reglementări similare.din fericire, acesta este un alt domeniu în care Linter-urile pot fi de ajutor, deoarece există instrumente care oferă verificări importante de securitate.

înțelegerea analizei statice

am explicat ce lintere sunt și de ce sunt utile. De asemenea, am acoperit principalele tipuri de linters. Acum sunteți gata să aflați despre câteva exemple de instrumente de linting pentru o varietate de utilizări și limbaje de programare țintă.,

înainte de a ajunge acolo, totuși, să facem o scurtă digresiune pentru a vorbi despre analiza statică, deoarece acest termen apare în secțiunea următoare și nu l-am definit încă.deci, ce este analiza statică? Vă puteți gândi la analiza statică ca la o depanare pre-rulată. Analiza statică constă în utilizarea instrumentelor care analizează codul sursă în căutarea erorilor, a lipsei de respectare a regulilor sau convențiilor sau a altor probleme potențiale.

următoarea secțiune prezintă exemple de linters clasificate în funcție de tipul de verificare pe care le efectuează., Intrările clasificate în analiza statică se referă mai ales la primul și al treilea tip de lintre enumerate în secțiunea de mai sus.

Exemple de linii

să menționăm pe scurt câteva exemple de linii. Vom arăta exemple pentru diferite limbaje de programare, clasificate în funcție de tipul de verificare pe care le furnizează. Rețineți că unele instrumente pot oferi mai multe tipuri de verificare, astfel încât acesta este motivul pentru care unele instrumente apar în mai multe categorii.,>

  • StandardJS pentru JavaScript
  • PHPMD pentru PHP
  • StyleCop pentru C#
  • Linters de Securitate

    • Gosec pentru a Merge
    • Bandit pentru Python
    • LGTM pentru mai multe limbi, inclusiv JavaScript, Python, și C#

    Linters de Convenții de Codificare / Codificare Formatare

    • mai Frumoasa pentru JavaScript
    • Rubocop pentru Ruby
    • StyleCop pentru C#

    Linters în JavaScript: Cum de a începe

    Înainte de a încheia articolul, dorim să vă dau o scurtă, dar ghid practic despre cum să începeți cu linting în JavaScript., Din moment ce vorbim despre JavaScript, nu este de mirare că există multe instrumente din care să alegeți. Din moment ce trebuie să alegem unul, mergem cu ESLint.

    instalarea ESLint

    primele lucruri mai întâi: să instalăm linterul. ESLint este instalat prin npm, ceea ce înseamnă că trebuie să aveți nod.js instalat. Dacă nu îl aveți deja, descărcați-l și instalați-l pentru a putea continua.

    cu nod.JS instalat, suntem gata să instalăm ESLint prin npm., the following command:

    1
    npm install eslint –global

    However, this isn’t the approach recommended in their documentation., În schimb, ar trebui să instalați ESLint pe bază de proiect.,ory for your project:

    1
    mkdir eslint-sample-app

    Then, cd into the directory and run the command below to create a package.,fișier json (va fi nevoie pe drum.)

    1
    npm init

    Npm va cere mai multe întrebări., Doar apăsați enter pentru a utiliza răspunsul implicit pentru toate acestea.,a făcut, de funcționare:

    1
    npx eslint –init

    Când executați comanda de mai sus, ESLint vă va cere ce vrei să-l folosești., Opțiunile sunt: să verificați numai sintaxa, să verificați sintaxa și să găsiți probleme și să verificați sintaxa, să găsiți probleme și să aplicați stilul de cod.

    Să mergem cu ultima opțiune. Utilizați tastele săgeată pentru a schimba opțiunile și introduceți pentru a confirma. ESLint va dori apoi să știe ce tipuri de module utilizează proiectul dvs. Raspunsurile sunt:

    • JavaScript modules
    • CommonJS Modules
    • nici unul dintre aceste

    alegeți JavaScript modules și continuați. După aceea, vă întreabă ce cadru utilizează proiectul dvs., Răspunsurile, din nou, sunt trei:

    • React
    • Vue
    • niciunul dintre acestea

    în cazul nostru, să alegem opțiunea „none”. Următoarea întrebare este o întrebare” Da/Nu”: proiectul dvs. utilizează Typescript? Apăsați ” N ” pentru nr. După aceea, vă întreabă dacă codul dvs. rulează în browser sau în nod.

    ESLint vă întreabă apoi cum să alegeți o modalitate de a defini un stil de cod pentru proiectul dvs. Acesta vă oferă trei posibilități: folosind un ghid de stil popular, răspunde la întrebări despre preferințele de stil, sau inspectarea dvs .. fișiere js. Alegeți prima opțiune., Apoi, vi se va cere să alegeți între trei stiluri: AirBNB, Standard și Google. Pentru acest tutorial, să alegem Google.

    ESLint va întreba apoi ce format preferați pentru configurația dvs. Alege YAML. În cele din urmă, când sunteți întrebat dacă doriți să descărcați stilul de cod selectat folosind npm, răspundeți „da.”

    utilizarea ESLint pentru a verifica un fișier

    după finalizarea descărcării, veți fi gata să utilizați ESLint pentru a verifica un fișier. Dar pentru asta, aveți nevoie de un fișier pentru a verifica. Dacă se întâmplă să aibă o .fișier JS agățat în jurul valorii de undeva, copiați-l în directorul de proiect., Alternativ, puteți clona acest depozit, care conține un singur fișier, și să-l utilizați pentru testare.,

    Pentru a verifica dosarul, utilizați următoarea comandă:

    JavaScript

    1
    npx eslint calea de fișier.,js

    acesta este rezultatul pe care îl obțin din rularea comenzii orientate spre salut.,js fișiere puteți descărca de la depozitul de pe GitHub:

    1
    2
    3
    4
    5
    6

    F:\demos\eslint-demo\greeter.,js
    2:3 eroare lipsă comentariu JSDoc require-jsdoc
    3:1 Eroare această linie are o lungime de 86. Maximă admisă este de 80 max-len
    10:4 eroare Neașteptată „asta” nu-invalid-acest
    ✖ 3 probleme (3 erori, 0 avertismente)

    după Cum puteți vedea, Am trei erori și avertismente.

    ce este un Linter? Un instrument excelent pentru centura de instrumente

    în acest post, am examinat conceptul de instrument linter. Acum aveți o idee solidă despre ce sunt linterii și de ce ar trebui să adoptați unul., În plus, ați învățat despre diferite tipuri de instrumente linter și exemple din fiecare categorie, vizând mai multe limbaje de programare diferite.

    pe lângă toate acestea, acum știți cum să începeți cu un instrument popular de linting pentru JavaScript: ESLint.

    care sunt pașii următori?, Există mai multe lucruri pe care le puteți învăța cum să facă următorul:

    • Dezactivare reguli
    • Permite o regulă ca un avertisment sau o eroare
    • Integrarea linting în proces de a construi
    • Advanced opțiune de configurare
    • de a Crea reguli personalizate

    de asemenea, puteți, desigur, să experimenteze cu alte linters. Doar pentru că am ales ESLint pentru acest ghid, asta nu înseamnă că ar trebui să rămâneți blocat cu el.

    În cele din urmă, nu uitați că linting, în timp ce uimitor de valoros, este doar o altă armă în arsenalul dvs., Nu trebuie să uitați de testarea automată, revizuirea codului, refactorizarea și multe alte practici, tehnici și instrumente la dispoziția dvs. în lupta fără sfârșit împotriva haosului din baza dvs. de cod.și dintre toate practicile, tehnicile și instrumentele pe care le puteți utiliza pentru a îmbunătăți baza de cod, nu putem decât să testăm end-to-end, care este un tip de testare adesea trecut cu vederea. Și asta e păcat. Cu instrumentul potrivit pentru a vă ajuta, testarea end-to-end de calitate poate fi un aliat puternic în lupta împotriva entropiei codului.

    Articles

    Lasă un răspuns

    Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *