Miért (és hogyan) írok kódot ceruzával és papírral PlatoBlockchain Data Intelligence. Függőleges keresés. Ai.

Miért (és hogyan) írok kódot ceruzával és papírral

Ha a kézírásos kód gondolata butaságnak tűnik, meglepheti, hogy ez elkerülhetetlen. Ha nem biztos benne, gondoljon a legutóbbi állásinterjúra, és emlékezzen arra, hogy az interjúteremben nem volt számítógép – csak a kérdezőbiztosai, egy üres papírlap és egy kék golyóstoll.

Az Önök diákjai számára ez még nagyobb baj, mivel az érdemjegyeitek a kódsorok miatt lógnak, amelyeket stratégiailag benyomott a válaszlapon rendelkezésre álló helyre.

És nem csak ez, a tapasztalt programozók rámutathatnak az irodai másológépről eltávolított A4-es ívek kötegére, hogy lefirkáljanak egy különösen összetett algoritmust, amelyen dolgoztak.

Tehát akár vizsgáztató, akár potenciális állásinterjún résztvevő vagy valaki, aki meg akarja oldani a programozási zsákutcáját, remélem, hogy ez a cikk segít Önnek, amikor a tollat ​​a papírra helyezi a kódoláshoz.

Bár a kódírás analóg aspektusára összpontosítok, ezeket a lépéseket bármilyen formában vagy nyelven alkalmazhatja a kódoláshoz. Tehát tekintse ezt egy általános kódolási útmutatónak, amely kifejezetten számomra működik, de nagyon hasznos lehet a munkája során.

Miért írja le?

Mielőtt elkezdenénk, fontos megérteni, hogy senki sem várja el, hogy gyártásra kész kódot jegyezzen fel egy notebookba. Nem mintha be tudnád dobni egy kódszerkesztőbe, és hiba nélkül lefordíthatod. Ha tökéletes kód előállítása lenne a cél, akkor az interjútermekben és a vizsgatermekben számítógép előtt ülne.

A kézírásos kód célja, hogy előre dolgozzon a logikán. A tervezés során a lehető leghamarabb „be kell jutni a böngészőbe”, de van a hagyományos bölcsesség a tervek kézzel történő vázlatában. Az alacsony hűségű közeg gyors kísérletezésre és olcsó hibákra ösztönöz.

Az a fáradság, hogy megpróbáljuk kitalálni, hogyan lehet egy kattintással befolyásolni a környező tárgyakat (az én utolsó cikk)

Ugyanez igaz a kódra is, főleg a szintaxis és a szemantika kidolgozásakor. Ez azt jelenti, hogy a megfelelő szintaxis és szemantika megszerzése az mindig plusz pont, bár nem az egész kézírási gyakorlat egyetlen fókusza.

Lássuk, hol kezdhetjük a kézírási kódot.

Ismerje meg kérdését

A főiskola utolsó évében egészségügyi okok miatt nem tudtam gyakorlatot tölteni, és még az egyetemi interjúkon sem tudtam részt venni. Ennek eredményeként a legelső állásinterjúm szó szerint nagy téttel zajlott.

Ha most visszatekintek, az interjú nagyon könnyű volt. De mivel még soha nem vettem részt egyiken sem, ok nélkül aggódtam. Az első dolog, amit a kérdezők megkérdeztek a programozásról, az volt, hogy ki tudok-e adni egy fordított háromszöget, amely csillagokból áll. Mint mondtam, könnyű volt – semmi a for a hurok nem bírja, igaz? De mint mondtam, a szorongásom is a tetőn keresztül volt.

Mély levegőt vettem, a tenyeremet az üres papírlapra nyomtam, amit kiraktak nekem, a lehető leglassabban csúsztattam magam felé az asztalon (természetesen vásárlási idő), megnyomtam a tollat, majd csináltam valamit. jobb.

