Чому (і як) я пишу код олівцем і папером PlatoBlockchain Data Intelligence. Вертикальний пошук. Ai.

Чому (і як) я пишу код олівцем і папером

Якщо думка про рукописний код здається дурною, вас може здивувати, дізнавшись, що це неминуче. Якщо ви не впевнені, згадайте останню співбесіду, яку ви проходили, і пам’ятайте, що в кімнаті для співбесід не було комп’ютера — лише ваші співбесіди, чистий аркуш паперу та синя кулькова ручка.

Для студентів серед вас це ще більше, оскільки ваші оцінки залежать від рядків коду, які ви стратегічно втиснули у вільний простір у своєму аркуші відповідей.

І не тільки це: досвідчені програмісти можуть вказати вам на пачку аркушів формату А4, які вони вийняли з офісної копіювальної машини, щоб нашкрябати особливо складний алгоритм, над яким вони працювали.

Тож незалежно від того, чи є ви студентом іспиту, потенційним учасником співбесіди чи тим, хто хоче розв’язати свої програмні тупики, я сподіваюся, що ця стаття допоможе вам, коли ви прикладаєте перо до паперу для кодування.

Хоча я зосереджусь на аналоговому аспекті написання коду, ви можете застосувати ці кроки до кодування будь-якою формою та мовою. Тому вважайте, що це також як загальна інструкція з кодування, яка працює спеціально для мене, але також може бути дуже корисною для вас у вашій роботі.

Навіщо це записувати?

Перш ніж ми почнемо, важливо розуміти, що ніхто не очікує, що ви будете записувати готовий для виробництва код у блокноті. Це не те, що ви можете скинути це в редактор коду та скомпілювати без помилок. Якби створення ідеального коду було метою, ви б сиділи перед комп’ютером у кімнатах для співбесід та екзаменаційних залах.

Мета коду рукописного тексту — заздалегідь пропрацювати логіку. Є бажання якнайшвидше «потрапити в браузер» у дизайні, але існує загальноприйнята мудрість у створенні ескізів вручну. Носій із низькою точністю спонукає до швидких експериментів і недорогих помилок.

Трудна спроба зрозуміти, як впливати на навколишні предмети одним клацанням миші (з мого Остання стаття)

Те саме стосується коду, головним чином при розробці синтаксису та семантики. Тим не менш, отримати правильний синтаксис і семантику завжди плюс, хоча й не єдиний фокус усієї вправи з рукописним текстом.

Давайте подивимося, з чого ми можемо почати, коли справа доходить до рукописного коду.

Знай своє запитання

Під час останнього року навчання в коледжі я не міг пройти стажування чи навіть відвідати співбесіди в кампусі через стан здоров’я. Як наслідок, моя перша співбесіда пройшла буквально з високими ставками.

Коли я зараз озираюся назад, інтерв’ю було досить легким. Але я ніколи раніше не відвідував жодного, тому хвилювався безпідставно. Перше, що інтерв'юери запитали про програмування, це чи можу я вивести перевернутий трикутник із зірочок. Як я вже сказав, це було легко — нічого for цикл не впорається, так? Але, як я вже сказав, моє хвилювання також було зашкалююче.

Я глибоко вдихнув, притиснувся долонею до чистого аркуша паперу, який вони розклали для мене, ковзав ним якомога повільніше до себе на столі (звісно, ​​виграючи час), клацнув ручкою, а потім щось зробив правильно.

Спочатку я намалювала перевернутий трикутник із зірочок. Ось як я опинився на землі, щоб почати відповідати на їхні запитання.

Я бачив, як геніальні розробники робили щось не так просто тому, що вони ніколи повністю не розуміли, що саме вони вирішують.

Питання, з якими ми працюємо, не схожі на питання, які вирішують фізики чи математики. Вони отримують набір параметрів і знаходять відсутні; наші запитання також є нашими результатами. Нам уже сказали, які наші результати — ми повинні зрозуміти, як їх досягти. Тому важливо добре знати питання, адже ви побачите результат.

Записати або намалювати те, що ви хочете вивести, є одним із найкращих способів почати кодування. Я розумію, що в нашій індустрії, яка швидко розвивається, очікується, що ми маємо відразу перейти до програмування, запустивши демонстрацію «Hello World». І це чудово — ознайомитись із незнайомим синтаксисом і позбутися хвилювання спробувати щось нове.

