Ежегодный опрос разработчиков Stack Overflow 2023 года показывает, что JavaScript является правящим королем языков программирования среди разработчиков. Учитывая, что в опросе приняли участие более 90 000 разработчиков, а также непреходящая популярность JavaScript на протяжении почти десяти лет, нельзя отрицать, что этот язык обладает уникальной привлекательностью как для опытных, так и для начинающих разработчиков.
(https://survey.stackoverflow.co/2023/#education-ed-level-prof)
Взгляд в историю:
История JavaScript восходит к Mocha, созданию Брендана Эйха в 1995 году, когда он работал в Netscape. Первоначально предназначенный для веб-разработки внешнего интерфейса, появление различных фреймворков и библиотек превратило JavaScript из нишевого языка внешнего интерфейса в универсальный инструмент, используемый в самых разных средах разработки — от серверной веб-разработки до мобильных приложений, игрового дизайна и т. д. даже ИИ.
Установив важность JavaScript, давайте углубимся в его основы:
Основы JavaScript:
Заявления и комментарии:
В JavaScript инструкции или команды называются «операторами». При желании они могут включать точку с запятой в конце для улучшения читаемости.
console.log("This displays your inputs."); // Outputs: This displays your inputs console.log("Statements work even without semicolons") // Outputs: Statements work even without semicolons
Комментарии:
// This is a single line comment /* This is a multi-line comment, spanning several lines, for more detailed explanations. */
Переменные:
JavaScript поддерживает широкий спектр типов данных:
- Числа: `1, 2, 3, 123, 3,14`
- Строки: «Привет, мир!», «Это длинная строка»`
- Логические значения: «истина» или «ложь».
- Null: представляет несуществующее или пустое значение.
- Неопределено: переменная, которой не присвоено значение.
- Массивы: списки элементов, например, `[123, «строка», «Привет, мир»]`
- Объекты: коллекции пар ключ-значение (аналогично словарям в таких языках, как Python).
В JavaScript нет необходимости явно объявлять переменные типы данных. Вы можете использовать `let`, `const` или `var` для объявления переменных:
// Use 'let' for mutable variables let age = 25 console.log(age) // Outputs: 25 age = 26 console.log(age) // Outputs: 26 // 'const' is for immutable values const birthYear = 1998 console.log(birthYear) // Outputs: 1998 birthYear = 1999 // Outputs: !!! Uncaught Type Error!!! // 'var' is an old legacy way to declare variables var score = 90 console.log(score) // Outputs: 90 score = 100 console.log(score) // Outputs: 100
Условные операторы и порядок действий:
let status = 'starving' if (status === 'starving') { console.log("Eat something!") } else { console.log("Maybe wait until dinner?"); } // Outputs: Eat something! for (let i = 0; i < 5; i++) { console.log(i) } // Outputs: // 0 // 1 // 2 // 3 // 4 let mood = 'not full'; while (mood === 'not full') { console.log("Keep eating") } // Outputs: // "Keep eating" // "Keep eating" // "Keep eating" // "Keep eating" // ... (infinetely)
Введение в функции. Пример функции:
// A Typical Function Form function encourage(name) { return "Never ever give up, " + name + "!"; } console.log(encourage("Juan")) // Outputs: "Never ever give up, Juan!" // An Arrow Function Form const encourage = (name) => "Never ever give up, " + name + "!"; console.log(encourage("Kam")) // Outputs: "Never ever give up, Kam!" // A Function Expression Form const encourage = function(name) { return "Never ever give up, " + name + "!"; } console.log(encourage("Tri")) // Outputs: "Never ever give up, Tri!" // A Function Constructior Form const encourage = new Function('name', 'return "Never ever give up, " + name + "!";'); console.log(encourage("Cristal")) // Outputs: "Never ever give up, Cristal!"
Объекты:
let person = { name: "Ryan", age: 25, greet: function() { console.log("Hi, my name is " + this.name); }} person.greet('Ryan'); // Outputs: "Hi, my name is Ryan"
Объектная модель документа (DOM):
Думайте о DOM как о мосте между HTML и JavaScript. Он обеспечивает структурированное представление документа, позволяя нам манипулировать его содержанием и представлением.
Например, если у вас есть элемент `‹h1`` с надписью «Изучите JavaScript за 15 часов», вы можете настроить его с помощью JavaScript:
let title = document.querySelector('h1'); title.textContent = "Let's learn JavaScript in 5 minutes!";
Дальнейшие шаги – план тренировок:
Ваш путь к изучению JavaScript только начался с этого краткого введения. Начиная с основ, существует множество способов развивать и практиковать эти концепции.
Вот некоторые ресурсы, которые я пробовал или о которых думаю и рекомендую людям попробовать:
Академия кода
Code Academy — отличная платформа для изучения различных типов кодирования. Прежде чем изучать веб-разработку, я погрузился в различные курсы по платформе. Я изучил Python, анализ данных и некоторые концепции науки о данных. Мой опыт работы с этой платформой в целом был очень положительным.
Курсы JavaScript на платформе, встроенные в курс Full Stack Development, действительно поражают воображение с точки зрения детализации контента. Хотя некоторые упражнения могут показаться повторяющимися, повторение концепций путем постоянного выполнения и решения задач действительно дает вам незабываемый опыт обучения.
Проект Один
Проект Odin — это комплексная платформа обучения веб-разработке, получившая признание многих разработчиков. На многих форумах, особенно на Reddit, люди увлечены проектом Odin. Хотя я еще не пробовал, но ничего хорошего о нем не слышал.
Школы W3
W3 Schools — еще одна платформа, которая очень полезна как для изучения, так и для практики основ JavaScript. Будь то изучение строительных блоков фронтенд-разработки или нишевые темы, посвященные модификациям CSS, простой поиск в Google всегда дает ссылку на отличное учебное пособие W3 School.
ChatGPT
Мне нравится ChatGPT, и я был полностью поражен им с тех пор, как он стал общедоступным. Это чудо современных технологий, которое действительно волнует меня на более глубоком уровне. Это также очень полезно для изучения JavaScript. Я слышал от многих людей, что использование ChatGPT будет препятствовать моему росту как разработчика, однако мой опыт подсказывает мне, что они совершенно неправы. ChatGPT, если его правильно использовать и задавать правильные вопросы, может помочь вам быстро понять, как все взаимосвязано в веб-разработке. От настройки среды до понимания тонкостей работы с базами данных — ChatGPT может объяснить все на разных уровнях сложности. Это может позволить вам ускорить обучение, одновременно замедляя и разбивая сложные темы и структуры.