Все о javascript: Что такое JavaScript? — Изучение веб-разработки

JavaScript: что это, где используется и как работает

Объясняем на примерах, почему без JavaScript не будет современных сайтов и что делает этот язык программирования таким востребованным. Расскажем о преимуществах JS и его перспективах.

• Особенности JavaScript
• Для чего нужен JavaScript
• Области применения JavaScript
• Как работает JS-код на сайте
• Чего не умеет делать JavaScript в браузере
• Стоит ли учить JavaScript
• Совет эксперта

Особенности JavaScript

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

JavaScript похож на Java, Python, Go, C#, но имеет свои особенности:

1. Интерпретируемый, а не компилируемый. Все языки программирования делятся на две группы. Код на компилируемых языках нужно сначала пропустить через специальную программу, компилятор, и только потом его можно использовать. Большинство современных языков как раз компилируемые в отличие от JavaScript.

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

2. Мультипарадигменный. В программировании существует несколько парадигм:

● Объектная. В ней для каждой сущности в коде, например кнопки заказа, создают объекты. А затем прописывают связи между этими объектами.
● Функциональная. В ней больше внимания уделяют конкретным инструкциям. Кнопка здесь — не объект, в коде она обозначена как порядок действий, которые происходят после нажатия.
● Императивная. Здесь код пишут как чёткий набор инструкций, который выполняется строго последовательно. Императивная и функциональная парадигма часто применяются вместе.

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

3. Без строгой типизации. Есть языки программирования со статической типизацией. Если создать переменную, нужно сначала обязательно задать её тип, например число. И ничего, кроме числа, хранить в ней нельзя.

У языка JavaScript типизация динамическая — в переменную можно положить что угодно. Это облегчает написание кода, но может вызвать ошибки. Например, JavaScript позволит сравнить строку с числом и даже выдаст какой-то результат. Что больше, «корова» или «81»? JavaScript знает ответ.

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

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

Так выглядят файлы скриптов на JavaScript, вставленные в код страницы

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

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

Материал по теме:

В чём разница между Java и JavaScript

Для чего нужен JavaScript

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

● Передавать информацию между пользователем и сервером. Именно скрипты, написанные на JavaScript, отправляют на сервер информацию, которую ввёл пользователь.
● Анимировать объекты — добавить скролл до раздела по нажатию кнопки, анимацию фона, движущиеся объекты.
● Производить вычисления. Например, в онлайн-калькуляторе на сайте. Это можно делать как на стороне сервера, так и в самом браузере с помощью возможностей JavaScript.
● Писать серверную часть сайта или приложения.

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

Каждый может стать веб‑разработчиком

Освойте навыки востребованной профессии в IT меньше чем за год: научитесь писать чистый код, разрабатывать сайты и веб-приложения. Начните с бесплатной вводной части курса «Веб-разработчик».

Области применения JavaScript

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

Веб-сайты и веб-приложения. Самая популярная область применения языка JavaScript — это написание кода для сайта. Практически на каждом современном сайте используют код, написанный на JS.

Расширения для браузера. Небольшие простые скрипты, которые добавляют дополнительный функционал — блокируют рекламу, позволяют сохранять аудио, отправляют уведомления о новых письмах или меняют цветовую схему сайта.

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

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

Игры. На JS можно писать несложные браузерные игры. Вот интересный платформер с необычной физикой.

Простая, но интересная игра-платформер, написанная на JavaScript

Как работает JS-код на сайте

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

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

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

Чего не умеет делать JavaScript в браузере

JavaScript изначально задумывали как безопасный язык. Браузер не позволяет ему глубоко влезать в работу компьютера пользователя и других веб-сайтов. Поэтому JS в браузере не умеет:

● Читать и записывать файлы на жёсткий диск пользователя, запускать программы, работать с системными функциями ОС. Ему доступно только то, что пользователь сам добровольно согласился загрузить через браузер. В некоторых браузерах, например Mozilla Firefox, функция чтения и записи уже появилась, но пока доступна не везде.
● Работать с камерой и микрофоном без разрешения пользователя.
● Взаимодействовать с другими окнами и вкладками. Для этого обе страницы должны «согласиться» с этим и иметь специальный код для обмена данными. Это защищает пользователя и не помогает неизвестному сайту взаимодействовать со вкладкой, где открыты, например, соцсети или почта.
● Легко получать данные от других сайтов и доменов. Это возможно с согласия другого сайта или сервера.