Але коли хтось задає вам запитання та дає вам результат, над яким потрібно працювати, чи не краще було б спочатку записати це? Це запитання/результат є не лише вашою відправною точкою, але й вашою точкою відліку. На будь-якому етапі кодування ви можете дивитися на нього, щоб переконатися, що ви працюєте над цим і що ви на правильному шляху.

Тож на аркушах для відповідей чи на чистому папері формату А4, який ви збираєтеся писати, почніть із секунди та запишіть те, що ви намагаєтеся вивести. Ви можете розмістити його на полях або в кутку, якщо не хочете, щоб він був частиною вашої відповіді. Просто переконайтеся, що це місце, де ви можете продовжувати посилатися на нього.

Окресліть свій код

Цей крок як палиця з двома кінцями. Це може дати вам дорожню карту вашої програми або витратити ваш час. Моя робота полягає в тому, щоб переконатися, що це перше.

Тому, перш за все, я хочу сказати: структурний код непотрібний, якщо обсяг вашої проблеми чи питання невеликий. Знову ж таки, ця практика не є ні нормативною, ні універсальною для всіх проектів чи ситуацій. Уявіть, що я ваш інтерв’юер, і я прошу вас написати, як центрувати елемент на веб-сторінці за допомогою CSS якомога більшою кількістю способів. Для цього вам точно не знадобиться схема. Фрагменти коду є відносно невеликими для кожного методу.

Але тепер, скажімо, я доручу вам написати веб-програму, яка фіксує підписи користувачів через інтерфейс сенсорного екрана, а потім зберігає підпис на сервері. Не так просто, правда? Вам потрібно з’ясувати більше ніж одну річ. Можливо, невеликий план може допомогти.

  1. Інтерфейс користувача для захоплення підпису — HTML Canvas? WebGL?
  2. Вимкнути події покажчика на решті веб-сторінки, коли користувач підписує
  3. Перетворіть і збережіть отримане зображення у файл PNG — JS
  4. Потім перетворіть його на blob (можливо) і збережіть у таблиці даних журналу відвідувача.

Я написав приблизну послідовність дій, які, мабуть, доведеться закодувати. Він міг бути коротшим або довшим, залежно від того, чого я від нього хотів.

Я настійно рекомендую окреслювати код для клієнтських проектів. Напишіть план разом із вашими вимогами користувача або на зворотному боці каркасів, які ви роздрукували.

Ваш швидкий знімок маркованих пунктів дає вам карту, список справ і контрольний список, з якими можна перевірити, коли ви досягнете кінця проекту — майже весь підсумок вашого проекту в низькоточному списку. Це також може стати шаблоном для початку вашого наступного подібного проекту.

Але, як я вже казав, цей крок — як палиця з двома кінцями. Ви повинні бути короткими для екзаменованих та опитуваних, коли є часові обмеження.

Якщо ви не знаєте, з чого почати, запишіть лише три основні функції, які вам доведеться закодувати у своїй програмі, і якщо у вас є час, зробіть їх п’ять.

Але це приблизно все. Витратьте на це якомога менше часу і не зациклюйтесь на деталях. Конспект не принесе додаткових балів. Це лише для того, щоб допомогти вам переконатися, що ви все охопили. Він фіксує вашу початкову інтуїційну реакцію та зберігає вашу чесність протягом усього життя проекту.

Стенографія проти стенографії

Білий лінійований папір із курсивними рукописними нотатками чорним чорнилом.
Коротка довідка щодо вимкнення виділення тексту

Час почати кодування. Отже, що ви пишете? «Bdrs» або «border-radius"; "div -> p"Або"<div><p></div></p>"; "pl()"Або"println()"; "q()"Або"querySelector()"?

Якщо хтось інший оцінює ваш код, вибору немає. Залиште абревіатури, псевдокоди, скорочення Emmet та будь-які інші форми скорочення. В іншому випадку немає підстав вважати, що будь-хто, хто читає це, знає, що означають ваші абревіатури.

Це дійсно залежить від вас.