Először rajzoltam egy fordított háromszöget csillagokból. Így a földön találtam a lábam, hogy válaszoljak a kérdésükre.

Láttam, hogy az egyébként zseniális fejlesztők valamit rosszul csinálnak egyszerűen azért, mert soha nem fogják fel teljesen, hogy mit is akarnak megoldani.

A kérdések, amelyekkel dolgozunk, nem olyanok, mint a fizikusok vagy a matematikusok. Kapnak egy paraméterkészletet, és megtalálják a hiányzókat; kérdéseink egyben eredményeink is. Már megmondták nekünk, mik az eredményeink – ki kell találnunk, hogyan érhetjük el őket. Ezért elengedhetetlen, hogy jól ismerje a kérdést, mert látni fogja az eredményt.

A kódolás megkezdésének egyik legjobb módja, ha leírja vagy kirajzolja, hogy mit szeretne kiadni. Megértem, hogy a mi felgyorsult iparágunkban az az elvárás, hogy egy „hello world” demó futtatásával rögtön bele kell ugranunk a programozásba. És nagyszerű, hogy megismerkedhetsz egy ismeretlen szintaxissal, és lerázhatod a szorongást, hogy valami újat próbálj ki.

De amikor valaki feltesz neked egy kérdést, és eredményt ad, hogy dolgozz, nem lenne jobb, ha először ezt tennéd le? Ez a kérdés/eredmény nem csak a kiindulópontod, hanem a referenciapontod is. A kódolás bármely lépésében megtekintheti, hogy megbizonyosodjon arról, hogy a cél felé halad, és hogy jó úton halad.

Tehát akár a válaszlapokon, akár azon az üres A4-es papíron, amelyre írni készül, kezdje azzal, hogy szánjon egy percet, és írja le, hogy mit próbál kiírni. A margóra vagy a sarokba helyezheti, ha nem szeretné, hogy a válasz része legyen. Csak győződjön meg róla, hogy olyan helyen van, ahol folyamatosan hivatkozhat rá.

Vázolja fel a kódot

Ez a lépés olyan, mint egy kétélű kard. Útitervet készíthet a programhoz, vagy elvesztegetheti az idejét. Az én dolgom, hogy megbizonyosodjak arról, hogy az előbbi.

Tehát mindenekelőtt azt szeretném mondani: A kód felvázolása szükségtelen, ha a probléma vagy a kérdés köre kicsi. Ez a gyakorlat ismételten nem előíró és nem általános minden projektre vagy helyzetre. Képzeld el, hogy én vagyok a kérdező, és arra kérlek, írd meg, hogyan lehet a lehető legtöbb módon középre helyezni egy elemet egy weboldalon CSS használatával. Ehhez nem lesz szüksége vázlatra. A kódrészletek viszonylag kicsik az egyes módszerekhez.

De most tegyük fel, hogy megbízom Önnel, hogy írjon egy webalkalmazást, amely rögzíti a felhasználói aláírásokat egy érintőképernyős felületen keresztül, majd elmenti az aláírást a szerverre. Nem olyan egyértelmű, igaz? Egynél több dolgot kell kitalálnia. Talán egy kis vázlat segíthet.

  1. UI az aláírás rögzítéséhez – HTML Canvas? WebGL?
  2. Tiltsa le a mutató eseményeket a weboldal többi részén, amikor a felhasználó aláírja
  3. Konvertálja és mentse a rögzített képet PNG-fájlba – JS
  4. Ezután konvertálja blobbá (talán), és mentse el a látogató naplóadattáblájába.

Felírtam egy durva műveletsort, amelyet azt hiszem, kódolnom kell. Lehetett volna rövidebb vagy hosszabb, attól függően, hogy mit akarok tőle.

Erősen ajánlom a kód felvázolását az ügyfélprojektekhez. Írja fel a vázlatot felhasználói igényeivel együtt vagy a kinyomtatott drótvázak hátoldalára.