Некоторые ограничения на использование JS можно снять — для этого браузер запросит у пользователя разрешение.

Стоит ли учить JavaScript

Тем, кто планирует стать фронтенд‑разработчиком, — однозначно стоит. Этот язык будет основным рабочим инструментом. Без JavaScript невозможно разрабатывать ту часть сайтов и веб-приложений, с которой взаимодействуют пользователи.

У JS есть и другие плюсы для изучения:

● Простой в изучении. Уже через пять минут можно написать и запустить свой первый скрипт. А через пару дней обучения собрать вполне рабочую программу, например расширение для браузера.
● Хорош как база. На нём можно освоить основы, единые для всех языков программирования. И потом перейти к изучению других. Особенно хорошо после JS идут «С-образные» языки: C++, C#, Java, PHP.
● Универсален. Если освоить Node.js, можно перейти с фронтенда на бэкенд или в другую сферу разработки.
● Актуален. JS был создан больше 20 лет назад, но всё ещё развивается и не сдаёт свои позиции как главный язык для фронтенда.
● Имеет множество надстроек. CoffeeScript, TypeScript и Dart и другие надстройки делают код компактнее, чище и строже. Их можно изучить, чтобы развиваться в сфере фронтенда.

Совет эксперта

Статью подготовили:

Поделиться

Читать также:

Java-разработчик: плюсы и минусы профессии, как стать и сколько зарабатывает

Читать статью

Языки программирования: какие они бывают

Читать статью

Учитесь на майских и получайте скидку 7%. Пройдите первый бесплатный урок с 1 по 14 мая и получите промокод на скидку.

Введение в JavaScript

← предыдущая следующая →

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

Что такое JavaScript?

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

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

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

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

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

В браузере JavaScript может делать всё, что относится к манипуляции с HTML-документом, взаимодействию с посетителем и, с некоторыми ограничениями, с сервером:

• Проверять правильностm заполнения пользовательских HTML-форм.
• Взаимодействовать с веб-камерой, микрофоном и другими устройствами.
• Менять стили HTML-элементов, прятать, показывать элементы и т.п.
• Отображать всплывающие и диалоговые окна.
• Реагировать на действия посетителя, обрабатывать клики мыши, перемещения курсора и т. п.
• Посылать запросы на сервер и загружать данные без перезагрузки страницы.

JavaScгipt – невероятно мощный и эффективный язык, который непременно нужно попробовать в деле!

JavaScript в сравнении с ECMAScript

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

Компания Netscape представила язык JavaScript в организацию Ecma International, деятельность которой посвящена стандартизации информационных и коммуникационных систем (изначально ECMA являлся акронимом European Computer Manufacturers Association), где он был утвержден в качестве стандарта ECMAScript в 1997 г.

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

Формально, когда разработчики ссылаются на ECMAScript, они обычно имеют в виду «идеальный» язык, определенный стандартом Ecma. Чаще всего эти два понятия взаимозаменяемы. Поэтому, при упоминании об официальном стандарте в этом учебнике будет употребляться название ECMAScript, а в остальных случаях при ссылках на язык — JavaScript. Также в учебнике будет встречаться общепринятое сокращение ES5 при ссылке на пятый выпуск стандарта ECMAScript.

JavaScript – не Java

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

Java – объектно-ориентированный язык программирования, разрабатываемый компанией Sun Microsystems с 1991 года и официально выпущенный 23 мая 1995 года. Java – это мощный и гораздо более сложный язык программирования, на нём можно писать самые разные программы.

Для интернет-страниц есть особая возможность – написание апплетов.

Апплет – это программа на языке Java, которую можно подключить к HTML при помощи тега <applet>. Jаvа­апплеты запускаются с помощью компилятора. Апплеты Java встраиваются в веб-страницу, но хранятся на диске как отдельные файлы. Это двоичные файлы, и если вы их откроете, то не увидите исходный код апплета.

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

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

Эти требования делают программирование на Java более комплексным, чем программирование на JavaScript.

JavaScript — это легкий язык программирования, который обладает простым синтаксисом, специализированной встроенной функциональностью и минимальными требованиями для создания объектов. Вам не нужно объявлять переменные, классы и методы. Не нужно беспокоиться о том, являются ли методы публичными (public), приватными (private) или защищенными (protected), а также вам не нужно реализовывать интерфейсы. Переменные, параметры и возвращаемые функциями типы JS-скриптов не являются явно типизированными.