Якщо ви перестали писати від руки — а багато з нас так і зробили — краще не перестаратися з довгими нотаціями, оскільки вони стають стомлюючими. У той же час, немає такого поняття, як бути надто ощадливим у своєму написанні. Ні, якщо ви хочете одного разу озирнутися на це і зрозуміти, що ви записали.

У моєму додатку для створення нотаток є відкритий файл, а на столі — блокнот у лінії, де я записую фрагменти коду, які хочу зберегти для подальшого використання. Вони неорганізовані, лише довгий потік фрагментів. Ось чому, переглядаючи старі нотатки, я б не знав, що мав на увазі, якби не записав їх чітко.

Я весь час забуваю синтаксис. Наприклад, я використовую нотацію зі стрілками для функцій JavaScript з моменту її появи (оскільки вона коротша), і я майже впевнений, що якщо хтось раптом попросить мене визначити функцію за допомогою function ключове слово, я можу навіть неправильно поставити дужки або назву функції, викликаючи синтаксичну помилку.

Для нас незвично забувати синтаксис, який ми давно не використовували. Ось чому краще чітко писати свої нотатки, коли ви знаєте, що вони вам знадобляться для подальшого використання.

Непослідовний потік коду

На відміну від останнього кроку, який не стосується вас, учасників співбесіди та учасників тестування, цей крок призначений спеціально для вас.

Більшість мов програмування інтерпретуються, компілюються та виконуються таким чином, що іноді попередньо написаний код у вихідному коді виконується пізніше під час виклику. Ми робимо це в JavaScript, наприклад, за допомогою виклику функції — функції можна визначити спочатку, а потім виконати пізніше. Випробувані та респонденти можуть використовувати це, щоб спочатку почати працювати над критичним моментом вашої відповіді.

Як я казав із самого початку, мета рукописного коду полягає в тому, щоб опрацювати або перевірити логіку будь-якої програми. Найкраще спочатку зосередитися на вирішенні цього.

Візьмемо класичний приклад з підручника — програму для пошуку n-го Число Фібоначчі. Якби я мав написати для цього простий план, це було б приблизно так:

  1. Отримати вхідні дані.
  2. Обчисліть число Фібоначчі.
  3. Підведіть підсумок.
  4. Роздрукуйте вихідні дані.

Усі кроки в цьому плані є важливими; однак 1, 3 і 4 є більш обов'язковими. Вони необхідні, але не настільки важливі, щоб зосередитися на них одразу.

Краще почати записувати код для обчислення числа Фібоначчі, а не для отримання вхідних даних. Оберніть його у функцію, а потім напишіть код послідовно та запишіть рядок для виклику цієї функції, де потрібно.

Витратьте свій час на написання коду, який зосереджується на суті проблеми.

Справжні професіонали можуть пропустити вперед. Скажімо, у мене є клієнтський проект, і я маю працювати з деякою геометрією трикутника — маю дві сторони, протилежний кут, і потрібно знайти довжину третьої сторони. І я вирішив нашкрябати на папері, щоб почати, а не відкривати свій IDE.

Спочатку я, звичайно, намалював би трикутник (це те, у чому я маю великий досвід, як ви можете сказати). Я б записав кілька зразків довжин і кутів. Потім я написав би формулу (звісно, ​​компліменти пошуку в Інтернеті), а потім перейшов би відразу до коду функції.

Немає сенсу записувати обов’язкові кроки, навіть якщо вони мені знадобляться в готовому для виробництва коді. Але було б інакше, якби мені довелося написати це в бланку відповідей на іспиті. Я не можу пропустити інші кроки; однак я все одно можу почати з коду для формули.

Псевдокод

Кріс уже написав a корисна стаття про псевдокод що я настійно рекомендую вам уважно прочитати.

Для всіх тих професіоналів, які вважають, що весь код рукописного вводу не здається вашою чашкою чаю, але все одно може бути цікаво, чи може він вам допомогти, тоді псевдокод може бути балансом, який ви шукаєте.

Це схоже на окреслення коду, як я згадував в одному з попередніх кроків. Однак він коротший і більше схожий на скорочене кодування. Іноді його також називають «скелетним кодом».

Ось короткий псевдокод для макета сітки CSS:

Grid
5 60px rows
6 100px columns

