Язык js: Основы JavaScript

Содержание

Что такое JS? | JS: Настройка окружения

Что вообще такое язык программирования?

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

Синтаксически корректный код это только половина дела. Он не может запускаться напрямую компьютером, так как это всего лишь текст. Компьютер умеет исполнять лишь машинный код (нули и единички). Для превращения исходного кода в машинный код, существуют два подхода. Компиляция – процесс создания программы, готовой к прямому запуску. Большинство программ, с которыми мы имеем дело как пользователи, кем-то скомпилированы. Например, в Windows скомпилированные программы имеют расширение exe. Другой подход – интерпретация. При интерпретации превращение исходного кода в машинный происходит не до запуска программы, а прямо в процессе ее обработки. Именно поэтому сам подход называется интерпретацией.

JavaScript относится к интерпретируемым языкам. Для его запуска нужна специальная программа – интерпретатор. Например, когда JavaScript код выполняется на сервере, интерпретатором чаще всего выступает Node.js, когда на фронтенде — сам браузер. В других местах, таких как встраиваемые устройства или автомобили, могут быть свои собственные интерпретаторы.

В реальности все чуть сложнее. Непосредственно интерпретацию выполняет «движок», который встроен и в Node.js, и в браузеры.

// node запускает интерпретатор, который берет исходный код index.js,
// анализирует его (это называется парсинг),
// а затем построчно исполняет
$ node index.js

Глобально существует два больших класса языков – интерпретируемые и компилируемые. У каждой из этих групп есть свои плюсы и минусы, о которых можно почитать в разных статьях. Здесь же мы сосредоточимся на особенностях конкретно JavaScript.

Исторически, JavaScript разрабатывался под самый популярный на тот момент браузер. Новый язык позволял добавлять интерактивность на страницы, хотя изначально все сводилось к снежинкам и разным визуальным эффектам. Со временем разработчики распробовали этот язык и стали активнее строить логику с его участием. Одним из самых известных поворотных моментов стало появление сервиса Gmail, который на полную катушку использовал AJAX (выполнение HTTP-запросов к серверу). JavaScript начинал играть все большую роль в создании сайтов и уже все браузеры озадачивались его поддержкой. Для этого практически каждый крупный производитель браузера создавал свой собственный интерпретатор.

Дальнейшее развитие технологии вывело JavaScript за пределы браузера. Сначала появилась серверная реализация Node.js, затем он стал использоваться даже во встраиваемых системах. Сейчас даже утюги можно программировать с помощью JavaScript.

ECMAScript

Обилие разных интерпретаторов, с одной стороны, позволило JavaScript выйти далеко за пределы одного браузера, с другой, привело к проблемам совместимости. Один и тот же код мог вести себя по разному в разных местах. Для решения этой проблемы был создан стандарт ECMAScript. Это большой и серьезный документ, описывающий устройство языка и поведение во всех возможных ситуациях. Он полезен не только для разработчиков языка, но и для обычных программистов. Когда что-то непонятно в поведении JavaScript, то ответ всегда можно найти в ECMAScript.

ECMAScript не стоит на месте и постоянно развивается. Каждый новый стандарт описывает какие-то дополнительные возможности языка. Одни добавляют новый синтаксис, другие дополняют стандартную библиотеку новыми встроенными функциями. Стандарты, по большей части, обратно совместимы: то есть код, написанный под стандарт es3, запустится на большинстве интерпретаторов. К сожалению, это не всегда происходит без ошибок. Поведение кода со временем меняется, причем обычно в сторону более строгого поведения.

JavaScript — лучший язык программирования для начинающих. Так это или нет? / Хабр

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

Шёл 2007 год. Отличное издательство технических книг O’Reilly Media обратилось ко мне, предложив одну идею. Они спросили меня о том, хотел бы я написать книгу о JavaScript, которая предназначалась бы для абсолютных новичков в программировании. «С какой стати?», — тут же задал я встречный вопрос.

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

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

Самым очевидным способом использования JavaScript, как мне, по наивности, тогда казалось, было примерно следующее: большой серверный фреймворк должен сформировать весь необходимый JS-код и встроить его в страницу, предназначенную специально для вашего браузера. JavaScript-код, формируемый сервером, мог бы оказаться слишком громоздким, но он был бы предназначен для конкретной версии браузера. А учитывая то, что JS играл лишь роль вспомогательного механизма, при этом всё работало бы как надо даже в том случае, если бы посетитель сайта полностью отключил бы JavaScript.

