Что такое JavaScript?

Monty Shokeen Last updated Jul 15, 2021
Если сказать, что JavaScript находится на подъеме в веб-разработки, то это будет преуменьшением. В действительности же, несколько лет назад, бывший программист Джеф Атвуд придумал Закон Атвуда, который гласит:
На момент написания этой статьи существует такое большое множество фреймворков и библиотек, что тяжело представить с чего начать, особенно когда вы новичок.
И я знаю, большая часть того, что мы здесь публикуем ориентирована на тех, кто уже имеет опыт написания веб-приложений или имел дело с веб-разработкой. Но это не целевая аудитория этой статьи.
Наоборот эта статья специально написана для тех, кто никогда (или очень редко) не написал ни строки на JavaScript, и хочет узнать больше о языке и понять его. Кроме того мы рассмотрим, как он используется и что от него можно ожидать.
Короче говоря если вы опытный профессионал, то эта статья не для вас; Однако если вам любопытно изучение JavaScript, но вы не уверены, с чего начать, то возможно эта статья поможет направить вас в верном направлении.
Определение JavaScript.
Вы наверняка слышали, что JavaScript считают «client-side» скриптовым языком, другими словами это язык программирования, который выполняется в браузере.
Все вышеперечисленное верно (с различной степенью сложности), но также стоит отметить, что JavaScript может также выполняться и на стороне сервера. Хотя это мы уже забегаем вперед. Вместо этого, давайте сначала поговорим о некоторых пунктах выше, а затем уже перейдем к серверной стороне JavaScript.
- Высокий уровень. Когда язык программирования является языком высокого уровня, то считается что он построен без необходимости знать тонкости о базовой работе компьютера. У вас нет необходимости в управлении памятью, не нужно знать тип процессора, на котором выполняется программа, и не нужно иметь дело с указателями (как например в C или Ассемблере).
- Динимический. Динамические языки позволяют разработчикам расширять определенные аспекты языка, добавляя новый код или предоставляя новые объекты (как например Post объект) во время выполнения программы, вместо ее повторной компиляции. Это мощная возможность JavaScript.
- Нетипизированный. Если у вас есть опыт в программировании, то вы вероятнее всего имели опыт с языками, в которых вы должны указывать тип переменной, с которой вы работаете. Например, ваша переменная содержит значение типа string или boolean . В JavaScript это необязательно. Вместо этого вы просто объявляете переменную с помощью ключевого слова var .
- Интерпретируемый. Когда язык является компилируемым, то код, который вы пишете, преобразуется в исполняемый бинарный файл, который вы можете передать другим. В Windows такие файлы известны как EXE файлы. В OS X это обычно программы, которые вы скачиваете из App Store или те, которые вы перетаскиваете в папку Applications. JavaScript является интерпретируемым, это означает что ему не нужен компилятор. Вместо этого код интерпретируется (как PHP), так что существует промежуточное программное обеспечение, называемое интерпретатором, которое находится посередине между вашим кодом и компьютером и транслирует инструкции.
- Стандартизирован. JavaScript является стандартизированным (официальное имя ECMAScript), что означает что любой браузер, реализующий стандарт, будет предоставлять те же возможности, что и любой другой такой же браузер. Если бы они не были стандартизированы, то Chrome бы предоставлял некоторые функции, которых не было бы в Edge и наоборот.
Теперь, когда мы рассмотрели атрибуты языка, мы можем обсудить некоторые его аспекты и нюансы.
Хотя все, перечисленное выше и является важным, но также необходимо знать, каким образом язык работает (особенно если вы работали с другими языками), так что вы преступаете к разработке с осознанием того как язык должен работать, а не как он может работать.
Я в этой статье опишу то, как язык работает, так что вы можете начать писать код с пониманием того, что вы делаете.
О языке
Прежде всего JavaScript — это объектно ориентированный язык программирования, но он вероятно немного отличается от того, что вы обычно видели (если вы ранее использовали объектно ориентированный язык программирования).
JavaScript является языком прототипов. Это означает, что все объекты в JavaScript, такие как String основаны на прототипах.
Это позволяет нам, как разработчикам, добавлять дополнительный функционал к объектам, используя прототипное наследование.
Я могу утверждать, что, если вы никогда не работали с объектно ориентированным языком раньше, то будете иметь преимущество, потому что у вас нет готовой концептуальной модели для того чтобы представлять то, как это работает.
Если с другой стороны, вы прежде работали с такими языками, то следует определить различия между прототипным и классическим наследованием.
- В классическом наследовании, мы как разработчики, пишем класс. Множество объектов может быть создано из этого единичного класса. Кроме того, мы можем затем написать другой класс, который наследуется от этого класса и затем создавать экземпляры этих классов. В такой ситуации, подклассы делят код со своим базовым классом. Таким образом, когда вы создаете инстанс подкласса, вы получаете функционал и подкласса и родительского класса.
- В прототипом наследовании, нет такой вещи как классы. Вместо этого вы просто определяете объект и необходимую функциональность. Когда вам необходимо добавить функциональность к существующему объекту, вы делаете это добавляя ее к прототипу объекта. Если вы попытаетесь вызвать метод такого объекта как Number , то сначала JavaScript попытается найти этот метод в этом объекте. Если его там не будет, то будет дальше двигаться вверх по цепочке, пока не найдет нужный метод (который может находится в базовом Object ).
Последней и, возможно, наиболее важной вещью, является то, что когда вы делаете изменения в объекте через его прототип, то они становятся доступны для всех, кто использует этот объект (по крайней мере в контексте вашей среды).
Это действительно мощный инструмент, но он так же заставляет немного изменить ваше мышление, если вы до этого не пользовались им.
Как мы используем JavaScript?
Что касается того, как нам правильно использовать JavaScript, то это по большей части зависит от ваших конечных целей. С одной стороны, работа с JavaScript подразумевает, что вы хотите получить какие-то действия на web-странице. Предполагалось, что для управления поведением.
Это может быть управление элементом, удаление (или скрытие) элемента, или вещи вроде того. Затем веб-сайты стали по-немногу расширяться и браузеры научились делать асинхронные вызовы на сервер, обрабатывать ответ, а затем изменять состояние страницы на основе этого ответа.
Все это достигается с помощью Ajax. Если вы это читаете, то скорее всего знакомы с данным термином. Если нет, то можете рассматривать его как вызов JavaScript сервера, на котором находится страница и затем обработка ответа от него, при этом все происходит без перезагрузки страницы.
Но и это еще не все.
Google разработала весьма сложный движок JavaScript, известный как V8, так же и другие браузеры работают над предоставлением оптимальной производительности JavaScript.


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


