От учителя к разработчику — Часть 2

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

Читая эту серию, вы быстро заметите, что я начну с ресурсов. Мой учебный путь, и тот, который я помогаю вам провести, включает в себя МНОГО информации. Лично мне нравится иметь много вариантов для моих трех ежедневных занятий: изучение новых концепций, практика JavaScript и чтение о JavaScript. Таким образом, я буду продолжать сбрасывать самородки по мере их нахождения. Кстати, в прошлый раз, когда я упоминал о чтении здесь, на Medium, хорошим общим ресурсом является публикация JavaScript in Plain English, я нашел ее невероятно полезной в качестве отправной точки для моего чтения на Medium.

Новая концепция: гибкая структура

ПРИМЕЧАНИЕ. Этот раздел не предназначен для обучения вас JavaScript. Скорее, это должно быть использовано в качестве компаньона для вашего обучения. Вам нужно будет использовать другие ресурсы для углубленного обсуждения этих тем. Для этого я использую Rhino book и этот курс Udemy.

Самые основные понятия для изучения любого языка, программирования или иного, — это лексическая структура этого языка (глава 2 в книге Rhino). Это относится к основным строительным блокам языка. Если бы я писал статью об английском языке, я мог бы обсудить алфавит, числа, основные знаки препинания, типы доступных слов и их соответствующие функции (существительное, глагол, прилагательное, наречие, местоимение и т. д.). По сути, лексические структуры — это основа, на которой строится любая коммуникационная система. Поскольку язык программирования — это не что иное, как система общения между человеком и компьютером, параллелей здесь много.

В JavaScript речь идет о специфике регистра, комментариев, литералов, идентификаторов/зарезервированных слов, точек с запятой и типов данных (типы данных получают свою статью ). Дело играет огромную роль во всем, поэтому важно сначала покрыть его. Язык JavaScript чувствителен к регистру. Это означает, что то, как мы пишем наш код, будет столь же важным (а в некоторых случаях и более важным), чем то, что мы пишем.

Дело

Когда мы обсуждаем регистр, на самом деле мы говорим о капитализации и отступах. Интервал играет роль, прежде всего, в удобочитаемости, что, безусловно, важно, но то, что/где используются заглавные буквы, а также то, как отступы, могут значительно изменить функциональность программы JavaScript. Идея регистра еще больше затемняется, потому что часто существует разница между тем, что вы вводите, и тем, что отображает IDE (интегрированная среда разработки, такая как VScode).

В основном, большинство предметов написано верблюжьим регистром. Фактически это означает, что когда мы пишем сложные слова для имен переменных, функций, методов и т. д. (подробнее обо всем этом позже), мы пишем все слова, кроме первого слова, с большой буквы. Например, если бы мне нужно было отслеживать результаты двух команд под названием «Селтикс» и «Буллз», я бы написал имена переменных следующим образом:

Let celticsScore = 0;
Let bullsScore = 0;

Единственное исключение, о котором я знаю, относится к константе, которая никогда не меняет значение (это не следует путать с объявлением const, о котором я расскажу в одной из следующих статей). В случае константы, которая всегда постоянна, например, количества четвертей в баскетбольном матче, я бы написал ее заглавными буквами следующим образом:

const QUARTERS = 4;

Отступ в сочетании с фигурными скобками «{}» — это то, как мы сообщаем интерпретатору, что данная структура (известная как «блок» в JavaScript) предназначена для выполнения внутри другой структуры («блок» ). Например, если бы я написал логическое выражение, я хотел бы указать интерпретатору JavaScript применить код, полученный из логического выражения, вот пример:

if (bullsScore > celticsScore){
      console.log('The Chicago Bulls Win!');
}else console.log('The Boston Celtics Win!');

Я хочу сказать, что если «Чикаго Буллз» набирают больше очков, чем «Бостон Селтикс», я хочу напечатать первую фразу, в противном случае я хочу напечатать вторую фразу. В этом фрагменте есть нечто большее, чем отступы, и мы поговорим об этом в другой раз, а пока достаточно сказать, что фигурные скобки и отступы имеют решающее значение для успеха в JavaScript.

Комментирование

Далее следует идея комментирования вашего кода. Важно отметить, что комментирование в учебной среде (во время обучения) и комментирование в производственной среде (во время профессионального кодирования) — это две разные вещи. Как я упоминал в своей первой статье из серии, во время обучения вы должны резко все комментировать.

Это означает, что вы должны подробно описывать каждую функцию, должны комментировать каждый блок и объяснять, как различные шаблоны и структуры (фрагменты кода) работают как логически (что они должны делать), так и процедурно (как они сочетаются). в программу). Помните, что вы работаете над беглостью, и повторение является ключевым моментом. Только после того, как вы полностью усвоили данное понятие, вы должны перестать его объяснять.

Однако в производственной среде вы должны комментировать только там, где это необходимо. Предположим, что вы разговариваете со следующим программистом, чтобы посмотреть на ваш код. Что именно это означает, лучше описано в книге Чистый код, но вы должны прокомментировать ровно столько, чтобы кто-то с таким же или большим знанием языка понял все, что не очевидно. Тем не менее, лексически в JavaScript мы комментируем несколькими способами:

//This is a single line comment

