С чего начать изучение JavaScript и как это делать эффективно
JavaScript (JS) — это многофункциональный язык программирования. В основном разработчики используют этот язык в вебе. По данным рейтинга W3Techs на сентябрь 2022 года, на JavaScript работает 98% всех сайтов.
JS, наравне с HTML и CSS, используется в создании веб-страниц. С его помощью фронтенд-разработчики придают веб-страницам интерактивность: добавляют различные слайдеры, плашки, кнопки, анимации и тем самым делают сайты удобнее для пользователей.
В бэкенд-разработке программисты с помощью JavaScript создают серверные приложения на базе программной платформы Node.js. Данные об активности пользователя на сайте, файлы, которыми он делится, отправляемые запросы — все это делается на JavaScript.
Кроме того, JavaScript используют в этих областях программирования:
- Мобильная разработка
- Разработка игр
- DevOps
- Машинное обучение
- Базы данных
С чего начать изучать JavaScript
Будьте готовы к тому, что начало изучения JavaScript — трудный этап. JS далеко не самый простой язык для изучения из-за сложного синтаксиса, хотя его правила все же легче, чем у C-подобных языков вроде Java или C++. Чтобы в будущем вам было легче кодить на JS, нужно грамотно подойти к составлению программы своего обучения.
JavaScript — самый популярный язык среди разработчиков в 2022 году по версии исследования GitHub, база знаний у него очень большая. Важно в ней не теряться. Давайте разберемся, как начать изучать JavaScript с нуля и не запутаться в обилии информации.
Читайте также: Стоит ли учить JavaScript: перспективы, ситуация на рынке труда, мнения экспертов
Составьте план обучения
Для начала определитесь, когда вы будете заниматься и как долго. Осознание четких временных границ поможет вам не перерабатывать до усталости и выгорания, но дисциплинирует.
Изучите основы языка
- Лексика, синтаксис и семантика — то, без чего вы не освоите ни один язык программирования. На этом этапе вы должны понять, в какой последовательности давать компьютеру инструкции, как выводить информацию на экран и писать простейшие программы на языке JavaScript.
- Типы данных: что такое числа, строки, в чем разница между null и undefined.
- Операторы. Здесь нужно узнать, какие бывают операции и чем они отличаются от операторов, как складывать, вычитать, умножать и делить числа на JS, и в каком приоритете это выполняет программа.
- Переменные: что это такое, зачем они нужны, как изменять переменные и именовать их, как использовать.
- Функции: зачем их используют разработчики, какие бывают функции, что такое их сигнатура, что такое чистая функция и какие у нее особенности.
- Условные конструкции: как строить условия, как выполняется код в зависимости от условия и как строятся сложные условные конструкции.
- Методы, объекты и свойства: в чем особенность каждого понятия, что такое объекты и структуры данных.
- Циклы: для чего они нужны, как их задавать.
Изучить основы языка вам поможет бесплатный курс «JavaScript для начинающих» на проекте Codebasics. Обучение там начинается с азов, информация структурирована и подается от простого к сложному.
В дополнение изучите документацию MDN JS. Это хороший вспомогательный инструмент, который поможет вам разобраться с основами. Для многих разработчиков документация MDN — как настольная книга.
Изучите HTML и CSS
Так как чаще всего разработчики используют JavaScript для работы с элементами веб-сайтов, вам нужно освоить HTML и CSS. Знание этих инструментов значительно облегчит вам дальнейшую работу с кодом на JS.
Лучше всего изучать HTML и CSS параллельно с основами JS. Но здесь важно не переусердствовать и не запутаться в обилии информации. Если вы чувствуете, что в голове появляется «каша» из разных понятий, отложите изучение HTML и CSS и дайте знаниям время для усвоения. Занимайтесь в удобном для вас режиме.
Установите и настройте редактор кода
Кодить на JavaScript можно и в простом «Блокноте». Но программисты практически не пользуются им в повседневной практике — возможности этого редактора очень ограничены. Для полноценной работы на JavaScript лучше выбирать редакторы с более широким функционалом.
Вот примеры нескольких редакторов кода с настраиваемым интерфейсом, подсветкой синтаксиса и удобной навигацией:
- Visual Studio Code — редактор со встроенным дебаггером, Git-командами для работы с системой управления версий GitHub.
- Sublime Text — редактор с горячими клавишами, автосохранением, автодополнением.
- WebStorm — редактор, который обеспечивает автодополнение, навигацию по коду, рефакторинг и отладку. Он платный, но очень популярный среди разработчиков.
О том, как настроить редакторы кода на JS, можно почитать в гайдах Хекслета.
Пробуйте кодить
Установив редактор, как можно больше практикуйтесь. Начинайте с малого, не пытайтесь сразу применить все полученные знания и составлять сложные программы самостоятельно.
Зайдите на GitHub и найдите там открытый код на языке JS. Выберите из него самый привлекательный для вас фрагмент, скопируйте его и откройте у себя в редакторе. Изучите код, проанализируйте, почему он написан именно в таком порядке, за что отвечает каждая строка. Это хорошая практика, которая вырабатывает насмотренность и структурирует знания.
Найдите в интернете каталог плагинов для JavaScript. Выберите что-то простое, вроде слайдеров, плашек, каруселей и попытайтесь улучшить их код у себя в редакторе. Хорошее упражнение, которое научит вас, как писать JavaScript-код за счет использования сложных языковых конструкций.
Углубите свои знания
По мере вашего развития в программировании вам нужно будет познакомиться с этими понятиями языка JavaScript:
- Асинхронность и событийная модель
- BOM и DOM-дерево
- Объекты, классы, основы ООП
- Фреймворки React, Redux Toolkit и многое другое.
Изучить эти аспекты языка в одиночку будет трудно и не быстро. На этом этапе советуем вам найти себе комьюнити таких же начинающих JS-разработчиков, ментора или обучающие курсы.
Читайте также: Как джуну найти работу и где лучше начинать карьеру в IT: советы от Хекслета
Сколько времени нужно, чтобы выучить JavaScript
Скорость обучения у всех разная. Но в среднем начинающие программисты, которые изучают JavaScript и практикуются около 10 часов в неделю, могут претендовать на позицию Junior JavaScript-разработчика через 10-12 месяцев.
Как эффективно учить JavaScript
Изучайте дополнительные материалы
Читайте обучающие статьи на Хабре, учебники, смотрите видеоуроки на YouTube. Найдите комьюнити или присоединяйтесь к Хекслет Комьюнити в Slack, чтобы обсуждать свой прогресс в обучении, получать помощь и поддержку.
Есть много хороших книг по изучению JavaScript. Будет здорово, если вы прочитаете некоторые из них:
- Дэвид Флэнаган «JavaScript. Подробное руководство»
- Дуглас Крокфорд «Как устроен JavaScript»
- Алексей Васильев «JavaScript в примерах и задачах»
У Хекслета есть свой список рекомендованной литературы. Ознакомьтесь с этими книгами — они полезны для программистов любых направлений.
Соревнуйтесь на Codebattle
Codebattle — это платформа, на которой разработчики разных уровней и специализаций могут соревноваться в скорости написания кода или решать задачки по программированию.
Codebattle особенно полезен новичкам, потому что он:
- Прокачивает алгоритмическое мышление
- Знакомит с интересными и нестандартными задачами
- Дает полезные связи с разработчиками
- Помогает достичь минимального уровня, который требуется для прохождения собеседований
- Вносит в обучение элемент игры, что помогает лучше запоминать новую информацию.
Каждый месяц Хекслет проводит турниры на Codebattle. Чтобы принять участие, нужно зарегистрироваться на сайте. Если вы не хотите участвовать в турнирах, то можете при регистрации выбрать режим дуэлей и упражняться в кодинге с ботом или другом.
Если у вас появятся вопросы по кодингу на Codebattle, не стесняйтесь задавать их разработчикам напрямую. Это можно сделать в каналах по Codebattle в Хекслет Комьюнити. Чаще упражняйтесь в кодинге, постоянно прокачивайте свои знания и у вас все получится!
Никогда не останавливайтесь: В программировании говорят, что нужно постоянно учиться даже для того, чтобы просто находиться на месте. Развивайтесь с нами — на Хекслете есть сотни курсов по разработке на разных языках и технологиях
За какое время можно изучить javascript?
Ха-ха. давно так не смеялся 🙂 Если коротко: angular.js + gulp = 1-2 недели. JavaScript (семантика, наследование, замыкания, а-ля классы и т.д.) две недели. Node.js + mongoDb — 1 или 2 месяца.
Отдельно хочу сказать по поводу работы с графикой и прочими вещами. Здесь важнее не сам язык, не знание canvas и svg, а знания в области математики, знание геймдева в целом и т.д.
Сам язык программирования, семантику и прочее. Работу с памятью, событийное программирование и прочим можно изучить за недельки 2. Ну подводные камни — еще пару недель, и то зависит от того клиентская разработка или серверная.
Другое дело, что в основном надо знать популярные библиотеки для этого языка.
На изучение того же Angular потребуется времени даже больше, а есть например серверные: Express, Mongoose..
Сам язык быстро, но дело не в нём 🙂
- Вконтакте
За Недельки 2.
я уже месяц учу JS начиная с основ. И дошел только до методов и свойств. До сих пор остаются не частично не понятными функции и циклы, и рекурсии.
и Это только начало, как говорится «детская часть»
Для того, чтобы что-то понять нужно читать статью по 4- 6 раз.
Сколько времени занимает обучение JavaScript
Один из самых распространенных вопросов, которые мне задают начинающие программисты, — сколько времени нужно на изучение JavaScript. Конечно тебе стоит разобраться, сколько времени у займет обучение, прежде чем ты сможешь самостояетельно создавать JavaScript проекты и претендовать на роль разработчика программного обеспечения.
Я расскажу тебе почему у некоторых новичков уходит так много времени, чтобы изучить основы JavaScript и что больше всего влияет на скорость обучения. Также я дам тебе несколько советов и предложений, которые помогут тебе изучить JS немного быстрее.
Итак, давай начнем с ответа на самый распространенный вопрос:
Сколько времени нужно, чтобы выучить JavaScript?
Короткий ответ — один год.
Тебе понадобится как минимум один год, чтобы выучить JavaScript от начинающего до готового к работе Junior программиста.
Эти 12 месяцев можно разделить на четыре этапа обучения.
Если у тебя есть талант и много свободного времени, возможно ты справишься быстрее. Но в любом случае, все программисты проходят через эти 4 этапа.
Новичок (1-3 месяца)
На этом этапе ты только начинаешь изучать JavaScript и знакомишься с синтаксисом языка.
В первые недели твоё внимание будет сосредоточено на основных концепциях JavaScript, таких, как переменные, функции и типы данных.
Многое будет казаться странным и непонятным, но это нормально, поскольку эти концепции начнут приобретать для тебя смысл в ближайшие месяцы.
Основная цель на этом этапе — познакомиться с синтаксисом JavaScript, принципами работы языка программирования и создать небольшие программы, чтобы научиться писать код JS.
Продвинутый новичок (4-6 месяцев)
К четвертому месяцу ты должен быть знаком с основными концепциями и механизмами JavaScript.
Ты сможешь использовать JS для создания консольных программ и возможно начнешь разбираться с тем как добавлять его на веб страницы.
С этого момента твоя главная цель — применять полученные знания на практике.
Средний уровень (7-9 месяцев)
На этом этапе ты больше не новичок — теперь ты понимаешь основные концепции JavaScript и начинаешь работать над углублением знаний.
Возможно, тебе все равно придется время от времени обращаться к некоторым руководствам и лекциям, но большую часть времени ты будешь проводить за написанием кода, поскольку именно здесь происходит настоящее обучение.
Продвинутый средний уровень (10 — 12 месяцев)
На этом последнем этапе вы теперь должны иметь возможность писать Full-Stack проекты на JavaScript, читать и понимать код, а также знать, как исправлять ошибки.
После завершения этого этапа ты будешь готов к работе Junior JavaScript разработчиком.
Почему изучение JavaScript занимает так много времени?
Причину, по которой обучение занимает так много времени, можно разделить на две:
- HTML и CSS не являются языками программирования
- JavaScript не интуитивно понятен
HTML и CSS не являются языками программирования
Изучение JavaScript сильно отличается от HTML и CSS. И HTML, и CSS технически не являются языками программирования, поскольку не содержат логики программирования. У HTML/CSS довольно простой синтаксис и низкая кривая обучения, выучить их довольно легко, и ты можешь стать достаточно опытным после нескольких месяцев усердной практики.
Однако это не относится к JavaScript. JavaScript — настоящий язык программирования, и он содержит логику программирования, что означает, что он требует много размышлений и выяснения того, как правильно выполнять программу.
Неудивительно, что помимо наличия различных методов и длительного обучения по сравнению с HTML и CSS, многим новичкам сложно изучать JavaScript.
JavaScript НЕ интуитивно понятен для начинающих
Еще одна проблема с изучением JavaScript заключается в том, что он не интуитивно понятен.
В HTML все зависит от того, какие теги использовать. CSS просто выясняет, какие теги выбрать, и изменяет стиль. Если ты выучил эти правила, ты готов к работе с HTML и CSS.
Что касается JavaScript, в нем так много правил, и, кроме того, тебе нужно потратить время на размышления о том, как ты собираешься создать что-то на JavaScript, прежде чем даже писать одну строку кода! Вот почему требуется 3-6 месяцев, чтобы узнать все его правила, прежде чем он сможет полностью раскрыть свой потенциал.
Факторы, влияющие на время, необходимое для изучения JavaScript
Время уделенное практическим занятиям
Первое, что влияет на общее время, необходимое для изучения JavaScript, — это то, сколько времени ты готов тратить на практику. Если ты тратишь от 30 минут до 1 часа в день на написание кода и никогда не пропускаешь занятия, то за год твой прогресс будет очевиден.
С другой стороны, если ты тратишь на практические занятия всего несколько часов в месяц, будет сложно выучить JavaScript быстро, потому что большая часть того, чему вы научились, будет забыта через неделю.
Это похоже на обучение вождению автомобиля — ты не можешь рассчитывать стать хорошим водителем быстро, если практикуешься всего пару раз в месяц.
Предыдущие знания программирования
Второй фактор — это предварительное знание программирования. Если ты посещал курсы информатики или разработки программного обеспечения в школе или институте, то изучение JavaScript может занять меньше времени, поскольку ты уже знаком с фундаментальными концепциями программирования.
Однако для разработчиков-самоучек это займет чуть больше времени, поскольку тебе нужно будет усвоить фундаментальные концепции программирования. Это не то же самое, что изучение языка программирования, но эти концепции настолько важны, что ты не можешь позволить себе пропустить этот шаг.
Как вы изучаете JavaScript
Третий фактор — это то, как ты подходишь к изучению JavaScript. Если ты тратишь значительное количество времени на обучение, создавая множество небольших проектов, то ты прогрессируешь, поскольку программирование — это навык.
Как и в случае любых других навыков, единственный способ стать лучше — это практика, практика и еще раз практика. А это значит, что нужно писать больше кода.
Некоторые начинающие замечают, что они перестали прогрессировать, хотя смотрят одно обучающее видео за другим и много времени тратят на чтение книг.
Но без практики, без ежедневного написания кода, ты просто провалишься в так называемый адом учебников (tutorial hell), который довольно часто встречается у новичков.
Сколько времени нужно учить JavaScript
Очень краткий ответ: в среднем нужно 6 месяцев. А теперь подробнее.
Cтатистика за 3 года преподавания
Я занимаюсь преподаванием математики и программирования более десяти лет, но для статистики я взял данные с 1 января 2019 года по 31 декабря 2021 года. За это время я провел примерно 2900 занятий (чуть более 4000 часов). Я продолжаю преподавать, сейчас статистика примерно такая же.
Всего обратилось 182 человека. Из статистики убираем длинный хвост тех, кто занимался меньше 5 занятий. Как правило, это экспресс-подготовка к собеседованиям, консультации по рабочим задачам и те, кому не подошел формат занятий. Остается ровно 100 человек.
100 человек — с кем мы провели хотя бы 5 занятий за последние 3 года
Про каждого ученика я знаю, сколько и когда мы занимались, потому что веду календарь. Я отсортировал учеников по дате первого занятия и посчитал количество занятий.
Квадратики по горизонтали — недели, в которые были занятия. Желтый — одно занятие, оранжевый — два, красный — три или больше. Самый левый столбец — первая неделя 2019 года, самый правый — последняя неделя 2021 года. Показаны только ученики, с которыми было хотя бы 10 занятий (72 человека).
Среднее количество — 27 занятий, медианное 17 занятий
В среднем люди занимаются 27 недель. Это примерно половина от 52 — столько недель в году. То есть выходит, что в среднем люди занимаются полгода. На что уходит это время? Примерно 3 месяца на JavaScript, месяц на CSS и 2 месяца на React. Можно заниматься дальше — TypeScript, NodeJS, алгоритмы — это займет еще несколько месяцев, многие продолжают.
11 человек занимались более 60 раз. Это значит, что скорее всего они брали 2 занятия в неделю. Так дело идет быстрее, но не в 2 раза быстрее 🙂 Системность гораздо важнее количества занятий. Гораздо полезнее заниматься один раз в неделю, а в остальные дни ежедневно тратить по 1 часу на домашние задания, чем заниматься 3 раза в неделю, но не заниматься самостоятельно.
Не очень важно, какая длительность одного занятия. Можно брать 1.5 часа или 1 час. Важнее, как вы к занятию готовитесь. Но, как правило, одного часа раз в неделю мало, мы, скорее всего, не успеем разобрать всё домашнее задание. Рекомендую брать 1.5 часа раз неделю или 2 раза по часу.
Есть буквально два успешных примера, когда люди брали одно занятие раз в две недели. На графике выше это характерные пунктирные линии 🙂 По факту провели 26 и 20 занятий (сравните со средним — 27 занятий), но растянули почти на год. Я рекомендую заниматься хотя бы раз в неделю, но всегда подстраиваюсь под пожелания ученика.
Зарплата джуниор-разработчика — от 60 до 160 тысяч (опять же статистика по моим ученикам с 2019 по 2021 год). Среднее количество занятий × стоимость одного занятия все еще меньше одной зарплаты фронтенд-разработчика. Инвестиция в образование отобьется в первый месяц, но для этого вы действительно должны хотеть научиться программированию.
Сколько занятий в неделю я провожу
Ограничивать количество учеников непрактично. Кому-то понятна одна тема, кому-то другая. Если будет два-три ученика, то сложно сделать общие выводы и непонятно, на чем делать акцент на занятиях. Но если все массово не понимают конкретный раздел, то стоит подобрать больше задач, изменить способ объяснения или переставить какие-то темы.
Еще бывает, что какой-то ученик не понимает объяснение. В этом случае можно решить, что ты плохой преподаватель. Но если все остальные нормально с этой темой справляются, то дело не в тебе 🙂
Ниже график количества часов занятий по неделям, оранжевая линия — среднее за 4 недели.
- В самом жарком 2020 году я чуть больше 1800 часов занятий. В среднем 25 учеников или 34 часа в неделю. Отсюда, кстати, легко посчитать, что в среднем на 18 полуторачасовых занятий приходится 7 часовых.
Единственный очевидный провал на графике — в марте 2021 года. Тогда я потерял голос и не мог заниматься. За три года это был единственный случай отмены занятий с моей стороны.
Мой абсолютный рекорд — 62 часа в неделю, это возможно в майские праздники, когда много выходных. В новогодние праздники выходных больше, но ученики любят отдыхать.
Я провел очень много уроков. Мои тестовые приложения на реакте и задачи по джаваскрипту прорешали десятки людей — и им помогло. Приходите, поможет и вам 🙂
Учу фронтенду как профессии
Обучаю веб-программированию с целью трудоустройства. Готовлю к позиции Junior Frontend Developer: изучаем верстку, Javascript и React, решаем тестовые с собеседований и пишем проект.