Нема чого писати! Тож, незважаючи на те, що олівець на папері чудово підходить для такого роду речей, настільки ж ефективно, швидко та недорого записати якийсь псевдокод у будь-яку програму, яку ви використовуєте.

Місце та коментарі

Я вважаю, що код складається з 90% ключових слів і 10% вкладок. Без пробілів читабельність слів зменшується. Відступи також необхідні для рукописного коду. Однак не використовуйте його для кожного рівня, оскільки ширина паперу обмежить вас. Використовуйте простори розумно, але використовуйте їх.

Жовтий нелінований папір із кодом, написаним від руки курсивом чорним чорнилом.
Цінний фрагмент OG, написаний з додатковим TLC

Якщо ви пишете код для власного використання, я також вважаю, що якщо ви виконали все, що я згадав досі, і вже записали свої результати та схему на сторінці, вам, можливо, навіть не потрібно буде включати коментарі. Коментарі швидко розкажуть, що робить наступний набір коду. Якщо ви вже написали та прочитали схему коду, то коментарі є зайвими примітками.

Однак, якщо ви вважаєте, що потрібно поставити один, то зробіть це. Додайте його в праву частину коду (оскільки ви не зможете вставити його між уже написаними рядками так, як ви могли б, скажімо, у VS Code). Використовуйте косі риски, дужки або стрілки, щоб позначити, що це коментарі.

Для випробуваних, які не впевнені в певному синтаксисі, запишіть коментарі. Таким чином, принаймні, ви даєте людині, яка оцінює вашу роботу, знати про ваші наміри за допомогою цього неправильно відформатованого коду. Використовуйте лише правильні розділювачі для позначення коментарів — наприклад, це були б косі риски для JavaScript.

Аналоговий та цифровий

Як я вже згадував раніше, все, що я тут можу, — це загальні поради щодо кодування. Якщо ви не хочете пробувати це з фізичним папером, будь-яка програма для створення нотаток також працює.

Але якщо ви збираєтеся спробувати цифровий шлях, я рекомендую спробувати щось інше, ніж звичайний додаток для нотаток. Працюйте з більш візуальними цифровими інструментами — блок-схемами, розумовими картами, каркасами тощо. Вони можуть допомогти вам візуалізувати ваш результат, контури та сам код.

Я не дуже цифровий громадянин (за винятком роботи в Інтернеті та нещодавнього переходу на читання електронних книг), тому я дотримуюся фізичних блокнотів.

Мої улюблені інструменти для рукописного коду

Підійде будь-який олівець і папір! Але є багато варіантів, і ось кілька інструментів вибору, які я використовую:

Не існує «написаного» способу кодування

Я сподіваюся, якщо нічого іншого, мій маленький спосіб рукописного написання коду олівцем і папером змусить вас оцінити те, як ви вже плануєте та пишете код. Мені подобається знати, як інші розробники підходять до своєї роботи, і це мій спосіб дати вам змогу зазирнути в те, як я роблю речі.

Знову ж таки, тут немає нічого наукового чи точного мистецтва. Але якщо ви хочете спробувати планування рукописного коду, ось усе, що ми висвітлили у гарному впорядкованому списку:

  1. Почніть із запису (за потреби із зразками даних) результату вашого коду.
  2. Напишіть схему для коду. Дотримуйтеся трьох кроків для невеликих або менш складних проектів.
  3. Використовуйте позначення від руки. Розробники, які пишуть для себе, можуть використовувати скорочені позначення, якщо написане є розбірливим і має сенс для вас, коли ви звертатиметеся до нього пізніше.
  4. У разі обмеження часу подумайте про те, щоб спочатку написати код, який вирішить суть проблеми. Пізніше запишіть виклик цього коду в потрібному місці вашого послідовного коду.
  5. Якщо ви відчуваєте впевненість, спробуйте написати псевдокод, що відповідає головній ідеї.
  6. Використовуйте правильні відступи та пробіли — і пам’ятайте про ширину паперу.

Це воно! Коли ви будете готові спробувати написати код вручну, я сподіваюся, що ця стаття допоможе вам легко почати. І якщо ви сідаєте на іспит чи співбесіду, я сподіваюся, це допоможе вам зосередитися на правильному отриманні запитань.

Часова мітка:

Більше від CSS-хитрощі