A felsoroláspontokról készült gyors pillanatfelvétel egy térképet, egy teendőlistát és egy ellenőrzőlistát ad, amellyel ellenőrizheti, amikor eléri a projekt végét – nagyjából a teljes projekt összefoglalója egy alacsony pontosságú listán. Ez egy sablon is lehet a következő hasonló projekt elindításához.

De ahogy korábban mondtam, ez a lépés olyan, mint egy kétélű kard. Ezt röviden kell hagynia a vizsgázóknak és az interjúalanyoknak, ha időkorlátok vannak.

Ha nem tudja, hol kezdje, írjon fel mindössze három alapvető funkciót, amelyet kódolnia kell az alkalmazásban, és ha van ideje, tegyen ötöt.

De erről van szó. Szánj erre a lehető legkevesebb időt, és ne izzadj a részletek miatt. A vázlat nem fog pluszpontokat szerezni. Csak azért van, hogy segítsen megbizonyosodni arról, hogy mindenre kiterjed. Megörökíti a kezdeti belső reakcióit, és őszinte marad a projekt teljes élettartama alatt.

Hosszúkézi kontra gyorsírás

Fehér vonalas papír, fekete tintával írott kurzív jegyzetekkel.
Gyors referencia a szövegkiválasztás letiltásához

Ideje elkezdeni a kódolást. Szóval mit írsz? „Bdrs” vagy „border-radius„; „div -> p"Vagy"<div><p></div></p>„; „pl()"Vagy"println()„; „q()"Vagy"querySelector()„?

Ha valaki más osztályozza a kódját, akkor nincs más választása. Hagyja el a rövidítéseket, az álkódokat, az Emmet-parancsikonokat és a gyorsírás minden más formáját. Ellenkező esetben nincs okunk feltételezni, hogy bárki, aki ezt olvassa, tudja, mit jelentenek a rövidítések.

Ez valóban rajtad múlik.

Ha kikerült a kézi írásból – és sokan közülünk meg is tette –, jobb, ha nem esünk túlzásokba a hosszúkézi jelölésekkel, mert unalmassá válnak. Ugyanakkor nincs olyan, hogy túlságosan takarékoskodj az írásaiddal. Nem, ha azt szeretnéd, hogy egy nap visszanézhess, és megérthesd, mit írtál le.

Van egy nyitott fájl a jegyzetkészítő alkalmazásomban, és egy vonalas jegyzettömb az asztalomon, ahová leírom azokat a kódrészleteket, amelyeket el szeretnék menteni későbbi használatra. Ezek rendezetlenek, csak a töredékek hosszú folyama. Éppen ezért, amikor a régebbi jegyzetek között böngészek, nem tudnám, mit akartam írni, ha nem írtam volna le egyértelműen.

Mindig elfelejtem a szintaxisokat. Például a JavaScript-függvényekhez a bevezetés óta használom a nyíl jelölést (mert rövidebb), és egészen biztos vagyok benne, ha valaki hirtelen megkér, hogy adjon meg egy függvényt a function kulcsszó, még az is előfordulhat, hogy eltévesztem a zárójeleket vagy a függvény nevét, ami szintaktikai hibát okoz.

Nem szokatlan, hogy elfelejtjük azokat a szintaxisokat, amelyeket egy ideje nem használtunk. Éppen ezért jobb, ha világosan megírja a jegyzeteit, ha tudja, hogy szüksége van rájuk későbbi hivatkozás céljából.

A nem szekvenciális kódfolyam

Ellentétben az utolsó lépéssel, amely nem vonatkozik az interjúalanyokra és a tesztfelvevőkre, ez a lépés kifejezetten Önnek szól.

A legtöbb programozási nyelvet úgy értelmezik, fordítják le és hajtják végre, hogy néha a forrásban előre megírt kódot később, amikor meghívják, végre kell hajtani. Ezt JavaScriptben tesszük meg például függvényhívással – a függvények kezdetben definiálhatók, majd később végrehajthatók. A vizsgázók és az interjúalanyok ezt felhasználhatják arra, hogy először a válasz kritikus pontján kezdjenek el dolgozni.