Что вам нужно для изучения JavaScript?

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

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

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

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

Чтобы писать и выполнять JavaScript-программы, достаточно установить любой современный интернет-браузер (например Yandex, Internet Explorer, Mozilla Firefox или Google Chrome).

Далее в этом учебнике вы увидите, что код на языке JavaScript можно встраивать непосредственно в HTML-файлы, в теги

<script>, и при загрузке HTML-файла этот код будет выполняться браузером. Стоит отметить, что вам не нужно поступать так всякий раз, когда требуется протестировать короткий фрагмент программного кода JavaScript.

Самый простой способ поэкспериментировать с кодом JavaScript – воспользоваться встроенным инструментом браузера веб-консоль (Web Console).

Как правило, веб-консоль можно запустить нажатием клавиши F12 или горячей комбинации клавиш – Ctrl+Shift+J. Обычно панель или окно типичного «инструмента разработчика» открывается в виде отдельной панели в верхней или нижней части окна браузера как изображено на рис. 1.

Панель включает множество вкладок, позволяющих исследовать структуру HTML-документа, стили CSS и т. д. Среди них имеется вкладка JavaScript Console, где можно вводить строки программного кода JavaScript и выполнять их.

Для более детального анализа программного кода нам понадобится текстовый редактор с дополнительной функциональностью, упрощающей написание и редактирование программного кода. В качестве такового мы будем использовать редактор Notepad++.

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

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

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

Выполнить код »

Обратите внимание: В подобных простых экспериментах с JavaScript можно опускать теги <html>, <head> и <body> в HTML-файле.

Советы по эфективному изучению JavaScript

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

Электронные книги, бесплатные онлайн-курсы и интернет-платформы для обучения с помощью задач – выбор вариантов источников качественных знаний сегодня почти безграничен. Но как мотивировать себя к самостоятельному обучению, как научиться учиться самостоятельно?

Попробуйте следовать нескольким простым, но проверенным на практике советам.

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

Наихудшее время для обучения – когда вы чувствуете усталость. В такие моменты, главное не заставлять себя – вы не получите ожидаемого результата. Человеческий мозг не может учить что-то бесконечно долго – ему нужно давать перерывы. Занимайтесь по принципу 25\5. Попробуйте на себе практику учить 25 минут и отдыхать 5 минут. Ваш мозг привыкнет к таким равномерным нагрузкам и будет работать максимально продуктивно.

Применяйте практики вспоминания – основу обучения. Чем чаще мы вспоминаем информацию, тем дольше она будет храниться в нашей памяти.

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

Параллельно с теоретическими занятиями постоянно практикуйтесь. Для приобретения практического опыта достаточно просто много писать и разбирать примеры хорошего кода. Работая с примерами внимательно пройдите по всем строчкам кода – вы должны убедиться, что понимаете, как работает каждая строчка. Не бойтесь экспериментировать. Учитесь выводить в окне браузера какие-то данные и анализировать их. Например, что и после чего выводится на экран, получили ли вы то, что хотели, и если нет – то почему.

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

← предыдущая следующая →

Please enable JavaScript to view the comments powered by Disqus.

Введение в JavaScript (бесплатное руководство)

Веб-разработка для начинающих >

Урок 5: Введение в JavaScript

1

Учебник 1

2

Учебник 2

3

Учебник 3

4

Учебник 4 Учебник 5

6

Финальный тест Веб-разработка для начинающих

Предыдущий
Учебник Финальная викторина

💬 «В некотором смысле программирование похоже на рисование. Вы начинаете с чистого холста и некоторых основных материалов. Вы используете комбинацию науки, искусства и ремесла, чтобы определить, что с ними делать». (Эндрю Хант)

Почему JavaScript?

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

JavaScript, как вы, возможно, знаете, повсеместно используется в современном мире разработки программного обеспечения. Это основа фронтенд-разработки и ключевой компонент таких фреймворков, как ReactJS, Angular и VueJS. Он также может помочь в создании надежной серверной части с такими платформами, как Nodejs, запускать настольные приложения, такие как Slack, Atom и Spotify, и работать на мобильных телефонах как прогрессивные веб-приложения (PWA).