Однострочные комментарии обычно используются для описания того, что происходит непосредственно ПОД комментарием. Однако их также можно использовать, если у вас есть очень короткий комментарий в конце строки, например:

const mayTheForceBeWithYou = 'and also with you';//Short Comment

JavaScript также поддерживает многострочные комментарии.

/*
This is a multi line comment. I would use this any time I need to describe something that will take up several lines in my program such as the description of a function, the removal of a code block after refactoring (more on this later), or if I am using one script file (again more on this later) to learn several different concepts that are in the same general vein.
*/

Многострочный шаблон также полезен для комментирования ВНУТРИ строки. В JavaScript есть блоки, которые интерпретатор воспринимает как одну строку кода. Иногда (особенно во время обучения) я хочу описать, что происходит внутри данной строки кода. Для этого я буду использовать шаблон многострочного комментария немного иначе:

const funString = `I might also use the multi line comment pattern to describe something in the middle of an element like a Template Literal (more on this later) to describe a variable like this ${bullsScore /*This will be ignored by the interpreter*/}`;

Еще одна вещь, которую вы можете сделать, это использовать однострочный комментарий, чтобы сделать многострочный комментарий, и это нормально. Причина, по которой я это делаю, — скорость. Мои навыки набора текста далеко не выдающиеся, поэтому ввод «/*» занимает чуть больше времени, чем ввод «//». Это дело личного стиля, и пока мои навыки набора текста не улучшатся (что, возможно, им понадобится), я буду продолжать этим заниматься. Вот о чем я говорю:

//This is also a multi line comment where I am using the double
//slash pattern for each line even though I could be using the slash 
//asterisk pattern. It is effectively doing the same thing, but for
//my personal taste it is both easier to type and easier to read

Литералы, идентификаторы, зарезервированные слова и точка с запятой

Литеральное значение относится ко всему, что появляется в программе так, как оно написано. В JavaScript литералы – это буквы, числа, строки текста, логические значения (true и false), а также "null". Мы более подробно остановимся на литералах и, в частности, на логических значениях и нулевых значениях в следующей статье, но сейчас наиболее важно думать о литералах как о простых или примитивных (подробнее о примитивах позже). Полный список литералов есть в Книге носорогов в главе 3, а также более полное их описание.

Идентификатор — это имя. По сути, это структура, описывающая что-то вроде константы, переменной, свойства, функции, класса или метода (подробнее об этом позже). В JavaScript есть некоторые правила относительно структуры идентификаторов. Во-первых, они могут начинаться только с буквы, символа подчеркивания (_) или знака доллара ($). После первого символа они могут содержать буквы, цифры, символы подчеркивания или знаки доллара. Они не могут содержать пробелы или любые другие символы. Зарезервированные слова – это определенные слова, которые либо используются JavaScript для определенных действий (например, "если"), либо не используются, поскольку могут использоваться в будущих версиях языка. Полный список можно посмотреть в Книге Rhino или на Странице разработчика Mozilla.

Точка с запятой (";") в JavaScript используется так же, как точка (".") в английском языке, чтобы сигнализировать интерпретатору о том, что данный оператор закончился. В современном JavaScript точка с запятой технически необязательна. В большинстве случаев либо ваш интерпретатор, либо ваша среда разработки поймут, что вы имеете в виду. Тем не менее, использование точки с запятой по-прежнему является хорошей практикой. В старые времена неуместная точка с запятой могла сорвать всю вашу программу, и это в значительной степени пошло по пути буйвола, но бывают случаи, когда отсутствие точки с запятой приводит к трудно отслеживаемой ошибке в вашем коде. Более подробное объяснение смотрите в Книге о носорогах, подождите, пока оно не появится в Удеми-классе, или выполните быстрый поиск в Интернете. Для нашей цели научиться писать хороший, чистый код я рекомендую использовать его всегда.

Заключение

Если рассматривать наше путешествие по изучению JavaScript как метафору строительства дома, то моей первой статьей была расчистка земли, а этой — рытье ямы для фундамента. В этой статье я попытался поделиться своими первыми шагами в изучении JavaScript. Важно отметить, что я не профессиональный веб-разработчик. Я также не эксперт по JavaScript. Я учусь точно так же, как вы были или есть. Я могу ошибаться. Если я делаю ошибку, это происходит исключительно из-за моего неполного понимания, и я рад получить инструкции.

Мой прогресс на момент написания этой статьи: Я изучаю Раздел 11 — Подраздел 159 Курса Udemy. Я прочитал главу 3 в Книге о носорогах. Я прошел главу 1 в Книге чистых кодов. У меня 365 очков опыта в Эдабит. Я на 2% прошел путь веб-разработки и на 6% прошел путь SQL на Mimo, и у меня есть 32 статьи в моем списке чтения JavaScript Gold здесь, на Medium.

Спасибо за прочтение.

Майкл Томпсон — профессиональный преподаватель технологий, имеющий лицензию на преподавание K-12 в Нью-Гэмпшире. Когда он не изучает программирование, не преподает программирование и не спит, он проводит время, будучи мужем и отцом, в идеале где-нибудь в глуши. Вы можете найти больше его работ на сайтах TheRangerOfDarkhollow и SuperStarStem.