Ahogy a kezdetektől fogva mondtam, a kézírásos kód célja az, hogy végigdolgozza vagy tesztelje a program logikáját. A legjobb, ha először ennek megoldására koncentrál.

Vegyünk egy klasszikus tankönyvi példát – egy programot az n-edik megtalálására Fibonacci szám. Ha írnék hozzá egy egyszerű vázlatot, az valami ilyesmi lenne:

  1. Szerezze meg a bemenetet.
  2. Számítsa ki a Fibonacci-számot!
  3. Foglalja össze a kimenetet.
  4. Nyomtassa ki a kimenetet.

A vázlatban szereplő összes lépés elengedhetetlen; azonban az 1, 3 és 4 inkább kötelező. Szükségesek, de nem annyira fontosak, hogy azonnal összpontosítsanak rájuk.

Jobb, ha elkezdi leírni a kódot a Fibonacci-szám kiszámításához, ahelyett, hogy lekérné a bemenetet. Csomagolja be egy függvénybe, majd írja be a kódot egymás után, és írjon le egy sort a függvény meghívásához.

Töltsön időt azzal, hogy olyan kódot írjon, amely a probléma lényegére összpontosít.

Az igazi szakemberek előre tudnak ugrani. Tegyük fel, hogy van egy ügyfélprojektem, és valami háromszöggeometriával kell dolgoznom – van két oldala, ellentétes szöge, és meg kell találnom a harmadik oldal hosszát. És úgy döntöttem, hogy a kezdéshez inkább papírra firkálok, ahelyett, hogy kinyitnám IDE.

Először természetesen megrajzolnám a háromszöget (amiben nagyon tapasztaltam, amint tudod). Leírnék néhány mintahosszt és szöget. Utána megírnám a képletet (az online keresés dicsérete, az biztos), majd rögtön a függvény kódjához ugrottam.

Nincs értelme leírnom a kötelező lépéseket, pedig szükségem lesz rájuk gyártásra kész kódban. De más lenne, ha ezt egy vizsgán egy válaszlapra kellene felírnom. Nem hagyhatom ki a többi lépést; azonban továbbra is a képlet kódjával kezdhetem.

Pszeudo-kód

Chris már írt a praktikus cikk a pszeudokódról hogy nagyon ajánlom, hogy olvassa el alaposan.

Mindazoknak a szakembereknek, akik úgy érzik, hogy az egész kézírás-kód dolog nem az Ön csésze teájának tűnik, de mégis kíváncsiak lehetnek, hogy segíthet-e pszeudo-kód lehet a keresett egyensúly.

Ez hasonló a kód felvázolásához, amint azt az előző lépések egyikében említettem. Ez azonban rövidebb, és inkább gyorsírásnak tűnik. Néha „csontváz kódnak” is nevezik.

Íme néhány gyors pszeudokód a CSS-rács elrendezéséhez:

Grid
5 60px rows
6 100px columns

nincs mit írni! Tehát bár a ceruza papírra helyezése kiválóan alkalmas az ilyesmire, ugyanolyan hatékony, gyors és olcsó, ha bármilyen pszeudo kódot írunk bármilyen programba.

Tér és megjegyzések

Szerintem a kód 90%-a kulcsszavak és 10%-a lapok. Szóköz nélkül a szavak olvashatósága csökken. A behúzások szükségesek a kézzel írt kódokhoz is. Kérjük azonban, ne használja minden szinten, mert a papír szélessége korlátozza. Használja megfontoltan a tereket, de használja azokat.

Sárga béleletlen papír, fekete tintával kézzel írt kóddal.
Díjazott OG részlet, extra TLC-vel írva