Короче говоря, он повсюду — и не зря. Во-первых, по сравнению с другими языками, такими как C и Java, JavaScript, как правило, легче изучать. Когда мы говорим «проще», мы имеем в виду, как быстро вы можете превратиться из новичка в JavaScript в того, кто действительно может зарабатывать на жизнь написанием профессионального высококачественного кода JavaScript. Так что в этом смысле он более доступен, чем некоторые другие языки, такие как C и Java.

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

Введение

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

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

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

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

Что мы будем делать сегодня?

1. Основы использования JavaScript: переменные, функции и операторы
2. Выберите элементы HTML с JavaScript
3. Прикрепите прослушиватель кликов к элементам HTML-формы
4. Получить некоторые введенные пользователем значения
5. Проверить нашу форму с помощью JavaScript

Наконец-то ожидание закончилось! Давайте перейдем к делу.

1. Основы JavaScript

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

Начнем с основ.

Написание Javascript

Как и для CSS, мы создадим новый файл для написания JavaScript с именем ‘script.js’ в каталоге портфолио. Теперь откройте файл index.html и непосредственно перед закрывающим тегом body ( ) вставьте эту строку.

Посмотреть изменения кода на GitHub >

Вот и все. Мы связали наш файл сценария в нашем HTML. Чтобы убедиться, что это работает, напишите следующий код в файл script.js.

Сохраните и обновите страницу.

Посмотреть изменения кода на GitHub >

Обратите внимание на диалоговое окно вверху? Это ваша первая строка JavaScript, код предупреждения, выполняемый. Попробуйте изменить текст и обновить. Вы также можете сделать это в CodePen ниже!

Если вы выполнили действия, описанные в предыдущем разделе, вы правильно настроили файл сценария. Мы готовы написать немного JavaScript! Давайте рассмотрим некоторые важные понятия.

Переменные

Переменные — это понятные имена, содержащие данные. Подумайте о том, как вы называете человека по имени, а не «человек» или «одна голова, два глаза, один нос…» и так далее. Переменные — это просто понятные (и описательные) имена для фрагментов данных. Рассмотрим пример.

Здесь мы определяем переменную с именем «приветствие» и присваиваем ей значение «Привет, мир». Это звучит почти как по-английски: «пусть , приветствие , будет , привет, мир, » — видите? Теперь приветствие содержит в себе значение «Hello world» и может использоваться вместо обычного текста «Hello world».

Вы можете написать:

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

Вы заметили, что мы написали «let» перед именем переменной? Это один из способов объявления переменной в JavaScript. Вы можете узнать больше в этом руководстве Mozilla по объявлениям.

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

Арифметические операторы

JavaScript также можно использовать в качестве калькулятора. На самом деле, большая часть кода, который вы увидите в дикой природе, будет везде содержать базовые вычисления. Он поддерживает все обычные функции, называемые операторами, такие как плюс (+), минус (-), умножение (*), деление (/) и так далее. Вы можете сделать что-то вроде следующего, и он должен сказать 5, как и следовало ожидать. Попробуйте запустить CodePen ниже, и вы должны увидеть всплывающее окно в текущем окне браузера.

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

Попробуйте запустить; ты снова получил 5? Нет? Откройте Инструменты разработчика Chrome и перейдите на вкладку Консоль. Это что-нибудь говорит?

Ааа, ошибка в файле script.js в строке 4 (обратите внимание на script.js:4 в правом углу этого красного сообщения об ошибке). Вы заметили ошибку в строке 4? Это предупреждение, в котором отсутствует закрывающая скобка. Исправьте это и попробуйте снова запустить код.

Операторы сравнения

Операторы сравнения сравнивают два объекта вместе. На английском и других языках мы часто задаем такие вопросы, как «Сегодня теплее, чем вчера» или «Эти два здания одного размера?». Ответ на эти вопросы либо да, либо нет, и они обычно сравнивают две вещи (сегодня и вчера, здание 1 и здание 2 и т. д.). В терминах программирования это либо «истина», либо «ложь».

Мы тоже можем задавать вопросы, подобные тем, что в JavaScript! В JavaScript у нас есть следующие операторы сравнения:

Оператор	Вопрос в задании
===	Две вещи равны?*
!==	Две вещи неравны?*
>=	Первое больше второго или равно ему?
<=	Является ли первое значение меньше или равно второму?
>	Первое больше второго?
<	Первое меньше второго?