И все это благодаря языку, который когда то был создан для создания анимации на экране. Все это было сказано, что бы вы, являясь новичком в JavaScript, не недооценивали его.
Что следует ожидать от языка?
Все описанное выше конечно же интересно читать, и здорово осознавать возможности языки, но с практической точки зрения, что нам следует ожидать от JavaScript?
Независимо от того являетесь ли вы новичком или вы хотите освоить новый язык, имея уже опыт работы с другими, у вас всегда имеется набор ожиданий того, что язык может предложить.
Хотя мы и говорили о том, как работает язык изнутри, но мы не обсуждали объекты, которые доступны в языке, не говоря уже о API-интерфейсах. Честно говоря, обсуждение API и встроенных функций — это уже тема для отдельной статьи.
Но обсуждение встроенных объектов? Это мы можем рассмотреть перед окончанием статьи:
- Object. Базовый объект, от которого все остальные объекты наследуют некий базовый функционал.
- Function. Поскольку JavaScript является полностью объектно- ориентированным языком, то это означает, что все является объектом, включая функции. Таким образом, когда вы создаете функцию, вы создаете ссылку на объект типа Function. И функции имеют свойства, которые вы можете просмотреть вовремя исполнения (как и переданные в нее аргументы).
- Boolean. Этот объект является объектом-оберткой над булевым значением. В большинстве языков булевы значения могут быть либо true , либо false . В JavaScript по-прежнему можно работать с этими значениями, но их следует рассматривать как объекты.
- Number. Во многих языках программирования есть примитивные типы данных, такие как float , int , double и другие. В JavaScript, есть только тип number, и он также является объектом.
- Date. Работа с датами в программировании редко бывает приятным занятием, особенно когда вы имеете дело с часовыми поясами. Я не могу сказать, что JavaScript решит все ваши проблемы, связанные с часовыми поясами, но может сильно упростить работу с датами.
- String. Почти все языки программирования имеют примитивный тип данных — строка. В этом JavaScript мало чем отличается, и как следовало ожидать, строка является объектом со своими собственными свойствами.
Запомните, что все типы данных, перечисленные выше, являются объектами со своими собственными свойствами и методами. Но это не означает, что вам необходимо вызывать конструктор для создания переменных. Вы можете создавать строки, числа или булевы значения следующим образом:
Но, в конечном счете, они по-прежнему являются объектами.
Чтобы было ясно, это всё — основные объекты. Есть еще несколько специальных объектов, которые следует рассмотреть, если вы собираетесь работать с обработкой ошибок, различными типами коллекций и прочее.
Если эта тема вас заинтересовала, то я настоятельно рекомендую вам данную страницу из Mozilla Developer Network.
Какие библиотеки и фреймворки доступны?
Если вы следили за различными фреймворками, библиотеками и другими инструментами, связанными с JavaScript, то не останетесь позади всего этого огромного многообразия.
Однако данная статья нацелена на тех, кто только собирается начать изучения JavaScript. Теперь когда у вас есть базовое представление о том, как структурирован и как работает язык, пришло время ознакомиться с библиотеками и фреймворками, которые помогают в разработке веб-приложений.
- jQuery — это библиотека, которая призвана обеспечить кросс браузерный интерфейс API, который позволяет «писать меньше, а делать больше».
- Angular — JavaScript фреймворк, нацеленный на создание одно-страничных приложений.
- React — это библиотека JavaScript для создания пользовательских интерфейсов.
- Backbone нацелен на создание структурировнных веб-приложений через использование моделей, коллекций и отображений.
- Ember.js — другой фреймворк для «создания амбициозных веб-приложений».
- И много других.
Это далеко не полный перечень того, что доступно, но это стартовый список, который вы должны по крайней мере знать, даже если и не будете с ними работать.
И как только вы начнете изучать JavaScript и начнете использовать некоторые из этих инструментов, вы сможете обнаружить насколько популярными они являются.
Изучая JavaScript
Как вы могли ожидать, Envato предлагает «возможности для обучения миллионам по всему миру». Так что как же не мог этот пост включить в себя ссылки на другие популярные статьи и курсы по JavaScript.
Все эти ресурсы идеальны для начала работы с JavaScript и добавления его в ваш багаж навыков разработки для веб.
Заключение
JavaScript всегда находится рядом с веб-разработкой. Хотя вы можете и не использовать то, что называете «vanilla JavaScript» и выбрать любую из доступных библиотек или фреймворков, JavaScript является языком который должен знать почти любой веб-разработчик.
Конечно же не все работают с фронтендом. Некоторые разработчики занимаются только серверной стороной, некоторые — наоборот только клиентской. Тем не менее мы все должны работать вместе, чтобы убедиться, что различные части нашего приложения корректно общаются друг с другом.
С этой целью важно понимать, по крайней мере как данные на стороне клиента отправляется на сторону сервера с помощью JavaScript, и как они обрабатываются на стороне сервера и затем возвращаются клиенту.
Не спешите сразу отказываться от JavaScript, только лишь потому что вы не являетесь фронтенд разработчиком. Вероятнее всего тот, с кем вы работаете, будет его использовать и ему может потребоваться ваша помощь, чтобы связать вместе части приложения.
Конечно, эта статья является всего лишь царапинами на поверхности. Как я сказал в самом начале, цель этой статьи — объяснить, что такое JavaScript, как он используется и чего ожидать от него, особенно для тех, кто только знакомится с языком.
Если вам понравилась эта статья, можете просмотреть мои курсы и обучающие материалы в моем профиле, также если вы заинтересованы, то можете найти много статей о WordPress и разработке под WordPress в моем блоге.
Что такое JavaScript и для чего он нужен
В этой статье мы расскажем, что такое JavaScript (Джава Скрипт), приведём примеры, поясним для чего он нужен в html коде. Дадим ответы на популярные вопросы вебмастеров.
1. Что такое JavaScript простыми словами
JavaScript является объектно-ориентированным и интерпретируемым языком. Также он системно-независим (работает на любых платформах). Зачастую JS код называют «скриптами». Можно сказать, что этот язык «заточен» лишь для веб-программирования.
Синтаксис языка во многом напоминает Си и Java, семантически же язык гораздо ближе к Self, Smalltalk.
2. Задачи решаемые JavaScript
- Проверку полей html форм (тег <form>) до того, как они передались на сервер;
- Информационные сообщения с предупреждениями;
- Эффекты для выделения главных элементов и частей страницы;
- Оригинальные выпадающие меню;
- Математические вычисления;
Обычно с помощью JavaScript делают слайдеры. Можно также выводить контент через AJAX, это позволяет скрывать из html-кода ненужные или повторящиеся элементы страницы сайта. Изучать эти коды новичку не имеет смысла, т.к. они довольно сложные.
3. Как включить поддержку JavaScript в браузере
Все браузеры по умолчанию поддерживают JavaScript. Джава Скрипт уже включен в браузерах, если нет, то ниже представлены инструкции для различных браузерах по включению JS.
1. Как включить JavaScript в Firefox
Зайдите в «Инструменты», далее в «Настройки». Затем выберите вкладку «Содержимое» и поставьте галочку напротив надписи «Использовать JavaScript».
2. Как включить JavaScript в Google Chrome
«Настройка и управление Google Chrome» -> «Параметры» -> «Расширенные» -> «Личные данные (Настройки содержания)» -> «JavaScript:» Разрешить всем сайтам использовать JavaScript (рекомендуется) или запретить выполнение JavaScript на всех сайтах
3. Как включить JavaScript в Opera
Нажать на клавишу F12 Выбрать пункт «Включить JavaScript»
4. Как включить JavaScript в Internet Explorer
«Сервис» -> «Свойства обозревателя» -> вкладка «Безопасность» -> выбираем зону «Интернет» -> кнопка «Другой» -> пункт «Сценарии» -> «Разрешить сценарии»
4. Пример: как вставить JavaScript в html страницу
Код JavaScript вписывается прямо в html код страницы. Для его выделения используют специальные теги:
Атрибут type=’text/javascript’ указывать не обязательно, но желательно.
Использовать <script></script> можно в заголовочных тегах <head>, так и просто в теле страницы <body> .
Писать html теги между открывающим и закрывающим тегом script запрещено. Это место только для кода на JavaScript.
Чтобы не дублировать один и тот же JavaScript на каждой странице его обычно выносят в отдельный файл с расширением «.js». Этот файл можно подключить в любом месте кода html.
4.1. Пример 1. Всплывающие сообщение Hello, World на JavaScript
Ниже представлен пример html код, который при загрузке страницы с помощью JavaScript выводит всплывающее сообщение «Hello, World».
При нажатие на ссылку будет выведена форма с просьбой подтвердить переход по ссылке.
4.2. Пример 2. Альтернатива с обработкой javascript
Ниже представлен пример html кода с обработкой кода JavaScript с помощью идентификатора id.
4.3. Пример 3. Смена цвета объекта при наведении курсора
При наведении курсора мышки на определенные области, они изменяют цвет. Делается это через JavaScript. Например:
Код этого примера:
Это лишь самые элементарные вещи на JavaScript. Его возможности довольно большие. Не даром в литературных магазинах по этому языку можно найти отдельные книги.
Базис JavaScript: для чего хорош и где применяется
Перед тем как перейти к основам JavaScript, необходимо разобраться с назначением данного языка программирования.
Самое известное применение JS — это, конечно же, веб-разработка. Чаще всего к JS прибегают, когда нужно добавить динамичности на сайт или сделать браузерное приложение, но при желании на нём можно написать и бэкенд.
- прототипным стилем программирования (вместо классов и наследования — прототипы и клонирование);
- слабой динамической типизацией;
- функциями как объектами первого класса (то есть их можно создавать прямо во время выполнения программ).
Итак, в каких областях нашёл себя JavaScript.
Динамические веб-страницы
Всплывающие подсказки, движущиеся картинки, падающие снежинки и прочие анимашки — за всем этим можно идти к JS. JS-код встроен в веб-страницу, и когда пользователь открывает её, скрипт выполняется прямо в браузере.
Без JavaScript почти невозможно создать полноценный сайт. Добавьте к JS знания HTML, CSS, и вы получите неплохой набор навыков начинающего фронтенд-разработчика. Для полноты картины стоит освоить пару популярных фреймворков: например React, Svelte, Vue.js.
Веб-приложения и игры
JavaScript пригодится и здесь. Для примера, Google Maps и веб-клиент Gmail используют JavaScript. А если вы хотите написать игру — возьмите JS, HTML5, одну из готовых библиотек (скажем, EaselJS или PixiJS) и создайте свою браузерную бродилку, «три в ряд» или во что там сейчас все играют.
Расширения для браузера
Раз в основе JavaScript лежит выполнение кода в браузере, это отличный выбор для создания браузерных расширений. Напишите свой чекер почты или, например, счётчик активности, который будет отслеживать, сколько времени вы провели за работой, а сколько за просмотром соцсетей.
Серверные приложения
Да, на JavaScript спокойно можно написать веб-сервер. Но если в браузере у JS практически нет конкурентов, то в мире бэкенда ему приходится соревноваться с другими языками: PHP, Python и прочими. Главное преимущество JavaScript в этой битве — возможность разрабатывать клиентскую и серверную часть на одном и том же языке. Чтобы писать бэкенд на JavaScript, обычно используется движок Node.js — он позволяет выполнять JS-код вне браузера.
Мобильные приложения
Возможно, не самое популярное, но вполне реальное применение JavaScript. Чаще всего мобильные приложения разрабатываются на языках, специфичных для операционной системы (Swift для iOS и Java/Kotlin для Android). JavaScript же хорош тем, что позволяет создавать кроссплатформенные приложения — для этого можно использовать фреймворки React Native, Ionic или PhoneGap. Хотя и тут у JS есть конкуренты — например языки Kotlin и Dart.
Что такое JavaScript