Ha saját használatra írsz kódot, úgy gondolom, hogy ha mindent követtél, amit eddig említettem, és már leírtad az oldalra a kimenetet és a vázlatot, akkor lehet, hogy nem is kell megjegyzéseket fűzned. A megjegyzések gyorsan elárulják, mit csinál a következő kódkészlet. Ha már megírta és elolvasta a kód vázlatát, akkor a megjegyzések felesleges megjegyzések.

Ha azonban az ítélet azt mondja, hogy tegyél le egyet, akkor tedd meg. Add hozzá a kód jobb oldalához (mivel nem tudod beszúrni a már megírt sorok közé, ahogy mondjuk a VS Code-ban). Használjon perjeleket, zárójeleket vagy nyilakat, hogy jelezze, hogy ezek megjegyzések.

Azon vizsgázók számára, akik nem bíznak egy bizonyos szintaxisban, írják le a megjegyzéseket. Így legalább tudatja a dolgozatát értékelő személlyel a szándékát a helytelenül formázott kóddal. És csak a megfelelő elválasztójeleket használja a megjegyzések jelölésére – például ez a JavaScript előretörése.

Analóg vs digitális

Mint korábban említettem, minden, amit itt nyújtok, az általános kódolási tanács. Ha nem akarod ezt fizikai papírral kipróbálni, akkor bármelyik jegyzetelő alkalmazás is működik.

De ha a digitális útvonalat szeretnéd kipróbálni, azt javaslom, hogy próbálj meg valami mást is, mint egy egyszerű jegyzetkészítő alkalmazást. Dolgozzon vizuálisabb digitális eszközökkel – folyamatábrákkal, gondolattérképekkel, drótvázakkal stb. Ezek segíthetnek az eredmény, a körvonalak és magának a kódnak a megjelenítésében.

Nem vagyok túlságosan digitális polgár (kivéve a weben való munkát és a közelmúltban az e-könyvek olvasására való átállást), ezért ragaszkodom a fizikai notebookokhoz.

Kedvenc eszközeim a kézírási kódhoz

Bármilyen ceruza és papír megteszi! De sok lehetőség van, és ezek az általam használt eszközök:

A kódolásnak nincs „írási” módja

Remélem, ha más nem is, de a ceruzával és papírral való kézi kódírásom arra készteti Önt, hogy értékelje a kódtervezési és -írási módot. Szeretem tudni, hogy más fejlesztők hogyan viszonyulnak a munkájukhoz, és ez a módja annak, hogy bepillantást engedjek az én dolgomba.

Ismétlem, itt semmi sem tudományos vagy egzakt művészet. De ha szeretné kipróbálni a kézzel írt kódtervezést, itt van minden, amit egy szépen rendezett listában leírtunk:

  1. Kezdje azzal, hogy írja le (ha szükséges, mintaadatokkal együtt) a kód kimenetét.
  2. Írjon vázlatot a kódhoz. Kérjük, tartsa három lépésben a kis projektek vagy a kevésbé bonyolult projektek esetében.
  3. Használjon hosszú kézi jelöléseket. A maguk számára író fejlesztők használhatnak gyorsított jelöléseket, feltéve, hogy az írás olvasható, és az Ön számára érthető, ha később hivatkozik rá.
  4. Ha időhiányban van, fontolja meg először a probléma lényegét kezelő kód megírását. Később írja le a kód hívását a szekvenciális kód megfelelő helyére.
  5. Ha magabiztosnak érzi magát, próbáljon meg pszeudo kódot írni, amely megcélozza a fő gondolatot.
  6. Használjon megfelelő behúzásokat és szóközöket – és ügyeljen a papír szélességére.

Ez az! Ha készen áll a kód kézi írására, remélem, ez a cikk megkönnyíti a kezdést. És ha leülsz egy vizsgára vagy egy interjúra, remélem, ez segít a kérdések helyes megfogalmazására összpontosítani.

Időbélyeg:

Még több CSS trükkök