Нет нужды говорить, что тогда я книгу о JavaScript не написал. Я продолжал заниматься серверным программированием и писать о моих любимых технологиях (как правило, о языке С# и о .NET Framework). Прошло много лет.

Затем произошло нечто странное.

JavaScript буквально «взлетел».

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

Потрясающая распространённость JavaScript — его главное преимущество

Одним из уникальных преимуществ JavaScript является его распространённость.

Этот язык можно встретить буквально повсюду. Он поддерживается на всех операционных системах, во всех видах браузеров, и на настольных компьютерах, и на мобильных устройствах. Очень важно ещё и то, что JavaScript-приложения работают без установки их на компьютеры пользователей. На самом деле, уже сложно вспомнить не такие уж и давние времена, когда компании, развёртывая клиент-серверные приложения в своих внутренних сетях, тратили недели, борясь с проблемами настройки этих приложений и с неожиданными ошибками. Столкнувшись с подобными кошмарами, вы вполне можете оценить привлекательность JavaScript.

JavaScript, благодаря его распространённости, не обязательно быть самым лучшим языком программирования. Ему всего лишь нужно быть достаточно хорошим языком.

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

Предположим, вы разрабатываете замечательное приложение, которое, задавая пользователю вопросы, определяет его личностный профиль. Настроить среду разработки довольно просто. Но что произойдёт, когда вы захотите отправить свою программу товарищу? Понадобится ли ему устанавливать у себя среду времени выполнения или воссоздавать ту же среду разработки, что и у вас? Нужно ли будет «подкрутить» настройки безопасности его компьютера прежде чем он сможет загрузить и установить вашу программу? Может быть, ваш товарищ использует операционную систему, которая попросту не поддерживает вашу программу, или мобильную платформу, на которую, если не вдаваться в детали, можно устанавливать только профессиональные приложения, распространяемые через iTunes или Google Play? Если же вы, для разработки программы, используете JavaScript, а для её распространения — простой веб-сайт (например, GitHub позволяет бесплатно создавать подобные сайты), то все эти проблемы попросту исчезнут.

А если наш будущий программист — ребёнок, то вот вам неопровержимый факт: дети и браузеры очень сильно связаны. Если вы наблюдали за ребёнком, который работает на компьютере (не на мобильном устройстве), то вы, возможно, заметили, что он как минимум 98% времени тратит на работу с браузером. Дети играют в браузерные игры, используют социальные сети, занимаются школьными делами в Google Classroom и Google Docs. И если код, который пишут дети, будет работать в родном для них браузерном мире, это будет совершенно естественно.

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

Недостатки JavaScript

Как насчёт проблем JavaScript? У этого языка есть серьёзные недостатки, его причуды, противоречия и ограничения могут быть крайне неприятными для того, кто только начинает изучать программирование. К счастью, существуют современные решения, которые могут сгладить большинство недостатков JavaScript.

Разберём четыре основные претензии, предъявляемые к этому языку.

▍1. Проблема работы с типами данных в JavaScript

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

Вот пример кода, который обречён на провал:

var myNumber = 100;
myNumber = myNumbr + 1;

Увидели ошибку? Во второй строке, на самом деле, используются две переменных: переменная

myNumber

, которая была объявлена в первой строке, и некая фиктивная переменная

myNumbr

. Мы знаем о том, что вторая переменная — это результат опечатки, но JavaScript сообщит нам об этом только во время выполнения программы, выдав сообщение об ошибке, которое выглядит как

ReferenceError: myNumbr is not defined

. То же самое происходит и в том случае, если при записи имени переменной перепутали большие и маленькие буквы (например, переменная из

myNumber

случайно превратилась в

MyNumber

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

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

Один из моих любимых редакторов кода, который подходит и для изучения программирования, и для профессионального использования — это Visual Studio Code. Он бесплатен, нетребователен к ресурсам, его код открыт, его можно практически до бесконечности расширять. Одна из его самых замечательных возможностей заключается в поддержке организации проверки JavaScript-кода на наличие в нём распространённых проблем средствами TypeScript. Включить такую проверку можно, воспользовавшись соответствующим конфигурационный файлом или вставив следующий комментарий в верхнюю часть JavaScript-файла:

// @ts-check

Вот пример, в котором имеются две ошибки, ни одна из которых, с точки зрения JavaScript, ошибкой не является.

Проблемы, которые JavaScript не считает ошибками

Если добавить в начало этого файла комментарий // @ts-check, то VS Code выделит строки кода, которые содержат потенциальные ошибки.

Выделенные строки кода

Если навести указатель мыши на выделенную строку, появится всплывающее окно, содержащее объяснение проблемы.

Объяснение проблемы

Какие из этого можно сделать выводы? Хотя JavaScript толерантно относится ко многим нехорошим вещам, если скомбинировать JavaScript с качественным редактором кода и с правильными дополнительными инструментами, можно создать среду разработки, похожую на те, которыми обладают другие современные языки программирования. В результате разработка на JavaScript оказывается такой же удобной, как и на других языках, и, естественно, другие его преимущества никуда не деваются.

▍2. JavaScript не поддерживает ООП

Объектно-ориентированное программирование (ООП) — это подход к моделированию и организации кода. Если методики ООП применяются правильно, они помогают программисту создавать простой и хорошо организованный код. Кроме того, ООП упрощает повторное использование важных функциональных возможностей программ.

JavaScript печально известен отсутствием поддержки объектно-ориентированного программирования. На самом деле, JavaScript-разработчики традиционно обходят этот недостаток, используя всяческие странные конструкции. Эти конструкции могут что-то значить для того, кто уже изучал ООП (и даже для того, кто не изучал, а просто скопировал в свой код некий шаблон и привык с ним работать). Но если вы — совершенно новый человек в программировании, использование подобных сомнительных конструкций, реализующих базовые концепции программирования — это совершенно неправильно.

К счастью, существуют красивые решения, обеспечивающие поддержку ООП в JavaScript. Моё любимое решение такого рода — это TypeScript — опенсорсный проект, запущенный Microsoft в 2012 году. TypeScript представляет собой нечто вроде улучшенной разновидности JavaScript, которая поддерживает ООП (а также многие другие полезные возможности вроде строгой проверки типов).

Кто-то может сказать, что мы говорим о JavaScript, и что TypeScript — это, всё же, не JavaScript. И, на самом деле, это так. Но вот одна интересная деталь. Код пишут на TypeScript, а затем конвертируют его в JavaScript перед тем, как он будет выполняться. Это позволяет пользоваться всем лучшим из миров TypeScript и JavaScript. Если вы выберете TypeScript, то у вас будет современный язык программирования, на котором вы сможете писать свой код, и та широчайшая поддержка, которой пользуется обычный JavaScript.

И, что приятнее всего, преобразование TypeScript-кода в JavaScript производится автоматически. Конечно, в сгенерированном компьютером JavaScript-коде используются, для отражения в нём концепций, реализованных средствами TypeScript, довольно громоздкие конструкции, но это ничего не меняет. Программист изучает концепции ООП, а готовый код правильно работает, без проблем обрабатываясь средствами современных компьютеров.

Не верите? Тогда подумайте о том, что некоторые из самых современных инновационных настольных приложений используют комбинацию из TypeScript и Electron — фреймворка, который позволяет выполнять JavaScript-код за пределами традиционного браузера (хотя надо отметить, что Electron пользуется браузерными возможностями). Один из наиболее впечатляющих примеров подобного приложения — это редактор VS Code. Получается, что тот самый инструмент, с помощью которого очень удобно писать JavaScript-код, сам написан на JavaScript. Правда, если говорить точнее, то VS Code написан на TypeScript, но код, написанный на этом языке, всё равно, преобразуется в JavaScript-код.

Конечно, изучая программирование вовсе необязательно использовать TypeScript, и новые JavaScript-программисты, если решат так поступить, смогут сделать очень многое, не изучая принципы ООП. Это, на самом деле, вопрос выбора. В любом случае, можно отметить, что JavaScript — язык динамично развивающийся, и в него постепенно добавляются возможности, сближающие его со всем тем ценным, что есть в TypeScript.

▍3. Вокруг полно некачественного JavaScript-кода

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

Visual Basic

▍4. Для JavaScript-разработки нужны дополнительные библиотеки и фреймворки

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

С некоей разновидностью этой проблемы сталкиваются и разработчики, использующие другие языки. Однако надо отметить, что немногие языки страдают от этой проблемы так же сильно, как JavaScript. Для того чтобы стать серьёзным программистом в открытом для всех JavaScript-мире, нужно собрать собственный набор инструментов разработки. При этом каждый из возможных вариантов выбора настолько сложен и многогранен, что понять, подходит ли вам, скажем, какая-то библиотека, можно только очень хорошо её изучив (а когда вы её изучите, может оказаться так, что она уже потеряет актуальность и на её место придёт что-то новое, притягивающее, возможно — на короткое время, всеобщий интерес).

Каким бы печальным всё это ни было, эти проблемы, на самом деле, не влияют на новичков. Если некто изучает программирование с использованием JavaScript, то ему лучше всего держаться в стороне от фреймворков и библиотек, идёт ли речь о чём-то широко известном, вроде jQuery, Angular, React или Vue, или о чём-то изобретённом в тот момент, когда было написано это предложение, или в ту секунду, когда была опубликована эта статья. Конечно, новичок, хорошо освоив фундаментальные вещи, вероятно, захочет ознакомиться, как минимум, с одним из популярных дополнительных инструментов. Но это — уже совсем другая история.

Итоги

На самом деле, выбор первого языка программирования — это вопрос, на который невозможно найти абсолютно правильный ответ. Автор этого материала поделился здесь лишь собственным мнением на этот счёт, привёл примеры, которые близки ему в силу его опыта и предпочтений. Но, в любом случае, все программисты с чего-то начинают, и каким бы сложным ни был бы выбор первого языка, это выбор, всё равно, приходится делать.

Уважаемые читатели! Согласны ли вы с тем, что JavaScript — это, в современных условиях, самый лучший язык для обучения программированию? Если не согласны — тогда, может быть, вы знаете какой-нибудь язык, который лучше подойдёт для этой цели?

что это такое, преимущества и недостатки JavaScript

JavaScript – язык программирования, являющийся прототипно-ориентированным. Он отражает язык ECMAScript, чьим прототипом изначально и являлся. Первая вариация появилась ещё в 1995 году и с тех пор постоянно совершенствовалась, пока не пришла к нынешнему виду.

Чаще этот язык используется в разработке приложений и браузерах с целью придания им интерактивности и «живости».

Частой ошибкой встречается путаница между Java и JavaScript – это два разных языка, несмотря на схожие названия.

Базовой особенностью этого языка отмечается то, что на него повлияли другие (Python, Java и др.) языки программирования с целью придания максимального комфорта JavaScript и лёгкости в понимании его теми пользователями, которые не имеют соответствующего образования и глубинных знаний – не программистами. JavaScript – официально зарегистрированная торговая марка компании Oracle.

JavaScript — что это? Для чего используют?

С помощью него доступны к исполнению следующие функции:

возможность изменять страницы браузеров;
добавление или удаление тегов;
изменение стилей страницы;
информация о действиях пользователя на странице;
запрос доступа к случайной части исходного кода страницы;
внесение изменений в этот код;
выполнение действия с cookie-файлами.

Область применения этого языка удивительно обширна и ничем не ограничена: среди программ, которые используют JS, присутствуют и тестовые редакторы, и приложения (как для компьютеров, так и мобильные и даже серверные), и прикладное ПО.

Преимущества JavaScript

Ни один современный браузер не обходится без поддержки JavaScript.
С использованием написанных на JavaScript плагинов и скриптов справится даже не специалист.
Полезные функциональные настройки.
Постоянно совершенствующийся язык – сейчас разрабатывается бета-вариация проекта, JavaScript2.
Взаимодействие с приложением может осуществляется даже через текстовые редакторы – Microsoft Office и Open Office.
Перспектива использования языка в процессе обучения программированию и информатике.

Недостатки JavaScript

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

iPipe – надёжный хостинг-провайдер с опытом работы более 15 лет.

Мы предлагаем:

Java и JavaScript: в чём разница?

Нестыдные вопросы.

Короткий ответ: Java и JavaScript — это просто разные языки, которые используются для разных целей. Похожие названия — просто историческое недоразумение.

Java — это серьёзный объектно ориентированный язык, на котором пишут серверный софт, программы для компьютеров и мобильные приложения. Он интересен тем, что один и тот же код можно скомпилировать под множество разных платформ. Java — один из основных языков для разработки под Android. Читайте о Java подробнее у нас.

JavaScript — это язык для управления веб-страницами в браузере. Он исполняется только в браузере, может красить элементы на странице в разные цвета, рисовать интерфейсы, пуляться данными, но всё — в браузере.

На JavaScript можно писать и приложения, и даже десктопные программы. Но это требует огромного внешнего обвеса, мы не рекомендуем. Зато рекомендуем пройти тест на знание JavaScript.

Java	JavaScript
Для десктопных, серверных и встроенных программ	Для браузерных программ
Исполняется на любом железе, для которого есть Java Virtual Machine	Исполняется только в браузере и в некоторых серверных средах
Сложноват	Простой, но с нюансами
Компилируется	Исполняется на лету
На нём работают кассовые терминалы, серверные программы, приложения для Андроида	На нём работает весь интернет

Что изучать?

Java — это такой промышленный язык. На нём работают терминалы оплаты, умные устройства, огромные серверные системы. Мир потных инженеров, серверных комнат и финансовых рынков. Если хотите, чтобы у вас была работа по поддержке и совершенствованию всего этого хозяйства на много лет вперёд — вам сюда.

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

И не забывайте, что можно переходить с одного языка на другой. Не сказать, что переход с JavaScript на Java будет простым, но это выполнимо.

История Java и JavaScript в общих чертах выглядит так.

Начало девяностых. В компании Sun Microsystems пилят язык программирования, который можно будет использовать для умных устройств — телеприставок, холодильников и всякого такого. Задача была придумать такую систему, чтобы код писался один раз, а исполнять его можно было бы на разном железе. В 1995 году выходят первые версии этого языка, он называется Java.

Параллельно с этим в другой области идёт война браузеров. Технологии веба ещё очень слабые, плохо стандартизированные, HTML ещё мало что умеет, дизайна мало. В ходу несколько браузеров, каждый из которых рисует веб-страницы по-своему. Один из этих браузеров — Netscape Navigator.

Создатели Netscape Navigator мечтают, чтобы браузеры умели красиво себя вести; чтобы там был интерактив и анимации; чтобы в браузере можно было запускать программы и делать хотя бы простые вещи (а не только читать). И они разрабатывают технологию Mocha — язык скриптования, который умел работать напрямую с веб-страницей. В те времена это было ново и интересно.

Слово за слово, Netscape входит в состав Sun Microsystems, и в порыве маркетингового креатива язык Mocha переименовывают в JavaScript, чтобы попиарить одно на другом. Якобы JavaScript — это компаньон Java для веба (хотя разрабатывали JavaScript совсем другие люди и с другими задачами).

Пиар не зашёл. Лет пять разработчики плевались из-за кажущейся кривизны JavaScript и общего разлада в веб-технологиях. Уже позднее, в двухтысячных, началась бескомпромиссная стандартизация веб-технологий (огнём и мечом), и всё постепенно наладилось. Но осадочек остался.

А похожие названия языков — это то, что бывает, когда маркетологов пускают в программирование. Не надо так.

Java — это не будущее, это уже настоящее

Изучите программирование на Java и станьте тем, кто поддерживает современную ИТ-инфраструктуру во всём мире.

За дело!

язык программирования, для чего нужен, где используется

JavaScript — один из языков программирования, который позволяет добавить на страницы сайта различные интерактивные элементы: всплывающие окна, анимации, мини-игры, «плавающие» формы, динамический стили оформления и многое другое.

JavaScript (JS) представляет собой динамический, полноценный язык программирования, который можно использовать совместно с HTML-документами. Этот язык призван обеспечить динамическую интерактивность веб-ресурса.

Создатель языка JavaScript — Брендан Эйх Ву, один из сооснователей таких крупных проектов, как Mozilla Corporation и Mozilla Foundation. Именно он сумел создать JS — универсальный язык, который легко освоить даже начинающему вебмастеру.

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

Сам по себе JS отличается компактностью и одновременной гибкостью. Поверх основного языка JavaScript его разработчиками было создано большое количество дополнительных инструментов и функций.

Среди таковых можно выделить следующие:

API — программные интерфейсы приложений, которые встроены в интернет-браузер и предоставляют пользователю массу дополнительных возможностей в виде работы с различными элементами сайта для генерации трехмерной графики, обработки аудио-сэмплов, динамического создания HTML-страниц, взаимодействия с веб-камерой, установку дополнительных стилей CSS и т. д.
Сторонние API от других разработчиков, которые позволяют использовать на своих сайтах более широкие возможности в плане внедрения готовых решений от Facebook, Twitter.
Возможность использовать для своего HTML дополнительные фреймворки и библиотеки, ускоряющие создание приложений и веб-сайтов.

Разработка сайтов для ИТ компаний

Какие возможности есть у JS в браузере

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

Возможности JavaScript весьма большие и напрямую зависят от окружения, где будет работать язык программирования. Например, Node.JS обеспечивает поддержку записи и чтения любых типов файлов, а также «умеет» выполнять сетевые запросы и т. д.

В браузере, поддерживающем работу с JavaScript, есть все, что необходимо современному пользователю, который часто посещает веб-страницы с динамическим содержимым, а также каким-либо образом взаимодействует с сервером.

Например, JavaScript может в браузере:

Устанавливать новые HTML-коды, которые способны изменить содержимое страницы, модифицировать CSS.
«Отвечать» на определенные действия посетителя сайта, клики кнопками мыши, перемещение курсора, нажатия на клавиши и т. д.
Отправлять сетевые запросы на серверы, загружать видео, фото, аудио контент, а также документы и другие файлы.
Получать cookie-файлы и выполнять их установку, отправлять вопросы посетителю страницы, выводить определенные сообщения.
Хранить какую-либо информацию на стороне клиента.

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

В этой статье вы узнаете, как быстро и просто выучить JavaScript самостоятельно. Что учить в первую очередь, какие навыки нужны для получения работы. Получите обзор бесплатных курсов по языку Java Script и много другой полезной информации.

Содержание статьи:

Где используют язык JavaScript и для чего?

Java Script (Ява или Джава скрипт или сокращенно JS) – один из самых популярных языков программирования в мире. Чаще всего на нем создают интерактивные элементы на сайтах, с помощью которых сайты «оживают», начинают реагировать на действия пользователей. Примеры таких элементов:

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

Зачем учить JavaScript? Преимущества языка для новичков

С чего начать изучение JavaScript и сколько времени это займет?

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

Структура кода (как составляется программа, с чего начинается, в какой последовательности задаются команды и т.д.).
Переменные (что это такое, для чего нужны, как задаются и используются в скриптах).
Типы данных, например: число, строка, логический тип, и преобразование типов.
Операторы, например, как производится сложение. Приоритет операторов (какие действия выполняются в первую очередь, какие – во вторую и т.д.). Бывают операторы сравнения, условные операторы, логические.
Выучить, как использовать циклы (что это такое, для чего нужны, как их задавать). Говоря простыми словами, циклы позволяют производить одну и ту же операцию несколько раз (пока не наступит условие, которое завершит цикл).
Функции.
Объекты и их свойства.
Прототипы, наследование.
Классы и наследование классов.
Интерфейсные события (обработка движения курсора, кликов мышки, нажатия кнопок на клавиатуре).
Программирование элементов интерфейса: кнопок, форм и других.
Выучить, как писать асинхронный код на JavaScript.
Отладка программ в браузере, написанных на JS.
Обработка ошибок.
Качество кода: как писать программу правильно, чтобы в ней было легко и просто ориентироваться как автору, так и другому разработчику.

Изучить основы можно самостоятельно, например, пользуясь самоучителем Learn.javascript.ru или Html5css.ru. На втором сайте курс интерактивный. Можно прямо в браузере смотреть пример кода и как он работает (какие события обрабатывает и как).

Выучить простейшие азы можно за срок от 2-3 недель до 1,5 месяцев в зависимости от времени, которое вы сможете уделять программированию каждый день. Далее вам потребуется более глубоко погружаться в предметную область, о чем поговорим ниже.

Для изучения JavaScript пригодится знание HTML и CSS. Если вы еще не знаете эти технологии, то освоить их можно на бесплатном курсе в Нетологии. На нем расскажут, что такое HTML-теги, для чего они нужны и покажут основные теги и их атрибуты.

В какой последовательности можно учить язык JavaScript?

1. Изучите основы языка. Список того, что нужно знать, описан выше. Все это можно выучить самостоятельно, пользуясь бесплатным учебником Learn.javascript.ru. Он написан на русском языке просто и понятно.

Если вам нужен наставник, то можно пойти на курсы. Например:

Курс по frontend-разработке в Нетологии – включает изучение JavaScript и других технологий, применяемых в разработке сайтов.
Курс по JavaScript в Geekbrains – включает не только обучение, но и стражировку в компаниях-партнерах, например, Майл.ру.
Fullstack-разработчик на JavaScript в Skillbox – посвящен исключительно одному языку программирования и позволяет изучить его на хорошем уровне с нуля.

2. Изучите библиотеки, например, jQuery и React. Это наборы готовых решений, которые можно использовать для ускорения работы. Нет смысла писать все скрипты с нуля, когда есть множество готовых решений.

3. Будет полезно изучить Node.JS – это технология расширяет область применения Джава-скрипт. Например, при помощи Node.JS можно создавать приложения и полноценные программы для ПК.

4. Освойте фрймворки, например, Angular и Vue.js. Фреймворк – это некая основа, фундамент, на котором можно создавать различные программы. Он включает набор готовых решений, на базе которых можно быстрее собрать ИТ-продукты (лендинг, сайт, интернет-магазин, приложение).

Например, фреймворк Angular используется для создания одностраничных приложений, Vue.js – для создания пользовательских интерфейсов.

5. Научитесь использовать системы контроля версий. Самая популярная из них — это GIT. О нем поговорим ниже.

6. Учитесь писать грамотный и правильно структурированный код.

Что такое GIT и для чего он нужен?

GIT – это система контроля версий. Она позволяет команде разработчиком совместно работать над кодом и при необходимости возвращаться к версиям программ, созданным ранее. Также GIT синхронизирует работу с сайтом, сохраняет и обновляет изменения в файлах со скриптами.

Эта система позволяет избегать ошибок и систематизировать работу над программным кодом. При необходимости можно быстро откатить изменения, если в программе нашлись баги (ошибки).

Бесплатные курсы и материалы для новичков

В этой части статьи на Kadrof.ru вы найдете видео, а также ссылки на обзоры бесплатных уроков и мастер-классов, которые помогут выучить JS с нуля. Вы сможете использовать их для самообучения.

1. Полный курс по Java Script для новичков. За 6 часов в этом видео простым и понятным языком описываются основы языка:

2. Что такое Node.JS: история создания, простейшие скрипты и основные возможности. Видео с канала Разработка от Яндекса продолжительностью 3 часа:

3. Еще один бесплатный урок по Node.JS, который можно посмотреть в том числе начинающим разработчикам:

4. Полный курс по React. Примеры и практика для новичков:

Также вы можете посмотреть бесплатные видео уроки, собранные в группе Клуб фриланеров, в том числе:

Где учиться программировать на JavaScript?

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

Среди курсов можно выделить:

Fullstack-разработчик на JavaScript в Skillbox –данный курс посвящен верстке сайтов и программированию на JS. Осваивается язык, фреймворк (один на выбор – Vue, React или Angular), серверные технологии (Node.js). После обучения вы сможете не только работать с сайтами, но и создавать приложения на JS.
Курс по frontend-разработке в Нетологии. Уровень обучения – с нуля. Занятия проходят онлайн. Есть практика и диплом. Здесь вы освоите не только JS, но и библиотеку React, а также получите другие необходимые знания для работы front-end программистом. Если вы в дальнейшем хотите заниматься разработкой сайтов, этот курс для вас.
Обучение JavaScript в Geekbrains – здесь студенты проходят HTML, CSS, JavaScript, React, а также – основы баз данных и Node.js. Предусмотрена стажировка у партнеров.

Как быстро выучить JavaScript с нуля? Советы для новичков

Старайтесь системно подходить к обучению. Если осваиваете Ява скрипт самостоятельно, то начинайте с основ, затем переходите к более глубокому материалу. Параллельно учите теорию. Что такое алгоритмы, какие они бывают и т.д.
Постоянно практикуйтесь. Начинайте писать свои скрипты или переделывать или дорабатывать скрпиты других разработчиков (их можно найти в интернете). Старайтесь разобраться, как работает чужой код и как он сделан.
Сделайте свой сайт, например, на WordPress и добавляйте на него различные функции. Это будет хорошей практикой.
Если вам что-то не понятно, берите консультации программистов или заказывайте услугу code-review (проверку кода у опытного разработчика с комментариями, что нужно доработать, переделать и почему). Найти опытных разработчиков для code-review можно в каталоге веб-программистов на Kadrof.ru. Данная услуга стоит денег, поэтому заранее уточняйте у людей, которые согласятся проверить ваш код, сколько это будет стоить.
Много полезной информации можно найти на сайте Хабр Q&A. Там общаются разработчики и в том числе можно попросить совет (бесплатно).
На Kadrof.ru есть обзор сайтов для изучения языков программирования. Там вы найдете справочники и самоучители, которые помогут быстро освоить JavaScript.

Как наработать опыт и найти работу?

В ИТ сфере принято тестировать кандидатов на работу. Поэтому в первую очередь для получения работы необходимы знания. Просматривайте вакансии на HH.ru и обращайте внимание, какие требования предъявляются работодателями. Какие технологии и на каком уровне необходимо знать. Изучив материал, приходите на собеседования. Если вас взяли, отлично. Если нет, спросите, каких знаний и навыков вам не хватило для получения работы и постарайтесь их быстро выучить. Затем снова приходите на собеседование.
Ищите информацию о стажировках в крупных компаниях. Стажировка – отличный шанс получить опыт и затем работу. Подпишитесь на группу Клуб фрилансеров – в ней публикуется информация о стажировках и другие полезные новости для новичков.
Посетите веб-студии, которые работают в вашем городе. Возможно, где-то требуется Junior разработчик на JS и вас возьмут на испытательный срок.
Пока ищете работу, попробуйте подрабатывать на фрилансе, выполнять простые заказы на биржах или развивать собственный проект в интернете.
Не переживайте, если сразу не получается найти работу. В ИТ не всегда просто новичкам, но по мере накопления опыта искать хорошие вакансии станет проще. Все когда-то начинали и проходили начальный этап.
Общайтесь на форумах и сайтах для программистов. Вступайте в профильные группы в социальных сетях. Становитесь частью профессионального сообщества. Тогда найти работу станет проще.

Мы разобрались, как выучить JavaScript с нуля самостоятельно, что нужно осваивать в первую очередь и как быстро набрать опыт. Теперь вы готовы сделать первые шаги. Удачи вам в изучении JS и поиске работы!

В чем Разница Между Языками Программирования JAVA и JavaScript?

На первый взгляд, Java и JavaScript — два языка программирования с очень схожими названиями, которые часто путают между собой. И они оба являются объектно-ориентированными языками программирования. Но это только на первый взгляд, на самом же деле различий межу ними намного больше, чем сходств.

Что бы начать говорить о различиях JAVA и JavaScript, необходимо четко определить эти два понятия. JavaScript — это язык программирования, а под Java можно также подразумевать и платформу для разработки. Чтобы было возможно сопоставить эти два понятия, далее под Java будем подразумевать не платформу для разработки, а именно язык программирования.

Назначения JavaScript и JAVA. Что выбрать?

JAVA — это объектно-ориентированный язык программирования, изначально разрабатываемый для программирования бытовой техники (назывался Qak). Позже язык программирования Java начал использоваться для написания различных типов программного обеспечения, апплетов, настольных и серверных приложений.

JavaScript (JS) — это объектно-ориентированный скриптовый язык программирования, первоначальное назначение которого было в написании сценариев для активных HTML-страниц. Скриптовый язык программирования используется для настройки, управления и автоматизации средств существующей системы или приложения.

Если сравнивать данные языки программирования, исходя из их определений, то уже видим их главное различие. Java — язык программирования для создания различных типов приложений, а JavaScript — это вспомогательный язык, который используется в уже созданных приложениях, а также как дополнительный язык программирования.

3 фундаментальные различия языков программирования Java vs JavaScript:

1. JAVA — это объектно-ориентированный язык программирования, а JavaScript — объектно-ориентированный язык сценариев.

2. При помощи JAVA создаются приложения, которые запускаются на виртуальных машинах или в браузерах, а JavaScript выполняется только в браузерах.

3. JAVA-код необходимо скомпилировать, а JavaScript-код используется в текстовом виде.

Почему название этих языков так похожи?

Все дело в том, что изначально JavaScript имел название LiveScript, но после того как язык программирования Java стал всемирно известен, из коммерческих соображений LiveScript был переименован в JavaScript.

Использование JavaScript в WEB

Из-за своей простоты и удобства, JavaScript очень часто используется в мире WEB. По мере роста сложности сайтов и различных WEB-приложений, его использование начинается с динамического изменения элементов сайта, до их генерации и разработки серверной части (клиент-серверная архитектура) различных типов приложений. С помощью него создаются различные фреймворковки и библиотеки, что предлагают готовые решения типичных задач программирования в области WEB.

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

JavaScript отличается так называем “низким порогом вхождения”, то есть для его изучения необходимо иметь не большой объем знаний в области WEB, в частности включающий базовые понятия html и css.
Сейчас существует множество бесплатных ресурсов изучения JavaScript: книги, статьи, форумы, видео-уроки, online-курсы и т.д, которые помогают с легкостью освоить JavaScript с начального уровня до продвинутого использования.

Автор: web-программист агентства стратегического интернет-маркетинга «StarMarketing» Ярослав Кустрич.

Что такое JavaScript? — Изучите веб-разработку

Добро пожаловать на курс JavaScript для начинающих MDN! В этой статье мы рассмотрим JavaScript с высокого уровня, ответив на такие вопросы, как «Что это такое?». и «Что вы можете с этим сделать?», и убедитесь, что вы понимаете цель JavaScript.

Предварительные требования:	Базовая компьютерная грамотность, базовое понимание HTML и CSS.
Цель:	Познакомиться с тем, что такое JavaScript, что он может делать и как вписывается в веб-сайт.

JavaScript — это язык сценариев или программирования, который позволяет вам реализовывать сложные функции на веб-страницах — каждый раз, когда веб-страница делает больше, чем просто сидит и отображает статическую информацию, на которую вы можете смотреть, — отображение своевременных обновлений контента, интерактивные карты , анимированная 2D / 3D графика, музыкальные автоматы с прокруткой и т. д. — вы можете поспорить, что, вероятно, задействован JavaScript. Это третий слой слоеного пирога стандартных веб-технологий, два из которых (HTML и CSS) мы рассмотрели более подробно в других частях области обучения.

HTML — это язык разметки, который мы используем для структурирования и придания значения нашему веб-контенту, например, для определения абзацев, заголовков и таблиц данных или для встраивания изображений и видео на страницу.
CSS — это язык правил стиля, который мы используем для применения стиля к нашему HTML-содержимому, например, для установки цвета фона и шрифтов, а также для размещения нашего содержимого в нескольких столбцах.
JavaScript — это язык сценариев, который позволяет вам создавать динамически обновляемый контент, управлять мультимедиа, анимировать изображения и многое другое.(Ладно, не все, но удивительно, чего можно достичь с помощью нескольких строк кода JavaScript.)

Три слоя красиво накладываются друг на друга. В качестве примера возьмем простую текстовую метку. Мы можем разметить его с помощью HTML, чтобы придать ему структуру и цель:

Затем мы можем добавить немного CSS в микс, чтобы он выглядел красиво:

  п {
  семейство шрифтов: 'helvetica neue', helvetica, sans-serif;
  межбуквенный интервал: 1 пиксель;
  преобразование текста: прописные буквы;
  выравнивание текста: центр;
  граница: 2px сплошной rgba (0,0,200,0.6);
  фон: rgba (0,0,200,0.3);
  цвет: rgba (0,0,200,0.6);
  box-shadow: 1px 1px 2px rgba (0,0,200,0.4);
  радиус границы: 10 пикселей;
  отступ: 3px 10px;
  дисплей: встроенный блок;
  курсор: указатель;
}

И, наконец, мы можем добавить JavaScript для реализации динамического поведения:

  const para = document.querySelector ('p');

para.addEventListener ('щелкните', updateName);

function updateName () {
  let name = prompt ('Введите новое имя');
  para.textContent = 'Игрок 1:' + имя;
}

Попробуйте щелкнуть эту последнюю версию текстовой метки, чтобы увидеть, что происходит (обратите внимание, что вы можете найти эту демонстрацию на GitHub — посмотрите исходный код или запустите его вживую)!

JavaScript может гораздо больше — давайте рассмотрим, что именно.

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

Хранить полезные значения внутри переменных. Например, в приведенном выше примере мы просим ввести новое имя, а затем сохраняем это имя в переменной с именем name .
Операции с фрагментами текста (в программировании известные как «строки»). В приведенном выше примере мы берем строку «Player 1:» и присоединяем ее к переменной name , чтобы создать полную текстовую метку, например.грамм. «Игрок 1: Крис».
Запуск кода в ответ на определенные события, происходящие на веб-странице. В нашем примере выше мы использовали событие click , чтобы определить, когда была нажата кнопка, а затем запустить код, обновляющий текстовую метку.
И многое другое!

Что еще более интересно, так это функциональность, построенная на основе клиентского языка JavaScript. Так называемые интерфейсы прикладного программирования ( API ) предоставляют вам дополнительные сверхспособности для использования в вашем коде JavaScript.

API

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

Обычно они делятся на две категории.

API-интерфейсы браузера встроены в ваш веб-браузер и могут предоставлять данные из окружающей компьютерной среды или выполнять полезные сложные задачи. Например:

API DOM (объектная модель документа) позволяет вам управлять HTML и CSS, создавать, удалять и изменять HTML, динамически применять новые стили к вашей странице и т. Д. Каждый раз, когда вы видите всплывающее окно, появляющееся на странице, или отображается некоторый новый контент (как мы видели выше в нашей простой демонстрации), например, это DOM в действии.
API геолокации извлекает географическую информацию. Таким образом Google Maps может определять ваше местоположение и наносить его на карту.
API Canvas и WebGL позволяют создавать анимированную 2D- и 3D-графику. С помощью этих веб-технологий люди делают удивительные вещи — см. Эксперименты Chrome и примеры webgls.

API-интерфейсы аудио и видео

, такие как HTMLMediaElement и WebRTC , позволяют делать действительно интересные вещи с мультимедиа, например воспроизводить аудио и видео прямо на веб-странице или захватывать видео с веб-камеры и отображать его на чужом компьютере ( попробуйте нашу простую демонстрацию Snapshot, чтобы понять идею).

Примечание: Многие из вышеперечисленных демонстраций не будут работать в более старых версиях браузера — при экспериментировании рекомендуется использовать современный браузер, такой как Firefox, Chrome, Edge или Opera, для запуска вашего кода. Вам необходимо учитывать кроссбраузерное тестирование более подробно, когда вы приблизитесь к доставке производственного кода (т.е. реального кода, который будут использовать реальные клиенты).

Сторонние API не встроены в браузер по умолчанию, и вам обычно приходится брать их код и информацию из Интернета.Например:

Примечание. Эти API являются расширенными, и мы не будем рассматривать их в этом модуле. Вы можете узнать больше об этом в нашем модуле клиентских веб-API.

Доступно еще много всего! Однако пока не стоит слишком сильно волноваться. Вы не сможете создать следующий Facebook, Google Maps или Instagram после изучения JavaScript в течение 24 часов — сначала нужно изучить множество основ. И поэтому вы здесь — идем дальше!

Здесь мы фактически начнем смотреть на некоторый код, и при этом исследуем, что на самом деле происходит, когда вы запускаете некоторый JavaScript на своей странице.

Давайте вкратце напомним историю того, что происходит, когда вы загружаете веб-страницу в браузере (о чем впервые говорилось в нашей статье «Как работает CSS»). Когда вы загружаете веб-страницу в свой браузер, вы запускаете свой код (HTML, CSS и JavaScript) внутри среды выполнения (вкладка браузера). Это похоже на фабрику, которая принимает сырье (код) и выпускает продукт (веб-страницу).

Очень часто JavaScript используется для динамического изменения HTML и CSS для обновления пользовательского интерфейса через API объектной модели документа (как упоминалось выше).Обратите внимание, что код в ваших веб-документах обычно загружается и выполняется в том порядке, в котором он отображается на странице. Ошибки могут возникнуть, если JavaScript загружается и запускается перед HTML и CSS, которые он предназначен для изменения. Способы решения этой проблемы вы узнаете позже в статье, в разделе «Стратегии загрузки скриптов».

Безопасность браузера

Каждая вкладка браузера имеет свой собственный сегмент для запуска кода (эти сегменты называются «средами выполнения» в технических терминах) — это означает, что в большинстве случаев код на каждой вкладке запускается полностью отдельно, и код на одной вкладке не может напрямую влиять на код на другой вкладке или на другом веб-сайте.Это хорошая мера безопасности — если бы это было не так, пираты могли бы начать писать код для кражи информации с других веб-сайтов и других подобных плохих вещей.

Примечание: Существуют способы безопасной передачи кода и данных между разными веб-сайтами / вкладками, но это продвинутые методы, которые мы не будем рассматривать в этом курсе.

Порядок выполнения JavaScript

Когда браузер встречает блок JavaScript, он обычно запускает его по порядку, сверху вниз.Это означает, что вам нужно быть осторожным в том, в каком порядке вы размещаете вещи. Например, давайте вернемся к блоку JavaScript, который мы видели в нашем первом примере:

  const para = document.querySelector ('p');

para.addEventListener ('щелкните', updateName);

function updateName () {
  let name = prompt ('Введите новое имя');
  para.textContent = 'Игрок 1:' + имя;
}

Здесь мы выбираем текстовый абзац (строка 1), затем присоединяем к нему прослушиватель событий (строка 3), чтобы при щелчке на абзаце запускался блок кода updateName () (строки 5–8).Кодовый блок updateName () (эти типы повторно используемых кодовых блоков называются «функциями») запрашивает у пользователя новое имя, а затем вставляет это имя в абзац, чтобы обновить отображение.

Если вы поменяли местами первые две строки кода, он больше не будет работать — вместо этого вы получите сообщение об ошибке в консоли разработчика браузера — TypeError: para is undefined . Это означает, что объект para еще не существует, поэтому мы не можем добавить к нему прослушиватель событий.

Примечание: Это очень распространенная ошибка — вы должны быть осторожны, чтобы объекты, указанные в вашем коде, существовали, прежде чем пытаться что-то с ними сделать.

Интерпретируемый и скомпилированный код

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

С другой стороны, скомпилированные языки преобразуются (компилируются) в другую форму перед запуском на компьютере. Например, C / C ++ компилируются в машинный код, который затем запускается на компьютере. Программа выполняется из двоичного формата, который был сгенерирован из исходного исходного кода программы.

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

У обоих типов языка есть свои преимущества, но мы не будем их сейчас обсуждать.

Сравнение кода на стороне сервера и на стороне клиента

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

Серверный код, с другой стороны, запускается на сервере, затем его результаты загружаются и отображаются в браузере.Примеры популярных серверных веб-языков включают PHP, Python, Ruby, ASP.NET и … JavaScript! JavaScript также может использоваться в качестве серверного языка, например, в популярной среде Node.js. Вы можете узнать больше о серверном JavaScript в разделе «Динамические веб-сайты — серверное программирование».

Сравнение динамического и статического кода

Слово динамический используется для описания как клиентского JavaScript, так и серверных языков — оно относится к возможности обновлять отображение веб-страницы / приложения, чтобы отображать разные вещи по-разному. обстоятельства, создавая новый контент по мере необходимости.Серверный код динамически генерирует новый контент на сервере, например извлекает данные из базы данных, тогда как клиентский JavaScript динамически генерирует новый контент внутри браузера на клиенте, например создание новой таблицы HTML, заполнение ее данными, запрошенными с сервера, а затем отображение таблицы на веб-странице, показываемой пользователю. Значение немного отличается в двух контекстах, но связано, и оба подхода (на стороне сервера и на стороне клиента) обычно работают вместе.

Веб-страница без динамически обновляемого содержимого называется статической — она просто показывает одно и то же содержимое все время.

JavaScript применяется к вашей HTML-странице аналогично CSS. В то время как CSS использует элементы для применения внешних таблиц стилей и элементы