От автора: приветствую вас, друзья. Данная статья откроет цикл материалов для новичков, которые дадут общее направление для изучения JavaScript. И начнем мы с того, что же такое JavaScript и для чего он нужен. Также мы узнаем, как подключить JavaScript к вашей странице. Статья предназначена для новичков, которые только начинают знакомиться с JavaScript.
Итак, что же такое JavaScript. К слову, относительно названия языка. Не путайте JavaScript с языком программирования Java, как это делает большинство новичков. Это абсолютно разные языки, которые похожи лишь названием. Собственно, изначально JavaScript назывался LiveScript, однако волею маркетологов он сменил свое название на JavaScript, которое за ним сохранилось и по сей день.
JavaScript — это клиентский язык программирования, разработанный, прежде всего, для интерактивности веб-страниц. Клиентский означает, что он выполняется не на стороне сервера (как, скажем, PHP), а на стороне браузера. В этом огромный плюс JavaScript, поскольку ему не нужно специальное окружение, в любом современном браузере имеется интерпретатор JavaScript, поэтому для работы с JavaScript достаточно лишь браузера.
Проще говоря, JavaScript создавался с целью как-то оживить и украсить наш HTML. Ведь в 90-е годы, а именно тогда и был создан JavaScript, никто не знал ни о HTML5, ни о CSS3. Да что там говорить о CSS3, просто о CSS никто в то время и не слышал. Оформление страницы осуществлялось непосредственно в коде HTML посредством тегов и их атрибутов: font, color, bgcolor и др… кошмар и ужас, в общем.
Единственным глотком свежего воздуха тогда был Flash, который делал странички интерактивными. Другой интерактивности просто не было. Банально изменить поведение ссылки при наведении было невозможно. Вот для таких вещей в первую очередь и задумывался JavaScript.

Профессия Frontend-разработчик PRO
Готовим Frontend-разработчиков с нуля
На курсе вы научитесь создавать интерфейсы веб-сервисов с помощью языков программирования и дополнительных технологий. Сможете разрабатывать планировщики задач, мессенджеры, интернет-магазины…
Создатель JavaScript Брендан Эйх задумывал сделать его достаточно простым в освоении и использовании языком и, в целом, у него это получилось. Уже через несколько минут после начала изучения JavaScript вы можете написать свою первую простейшую программу на этом языке.
Давайте же попробуем проверить это утверждение и напишем свою первую программу на JavaScript. Огромным плюсом JavaScript является его полная интеграция с HTML, а это значит, что мы можем вставить нашу программу на JavaScript в любое разумное место нашего HTML документа (или, к примеру, файла .php, если он отвечает за разметку).
Для того, чтобы использовать JavaScript в коде HTML, нам необходим специальный тег script, внутри которого и пишется программа на JavaScript. Вот так, к примеру: