Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. JavaScript
Code

Что такое JavaScript?

by
Difficulty:BeginnerLength:LongLanguages:

Russian (Pусский) translation by Sergey Zhuk (you can also view the original English article)

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

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

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

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

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

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

Итак начнем.

Определение JavaScript.

Вы наверняка слышали, что JavaScript считают "client-side" скриптовым языком, другими словами это язык программирования, который выполняется в браузере.

Вот альтернативное определение от Википедии:

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

Все вышеперечисленное верно (с различной степенью сложности), но также стоит отметить, что 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.

The landing page for Chrome V8 Googles JavaScript Engine

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

The homepage for Nodejs a runtime engine for writing JavaScript on the server

И все это благодаря языку, который когда то был создан для создания анимации на экране. Все это было сказано, что бы вы, являясь новичком в 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 в моем блоге.

Дополнительные ресурсы

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.