*Есть менее строгие варианты, а именно == и !=, которые позволяют сравнивать две вещи, которые могут быть разных типов.

«1» == 1 верно, но «1» === 1 неверно, так как «1» — это строка, а 1 — это число.

Мы рекомендуем придерживаться строгого равенства/не равенства (=== и !==) и избегать использования == и !=

Функции

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

Посмотрите, как функция принимает два числа (число1 и число2, формально называемые параметрами функции), складывает их и «возвращает» результат; другими словами, отправляет вам результат. Здесь мы определили, как должна вести себя функция «добавить», но мы ее не используем. Чтобы использовать этот код, нам нужно его «вызвать». Вызов функции — это просто запись ее имени и использование круглых скобок для передачи «аргументов» (фактических параметров).

Возьмем другой пример. Рассмотрим функцию, которая «оповещает» обо всем, что ей отправляется.

В этой функции alertMessage — это имя функции, message — это параметр, и у нас нет возвращаемого значения (обратите внимание на отсутствие оператора return).

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

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

Она работает нормально? Если нет, загляните в консоль и посмотрите, нет ли у вас синтаксических ошибок.

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

Управление потоком

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

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

Если age меньше 18 , отобразите «Вы не взрослый», иначе отобразите «Вы взрослый»

В JavaScript вы ‘написал бы код следующим образом:

Обратите внимание, насколько простая английская версия похожа на код JavaScript. То, что мы только что написали, является примером оператора if..else. Обратите внимание на возраст до 18 лет часть. Это условие. Здесь мы использовали оператор меньше из раздела Операторы сравнения выше.

Общий синтаксис if..else:

Мы будем использовать if..else всякий раз, когда нам нужно будет принять решение в коде, например, убедиться, что наши пользователи ввели правильные данные.

Объекты

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

В нашем примере объекта, который называется «fullName», firstName и lastName являются ключами, а «John» и «Doe» — значениями.

Мы можем получить доступ к firstName, используя нотацию с точкой (.). Далее будет показано предупреждение «Джон».

Как уже упоминалось, внутри объектов могут быть другие объекты и функции.

Мы можем отправить предупреждение, в данном случае с:

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

2. Выбор элементов HTML

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

Для этого давайте сначала выберем нашу кнопку отправки и прикрепим к ней функцию «прослушивания кликов». Когда мы прикрепляем прослушиватель кликов к элементу, он будет вызывать эту функцию прослушивателя при нажатии кнопки. Чтобы иметь возможность выбрать нашу кнопку, мы дадим ей атрибут ID с уникальным идентификатором в нашем файле HTML.

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

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

