Preskoči na vsebino

Brezplačni Oblikovalec Kode: Polepšaj JavaScript, Python, HTML in več

Trenutno oblikuj nepregleden kod z ustreznim zamikanjem in razmiki. Podpira več kot 12 jezikov, vključno z JavaScript, Python, HTML, CSS in Java. Deluje v brskalniku, varno in brezplačno. Ni potrebne registracije.

Oblikovalnik kode

Oblikujte svojo kodo z enim klikom. Izberite jezik, prilepite kodo in jo dobite pravilno oblikovano.

Kako uporabiti:

  1. Izberite programski jezik iz spustnega menija.
  2. Prilepite neoblikovano kodo v vnosno polje.
  3. Kliknite gumb 'Oblikuj kodo'.
  4. Kopirajte oblikovani rezultat iz izhodnega polja.
Kalkulator nalaganja...
📚

Dokumentacija

Kaj je oblikovalnik kode?

Oblikovalnik kode je orodje, ki prepiše izvorno kodo z doslednim zamikanjem, prelomi vrstic in presledki, ne da bi spremenilo delovanje kode. Ta oblikovalnik kode deluje v spletnem brskalniku. Podpira 12 programskih jezikov, med njimi JavaScript, Python, HTML in CSS.

Kako deluje ta oblikovalnik kode

Orodje uporablja drugačen nabor pravil za vsak jezik. Noben od njih, razen JSON, ne zgradi celotnega sintaktičnega drevesa kode.

  • JSON se razčleni z vgrajenim razčlenjevalnikom JSON v brskalniku, nato pa se znova izpiše z zamikom dveh presledkov. Če je JSON neveljaven, orodje prikaže napako in ne prikaže izhoda.
  • JavaScript, TypeScript, Java, C, C++ in C# uporabljajo isti oblikovalnik. Ta pregleduje kodo znak za znakom in beleži zavite oklepaje, okrogle oklepaje ter podpičja. Vsak { začne nov zamaknjen blok, vsak } ali ; pa konča vrstico. Komentarji in nizi v narekovajih se prekopirajo nespremenjeni. Ta oblikovalnik ne dodaja presledkov okoli operatorjev ali za vejicami, če jih v izvirni kodi ni bilo — obnovi le prelome vrstic in zamikanje.
  • Python prebere obstoječe zamikanje vsake vrstice in ga znova zgradi s štirimi presledki na raven, pri tem pa upošteva ista pravila gnezdenja, kot jih uporablja sam jezik Python. Ne razdeli dolgih vrstic, ne dodaja praznih vrstic in ne dodaja presledkov okoli operatorjev; le poenoti globino zamika vsake vrstice.
  • CSS odstrani dodatne prelome vrstic in prazne presledke, nato pa doda prelom vrstice za vsakim { in ; ter pred vsakim }.
  • HTML in XML dodata prelom vrstice in dva presledka zamika za vsako raven gnezdenih značk ter prepoznata standardne samozapiralne značke, kot so <br>, <img> in <input>.
  • SQL pretvori določen nabor ključnih besed, kot so SELECT, FROM, WHERE, JOIN in ORDER BY, v velike črke ter začne novo vrstico pred vsakim glavnim stavkom.

Ker vhod dejansko razčleni samo pot JSON, noben drug oblikovalnik ne zazna sintaktičnih napak, kot sta manjkajoči oklepaj ali nezaprt niz. Preoblikujejo poljubno besedilo, ki ga prejmejo, tudi če se ne bi moglo izvesti.

Podprti jeziki

JezikObičajna končnica datotekeŠirina zamika
JavaScript.js2 presledka
TypeScript.ts2 presledka
HTML.html2 presledka
CSS.css2 presledka
Python.py4 presledki
Java.java4 presledki
C.c4 presledki
C++.cpp4 presledki
C#.cs4 presledki
SQL.sqlprelomi vrstic po stavčnih členih
JSON.json2 presledka
XML.xml2 presledka

Kako oblikovati kodo

  1. V spustnem meniju izberite programski jezik.
  2. Neoblikovano kodo prilepite v vnosno polje.
  3. Izberite »Oblikuj kodo«.
  4. Oblikovani rezultat kopirajte iz izhodnega polja.

Oblikovanje poteka v celoti v brskalniku. Koda se nikoli ne pošlje strežniku.

Primer oblikovanja JavaScripta

