Найти в Дзене
Result University

Как новичку выучить JavaScript: с чего начать и какими методиками пользоваться

JavaScript входит в топ-3 языков программирования по популярности. В интернете вы встречаетесь с ним каждый день: кнопки, анимация, галереи. Кроме сайтов, JS нужен разработчикам мобильных приложений. Даже бытовой технике и коммерческому оборудованию пригодится JS-код. Платежные терминалы, ТВ-приставки и умные пылесосы работают благодаря JS. Его можно освоить быстро и без опыта. Выбрать цель Идеального 100% алгоритма не существует. Но в любом случае сначала определитесь с конечной целью. Она зависит от того, чем вы хотите заниматься: frontend или backend. Если первое, то вам не придётся много работать с серверной частью, а если второе – наоборот. Наш план содержит советы для новичков и поможет освоить азы. Заложить основы Как у любого человеческого языка, у языка программирования есть лексика, синтаксис и семантика. Это правила, по которым работает язык. Иногда написание кода сравнивают с сочинением сценария фильма, и это очень хорошая метафора. Сначала человек просто учится складывать
Оглавление

JavaScript входит в топ-3 языков программирования по популярности. В интернете вы встречаетесь с ним каждый день: кнопки, анимация, галереи. Кроме сайтов, JS нужен разработчикам мобильных приложений. Даже бытовой технике и коммерческому оборудованию пригодится JS-код. Платежные терминалы, ТВ-приставки и умные пылесосы работают благодаря JS. Его можно освоить быстро и без опыта.

Выбрать цель

Идеального 100% алгоритма не существует. Но в любом случае сначала определитесь с конечной целью. Она зависит от того, чем вы хотите заниматься: frontend или backend. Если первое, то вам не придётся много работать с серверной частью, а если второе – наоборот. Наш план содержит советы для новичков и поможет освоить азы.

Заложить основы

Как у любого человеческого языка, у языка программирования есть лексика, синтаксис и семантика. Это правила, по которым работает язык. Иногда написание кода сравнивают с сочинением сценария фильма, и это очень хорошая метафора. Сначала человек просто учится складывать слова в предложения, а потом украшает юмором или эпитетами.

С кодом всё точно также: сначала базовые правила, потом сложные надстройки. Рекомендуем двигаться так:

  1. Структура кода и синтаксис: как составить программу, в какой последовательности задавать команды
  2. Переменные: что это, для чего нужны, как задаются и как используются
  3. Типы данных: какие бывают данные (число, строка, логический тип и другие), какие существуют особенности, как преобразуются
  4. Операторы: какие бывают (математические, условные, логические), как произвести сложение, вычитание или сравнение, какой приоритет у операций
  5. Ветвление: условный оператор, несколько вариантов событий
  6. Циклы: что это такое, для чего нужны циклы, как задавать
  7. Функции (Function declaration & Function expression): что это, зачем нужны, как задавать, стрелочные функции, что такое контекст (ключевое слово this), методы привязки контекста (bind, call, apply), что такое чистая функция и какие у них особенности
  8. Объекты и их свойства: объект как структура данных хеш таблица

Одновременно с этим или раньше нужно освоить основы HTML и CSS — язык разметки и стиля веб-страниц. Чаще всего JavaScript используется именно для работы с элементами веб-страниц. Без HTML и CSS вам будет трудно перейти от теории к практике.

Перейти на ступень выше

Разобрались с основами, пощупали JS — пора двигаться дальше. Изменяем веб-страницу, разбираемся в её глобальном устройстве.

Как двигаться в этом разделе:

  1. DOM-дерево: из чего состоит, как изменять и получать данные
  2. Прототипы и наследование: наследование прототипов, что такое __proto__
  3. Классы + ООП: ES6 классы, основы ООП (инкапсуляция, полиморфизм, наследование)
  4. Промисы и async/await: асинхронный код
  5. Fetch API / XHR: как асинхронно получить данные с сервера
  6. Концепции JavaScript: без чего нельзя обойтись разработчику

— Hoisting
— Event Bubbling
— Scope
— Closures (замыкания)
— Shadow DOM
— Strict Mode (строгий режим)
— Event Loop

Также рекомендуем ознакомиться с Node.js. Благодаря нему мы можем запускать JavaScript не только в браузере, но и, например, на сервере.

Изучить полезные инструменты

Теперь переходим к изучению инструментов. Когда вы хотите покататься на самокате, вы не изобретаете его с нуля от чертежа до сборки. Вы берете готовый. Аналогично поступайте с кодом. Используйте библиотеки, плагины и фреймворки для того, чтобы не писать код, который уже за вас написали.

Советуем разобраться в следующих технологиях:

  1. Vue / React / Angular / Svelte
  2. Gulp
  3. Webpack

Практиковаться после каждой новой темы

Нельзя стать программистом только в теории. Львиная доля обучения приходится на практику. Как только изучили новую тему — сразу закрепляйте. Если смотрите видеоурок, то ставьте лектора на паузу и пробуйте написать код самостоятельно.

Любите творчество — придумайте сами себе задачу и решайте. Например, доработайте чужой скрипт. Создайте свой сайт и добавляйте на него разные функции — соберётся основа для портфолио. Или загляните в учебники, ответьте на простые вопросы.

Читать книги

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

Рекомендуем новичку начать с книг:

  • Грокаем алгоритмы
  • You don’t know JS
  • Выразительный JavaScript
  • Learn JavaScript Ru

Записаться на курс

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

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

👉
Обратите внимание на курс «Junior Frontend Developer». На этом курсе вы разберётесь в JavaScript, освоите самые актуальные технологии для работы, научитесь писать Front End на фреймворке и связывать с Back End.

Итоги

Язык JavaScript — популярный и интересный. Новичок может освоить его за несколько месяцев. Рекомендуем придерживаться алгоритма:

💡 Разобраться с HTML и CSS, освоить азы JS

💡 Изучать библиотеки и фреймворки

💡 Практиковаться

💡 Читать книги

Понравилась статья — ставьте лайк, делитесь с друзьями. Подписывайтесь на канал, чтобы не пропустить новые интересные публикации. В комментариях поделитесь, какой у вас опыт в изучении JavaScript.

📌
Хотите попробовать себя в роли программиста? Залетайте на бесплатный курс для начинающих «HTML & CSS за 2 недели»

Курс для тех, кто делает свои первые шаги в IT и хочет попробовать себя в роли программиста. Вы заходите на курс и ничего не знаете про веб, через 4 часа вы выкладываете свой первый сайт на хостинг.

Ссылка на курс 👇
https://bit.ly/3MLoxoG