Обратите внимание, что идентификатор должен начинаться с символа решетки (#), точно так же, как при выборе идентификаторов в CSS. Если бы это было имя класса, вы бы использовали (как вы уже догадались) точку (.), например .submit-button

Совет для профессионалов: Если вы сомневаетесь, попробуйте console.log() to ‘ log», то есть для отображения определенного сообщения в консоли разработчика Chrome — переменной в JavaScript. Например, после написания предыдущей строки попробуйте записать переменную submitButton с

и проверьте вывод. Если вы видите «undefined» или «null», это означает, что что-то не так.

В общем, попробуйте поковыряться с инструментами разработчика. Это требует времени, но как только вы освоитесь, выяснение того, что пошло не так («отладка»), станет проще.

3. Присоединение прослушивателя кликов

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

Обратите внимание, что функция прослушивания кликов — это обычная функция, которую мы передаем функции addEventListener() (да, передача функций другим функциям в качестве аргументов возможна и очень распространена в JavaScript!).

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

Вы также можете попробовать запустить фрагмент кода CodePen. Нажмите кнопку «Отправить сообщение», а затем откройте консоль разработчика в том же окне, в котором вы читаете этот курс. Вы должны увидеть текст, нажатый в консоли.

По сути, мы берем параметр события, предоставленный нашей функции, который содержит сведения о событии клика (например, что было нажато, свойства кнопки и т. д.), и предотвращаем обновление страницы формой с помощью event.preventDefault()

Сохранить и перезагрузить. Откройте Инструменты разработчика, вкладку Консоль и попробуйте нажать кнопку.

Ура!! Оно работает.

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

4. Получение введенных пользователем значений

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

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

Тогда нам нужно узнать важную информацию. Доступ к значению ввода HTML или данным внутри него можно получить с помощью ключа «значение». Помните объекты? Объект элемента ввода HTML будет иметь ключ «значение», который содержит текущий текст внутри элемента.

Наконец, мы выполним console.log значения из input и textarea и посмотрим, что мы получим в переменных emailText и messageText.

Посмотреть изменения кода на GitHub >

Отлично! Вы видели, как сообщение просто регистрируется, безупречно? Красиво, говорим мы. Вместо того, чтобы просто печатать emailText и messageText, мы немного отформатировали его, используя console.log('email:', emailText, …), который будет красиво печатать с меткой email: , напечатанной как есть.

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

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

5. Проверка JavaScript

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

На самом деле, он даже позволяет ввести пустой адрес электронной почты и сообщение. Это не хорошо. Нам нужно будет установить некоторые ограничения на то, что вводится, особенно поле электронной почты. Для наших целей достаточно проверить, содержит ли текст, введенный в поле электронной почты, символ «@». В реальном мире вы захотите проводить более строгие проверки данных.

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

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

Эта функция проверяет, содержит ли предоставленный текстовый параметр электронной почты символ «@». Он использует нечто, называемое условным оператором («если» и «иначе», которые вы видите). Вы можете прочитать это как, если да, он возвращает true. В противном случае возвращается ложь. Давайте проверим это в нашей функции clickListener, выполнив вход в консоль.

Ладно, работает! Он не идеален, но демонстрирует, насколько выразительным является JavaScript. Теперь мы можем собрать все вместе внутри нашей функции clickListener и отобразить соответствующее сообщение.

Попробуйте в CodePen и просмотрите результаты в консоли инструментов разработчика браузера.

Здесь мы сначала проверяем электронную почту. Если это не удается, мы регистрируем сообщение об ошибке и возвращаем false (это один из способов предотвращения дальнейшего выполнения функции, означающий, что наш последний console.log не будет выполнен).

Если блок if не выполняется (это означает, что return false не был обнаружен и функция все еще работает), мы предполагаем, что все прошло хорошо, и отображаем сообщение об успешном выполнении. Довольно мило, да?

Посмотреть изменения кода на GitHub >

Вы правильно поняли? Отличная работа! Если нет, просто внимательно посмотрите. Вы найдете ошибку. Помните, что отладка является важным навыком разработчика!

Резюме

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

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

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

🧐Ежедневное испытание

Итак, мы наконец подошли к нашему последнему ежедневному заданию. Вы в восторге от огромного мира веб-разработки, который лежит за пределами этого краткого курса? Мы уверены!

Вот задачи для сегодняшней задачи:

1. Подобно нашей функции emailValidate , напишите новую функцию validateNSFW (Not Safe For Work), которая будет принимать messageText и вернуть true, если сообщение безопасно для работы. Функция должна возвращать false, если в тексте есть слово «дерьмо». Вы можете использовать функцию .includes() для задачи.

Используйте ранее написанную функцию и подключите ее к функции clickListener аналогично тому, как мы сделали это для emailValidate и messageValidate , показывая ошибку, когда validateNSFW завершается ошибкой.

👋Отходящие слова — Пока до свидания!

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

У этого курса нет шестого дня, так что пока прощаемся. Но нам нравится думать об этом как о начале чего-то интересного, нового начала для вас. Если вы решите заняться веб-разработкой в ​​качестве карьеры, годы спустя вы оглянетесь на тот момент, когда успешно создали свой первый веб-сайт и сделали его красивым и функциональным.

Если вы хотите быть в курсе новых и интересных тем, связанных с веб-разработкой, рекомендуем вам заглянуть в наш блог! Наконец, помните, что бы ни случилось, никогда не переставайте учиться! Еще увидимся!

📗Ссылки

• Переменные
• if. .else (поток управления)
• Функции
• Объекты

❓ Часто задаваемые вопросы

В. JavaScript сильно отличается от того, что мы делали до сих пор. Почему это?

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

В. Это руководство было труднее понять, чем предыдущие?

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

В. Разве мы не должны использовать «функцию» для написания функций? Так было написано в некоторых примерах, которые я читал в Интернете.

A. Можно, но это так же хорошо. По мере того, как вы будете углубляться в JavaScript, вы узнаете, что существует несколько способов делать многие вещи, например, писать функции. Это сводится к варианту использования и вашим предпочтениям, но для простоты мы придерживаемся синтаксиса стрелки ( let name => { } ).

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

A. Нет, есть событие под названием dblclick . У вас может быть прослушиватель событий, прослушивающий это событие (используя синтаксис element.addEventListener(eventName, listenerFunction)). Есть много других полезных событий, которые вы можете прослушать — наведение, прокрутка, нажатие клавиши клавиатуры и т. д.

Предыдущий учебник
Финальная викторина

1

Учебник 1

2

Учебник 2

3

Учебник 3

4

Учебник 4 Учебник 5

6

Финальный тест

Алана

Старшая программа

Советник

Все об E: язык, проникший в JavaScript

Дуг Крокфорд наиболее известен своей многолетней работой с JavaScript и созданием формата обмена данными JSON. Его мнение имеет вес, и Крокфорд сказал, что пришло время отказаться от JavaScript.

«JavaScript, как и другие языки-динозавры, стал барьером на пути прогресса», — сказал Крокфорд в интервью ИТ-аутсорсинговой фирме Evrone. «Мы должны сосредоточиться на следующем языке, который должен быть больше похож на E, чем на JavaScript».

Что такое Е? Википедия называет E «объектно-ориентированным языком для защиты распределенных вычислений», и по замыслу E делает упор на безопасность. Но чтобы узнать больше о влиянии E на JavaScript, The New Stack поговорил с Марком Миллером, главным дизайнером E, который он создал совместно с Дином Трибблом, а также с несколькими коллегами по Electric Communications, включая Крокфорда, Дуга Барнса, Дэна Борнштейна и Чип Морнингстар в середине 1990-х.

«И Дуг, и я имели непосредственное отношение к рождению языка, — сказал нам Миллер. «Мы были очень влюблены в язык, который мы создали».

Миллер считает сам язык мертвым — язык с открытым исходным кодом, E никогда не привлекал к сообществу более 100 пользователей, сказал он.

Но E не стал спокойно относиться к этой спокойной ночи — его влияние все еще заметно в JavaScript сегодня благодаря усилиям Миллера, Крокфорда и других членов комитета по стандартам ECMAScript. Миллер объяснил The New Stack, как E повлиял на JavaScript, как его компания Agoric до сих пор использует идеи E для использования в DeFi с блокчейном, а также какие дополнительные аспекты E он хотел бы увидеть в JavaScript.

12 Angry Men и ECMAScript

«Вы видели фильм 12 Angry Men ?» — спросил меня Миллер. Есть, ответил я. «Я думаю, что этот фильм — лучший способ объяснить, каким был комитет ECMAScript в то время, когда я присоединился к Google».

Крокфорд убедил Миллера присоединиться к комитету в 2007 году в качестве дополнительного представителя Google. Комитет был сосредоточен на обновлении ECMAScript 3 до ECMAScript 4, но дела шли не очень хорошо.

«Комитет заседал непрерывно с 1999 до 2007 года, и у них все еще не было стандарта-преемника. Большая часть комитета была сосредоточена на ECMAScript 4, который, на мой взгляд, был ужасным языком», — сказал Миллер. «Дуг начал как один из противников — персонаж Генри Фонда сказал: «Нет, мы не согласны с этим». -подобный опыт и что у него есть основные элементы, позволяющие ему стать E-подобным безопасным распределенным языком программирования.

«Я присоединился к его восстанию против ECMAScript 4, и к тому времени у этого восстания было несколько других участников — точно так же, как в 12 Angry Men — он постепенно убеждал присяжных перейти в его лагерь», — сказал Миллер. В конце концов восстание победило. Преемником ECMAScript 3 стал ECMAScript 5, версия, разработанная бунтовщиками, в то время как остальная часть комитета сосредоточилась на ECMAScript 4.

«Стандарт ECMAScript 5 действительно имел возможности для использования JavaScript как прямого, простого и безопасного языка программирования. Мы оба очень гордились тем, что сделали для ECMAScript 5», — сказал он.

Одним из фундаментальных аспектов E, которые они привнесли в ECMAScript 5, была поддержка модели безопасности объектов, сказал он.

«Функции JavaScript вместе с объектами JavaScript, используемыми в качестве записей, могут быть объединены для создания шаблона, который Дуг назвал шаблоном объектов-как-замыканий, и если вы используете JavaScript как объекты-как-замыкания, выразительность очень похожа на E , Но что касается ECMAScript 3, в нем еще нет безопасности».

Активаторы, которые они добавили в ECMAScript 5, позволили им написать SES-shim, библиотеку, обеспечивающую безопасное состояние языка, которое теперь называется Hardened JavaScript, сказал Миллер.

Freeze

В ECMAScript 5 они представили несколько активаторов, основным из которых является Object.freeze(). Миллер сказал, что, несмотря на свое название, он не имеет ничего общего с неизменностью. Вместо этого он защищает поверхность объекта от несанкционированного доступа, так что клиенты объекта теперь могут взаимодействовать только с объектом — в соответствии с явным поведением объекта, объяснил Миллер. Поставщик объекта может наполнить его методами, которые фиксируют внутренние переменные состояния, и может инкапсулировать это состояние, чтобы клиенты объекта не могли вмешиваться в него. Он добавил, что под «замораживанием» подразумевается то, что свойства объекта больше не могут быть изменены.

«Клиент больше не может изменять форму объекта. Таким образом, форма объекта фиксируется. Внутреннее состояние теперь скрыто от клиентов», — сказал он. «Теперь объект становится чем-то, с чем можно взаимодействовать только в соответствии с дизайном объекта».

Этот шаг решил проблему безопасности: отравление прототипа, при котором все объекты, созданные в традиционном JavaScript, были изменяемыми и могли быть изменены, чтобы запутать или наблюдать за другими частями программы любым, кто имел к ним доступ.

«Одна из вещей, которые мы делаем с замораживанием и другими активаторами, которые мы получили в ECMAScript 5 (Object.getOwnPropertyNames() и Object.getPrototypeOf()), — это то, что мы можем написать что-то, что мы называем ‘harden(), ‘, который представляет собой транзитивное замораживание, которое проходит по графу объектов, замораживая все объекты, которые он находит, выполняя обход свойств. Мы смогли перечислить все первичные объекты, все объекты, которые неявно разделяют программы JavaScript в одной и той же среде, такие как Array и Array.prototype и т. д.», — сказал Миллер.

I/O Expression

Библиотека SES-shim в начале, когда она инициализируется, делает некоторые исправления на первичных элементах, а затем укрепляет все исходные элементы, сказал он. Это гарантирует, что все неявно общие объекты теперь действительно неизменны.

«Мы немного починили комитет, чтобы у первобытных не было никаких скрытых изменчивых состояний или скрытых способностей ввода-вывода», — сказал он.

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

Еще одним важным фактором стала возможность виртуализации всего ввода-вывода. По словам Миллера, одним из прекрасных и недооцененных аспектов JavaScript является то, что язык предназначен для вычислений, а не для ввода-вывода. Программы JavaScript выражают ввод-вывод, выполняя поиск глобальной переменной предоставленного хостом объекта, такого как «документ» в браузере или «процесс» в Node.

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

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

Защищенный JavaScript — это то, что Agoric использует до сих пор. Agoric пишет большую часть своего кода в дисциплинированном подмножестве Hardened JavaScript под названием Jessie (имя, призванное вызвать сочетание JS и E). Джесси выделяет паттерн Crockford «объекты как замыкания» как альтернативу механизмам наследования JavaScript.

Обещания

Другой важный аспект E, перенесенный на JavaScript, — это неблокирующие обещания, которые E был первым языком, который появился, сказал Миллер. Промисы появились в ECMAScript 6, и эти промисы напрямую основаны на промисах E.

«Промис — это объект, возвращаемый асинхронной функцией. … объект обещания предоставляет методы для обработки возможного успеха или неудачи операции», — поясняется в веб-документах MDN. E в грецком орехе объясняет обещания более подробно. По сути, в системах промисов до E вызывающий поток в какой-то момент блокировался, ожидая завершения операции. Во многом так же, как никто не стал бы ждать, пока кто-то закончит задачу в проекте, прежде чем начать работать над своими собственными задачами, неблокирующие промисы E позволяли обрабатывать возможный успех или неудачу операции, не блокируя ожидание. разрешение.

Промисы JavaScript обеспечивают только локальную асинхронность из коробки, но библиотеки Agoric Endo расширяют их, чтобы также обеспечить E-подобную безопасность распределенных объектов по криптографическим протоколам, превращая JavaScript в E-подобный распределенный безопасный язык.