Pred oblikovanjem:

1function add(a, b) {
2    if (a > 0) { return a + b; }
3    return 0;
4}
5

Po oblikovanju:

1function add(a, b) {
2  if (a > 0) {
3    return a + b;
4  }
5  return 0;
6}
7

Oblikovalnik je kodo znotraj { } premaknil v lastno zamaknjeno vrstico in poenotil zamikanje na dva presledka na raven. Presledke okoli a > 0 in a + b je pustil nespremenjene, ker so bili že prisotni.

Primer oblikovanja Pythona

Pred oblikovanjem:

1def calculate_average(numbers):
2  if len(numbers) == 0:
3    return 0
4  total = sum(numbers)
5  return total / len(numbers)
6

Po oblikovanju:

1def calculate_average(numbers):
2    if len(numbers) == 0:
3        return 0
4    total = sum(numbers)
5    return total / len(numbers)
6

Izvirna koda je uporabljala dva presledka na raven zamika. Oblikovalnik je zamik vsake vrstice znova zgradil s štirimi presledki na raven, skladno s slogom, opisanim v PEP 8, uradnem slogovnem priročniku za Python. Vrstice je ohranil v enakem vrstnem redu in ni posegal v presledke znotraj vrstic.

Zakaj je oblikovanje kode pomembno

Zaradi nedoslednega zamikanja je težje videti, kje se konča funkcija, zanka ali pogoj. Koda, ki jo je urejalo več ljudi, pogosto vsebuje mešanico zamikanja s tabulatorji in presledki ali vrstice, ki niso poravnane z blokom, ki mu pripadajo. Če jo obdelamo z oblikovalnikom, dobi vsaka datoteka enako vizualno zgradbo, zato jo je mogoče hitreje pregledati in lažje opaziti napačno postavljen oklepaj.

Omejitve

  • Velikost vhoda: Orodje sprejme največ 50.000 znakov kode. Daljši vnos se zavrne s sporočilom o napaki, še preden se oblikovanje začne.
  • Za večino jezikov ni preverjanja sintakse: Razčleni in preveri se samo vhod JSON. Koda v drugih 11 jezikih se preoblikuje takšna, kot je, tudi če vsebuje manjkajoči oklepaj ali nezaprt niz. V takem primeru je izhod lahko napačno zamaknjen, namesto da bi bil označen kot napaka.
  • Presledki okoli operatorjev se ne spreminjajo: Oblikovalniki za JavaScript, TypeScript in jezike družine C preurejajo le prelome vrstic in zamikanje. Ne vstavijo presledka okoli +, =, !== ali za vejico, če ga prej ni bilo.
  • PHP ni podprt: Če izberete nepodprt jezik, orodje vrne kodo nespremenjeno.

Pogosta vprašanja

Ali orodje preveri mojo kodo glede sintaktičnih napak? Samo pri JSON. Vhod JSON se razčleni, zato neveljaven JSON ustvari sporočilo o napaki. Koda v drugih podprtih jezikih se preoblikuje, ne da bi se preverjalo, ali je sintaktično veljavna.

Ali mojo kodo pošlje strežniku? Ne. Oblikovanje v celoti poteka v brskalniku z uporabo JavaScripta. Koda se ne naloži na strežnik in se nikjer ne shrani.

Kolikšno največjo količino kode lahko oblikuje? 50.000 znakov. Če jih prilepite več, se pred začetkom oblikovanja prikaže napaka.

Ali bo dodal manjkajoče presledke okoli mojih operatorjev ali za vejicami? Ne pri JavaScriptu, TypeScriptu, Javi, C, C++ in C#. Ti oblikovalniki znova zgradijo le zamikanje in prelome vrstic okoli zavitih oklepajev in podpičij; preostanek vsake vrstice prekopirajo tako, kot je zapisan.

Kakšno zamikanje uporablja? Dva presledka pri JavaScriptu, TypeScriptu, HTML, CSS, JSON in XML. Štirje presledki pri Pythonu, Javi, C, C++ in C#.

Zakaj je moja koda po oblikovanju videti skoraj enako? Če je vhod že uporabljal dosledne presledke in enoten slog oklepajev, oblikovalnik večinoma znova zgradi zamikanje, zato je sprememba lahko majhna. Najbolj uporaben je pri kodi z mešanim zamikanjem ali pri kodi, ki je bila pomanjšana na zelo malo vrstic.