10 вещей, которые нужно изучить на пути к становлению мастером JavaScript

Я думаю, вы веб-разработчик. Надеюсь, у вас все хорошо, и у вас отличная работа, может быть, вы даже самозанятые или работаете фрилансером. Может быть, вы только начинаете как веб-разработчик, может быть, вы уже работаете программистом в течение более длительного периода времени. Как бы вам ни было удобно работать с JavaScript, всегда полезно освежить знания по некоторым темам. Вот 10 вещей, которые вам обязательно нужно изучить, прежде чем вы сможете назвать себя мастером в JavaScript.

1. Поток управления

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

  • if else — если вы не знаете их, как вы писали код раньше?
  • switch — это в основном if else, если еще более красноречиво, используйте его, как только у вас есть несколько разных случаев.
  • for — не повторяйтесь, для этого и существуют циклы.
  • Расширенные условия — использование тернарных и логических операторов может сделать вашу жизнь намного проще, особенно когда вы пытаетесь сделать вещи встроенными, а это означает, что вы не хотите сохранять значения, чтобы использовать их позже. Образец:
// ternary
console.log(new Date().getHours() < 12 ? 'Good Morning!' : 'Time for a siesta')

// logical operators
const isJsMaster = prompt('Are you a JavaScript master?') === 'true'
console.log(isJsMaster && 'proficient coder')

2. Обработка ошибок

Это заняло некоторое время для меня. Это не имеет значения, если вы работаете на фронтенде или бэкэнде, первый год или около того, вы, вероятно, по умолчанию console.log или, может быть, console.error для обработки ошибок. Чтобы написать хорошие приложения, вам определенно нужно изменить это и заменить свои ленивые отчеты красиво обработанными ошибками. Вы можете проверить, как построить свой собственный конструктор ошибок и как правильно их поймать, а также показать пользователю, в чем заключается настоящая проблема.

3. Модель данных

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

const calcShape = (width, height, depth, color, angle) => {...}
const calcShape = ({width, height, depth, color, angle}) => {...}

4. Асинхронность

Это очень важный аспект JavaScript: либо вы извлекаете данные из серверной части, либо асинхронно обрабатываете запросы в самой серверной части. Если вы понятия не имеете, что это такое, вы, вероятно, получите странную ошибку, которую вы попытаетесь исправить в течение нескольких часов. Если вы знаете, что это такое, но вы действительно не знаете, что с этим делать, вы окажетесь в callback-hell. Лучший подход — использовать обещания и / или async await в ваших приложениях.

5. Манипуляций с DOM

Это интересная тема. Обычно не часто встречается в повседневной жизни у разработчика. Может быть, вы изучили jQuery и никогда не чувствовали необходимости приобретать какие-то собственные навыки манипулирования DOM, может быть, вы просто используете фреймворк, где редко возникает необходимость в пользовательской манипуляции DOM. Тем не менее, я думаю, что это важная часть понимания JavaScript, по крайней мере, во фронтенде. Знание того, как работает DOM и как получить доступ к элементам, дает вам глубокое понимание того, как работают веб-сайты. Кроме того, будет момент, когда вам нужно будет сделать некоторые пользовательские манипуляции DOM, даже когда вы используете современные фреймворки frontend, и вы определенно не хотите помещать jQuery в свой package.json только для доступа к элементу.

6. Node.js / Express

Даже будучи frontend-разработчиком, вы должны знать основы node.js. В идеале, вы также знаете, как запустить простой экспресс-сервер и добавить некоторые маршруты или изменить существующие. JavaScript отлично подходит для написания сценариев, которые помогут вам автоматизировать множество задач. Поэтому, зная, как читать файлы, работать с путями файлов или буферами, вы получаете хороший набор инструментов для создания чего угодно.

7. Функциональный подход

Существует постоянная дискуссия о функциональном и объектно-ориентированном программировании. Вероятно, вы можете достичь того же с обоими подходами. В JavaScript это еще проще, у вас есть оба доступных подхода. Библиотеки, такие как lodash, дают вам действительно хорошую коллекцию инструментов для создания приложений с функциональным подходом. В настоящее время даже нет необходимости использовать внешние библиотеки. Многие из наиболее важных функций были реализованы в официальной спецификации JavaScript. Вы определенно должны знать, как использовать map `reduce` filter `forEach` и `find`.

8. Объектно-Ориентированный Подход

Подобно функциональному подходу, вы также должны ознакомиться с объектно-ориентированным JavaScript, если вы хотите освоить его. Я долгое время пренебрегал этой частью в своей карьере и просто работал над обходным путем, но иногда определенно лучше использовать объекты/классы и экземпляры для реализации конкретной функциональности. Классы широко используются в React, MobX или пользовательских конструкторах.

9. Фронтэнд фреймворки

Большая тройка React.jsAngular и Vue.js. Если вы ищете работу в настоящее время, вы почти всегда будете иметь один из тех, перечисленных в качестве предварительного условия. Даже если они меняются довольно быстро, важно понять их общую концепцию, чтобы понять, как работают приложения. Кроме того, так проще писать приложения. Если вы еще не решили, в какой поезд вы хотите сесть, то я рекомендую React.JS. Я работал с ним последние пару лет и не пожалел о своем решении.

10. Связывание / Транспиляция

К сожалению, это большая часть веб-разработки. С одной стороны, я рад, потому что это здорово, чтобы иметь возможность писать код со всеми новейшими функциями. С другой стороны, причина, почему я говорю об этом — мы всегда должны иметь в виду, что есть старые браузеры, которые не могут поддерживать эти функции, поэтому мы должны перенести наш код в нечто другое, что старые браузеры понимают. Если вы работаете с Node.JS, вы, вероятно, часто имеете дело с транспиляцией кода. Стандартом де-факто для транспиляции является babel.js, так что ознакомьтесь с ним.

Источник: 10 things to learn on the way to becoming a JavaScript Master