Изучение Node. js, JQuery, и Angular. js может быть очень веселым, но я думаю, что иметь некие базовые знания очень важно, и знать, как использовать простой JavaScript. Эта серия статей посвятит вас в JavaScript.
Прежде, чем мы перейдем к синтаксису, давайте узнаем, где мы можем запустить JavaScript.
Традиционно JavaScript использовался внутри браузеров, таких как Mozilla Firefox, Internet Explorer, Chrome, Opera, или Safari. Авторы добавляют JavaScript код в HTML страницы, которые получают пользователи, посещая веб-сайт. JavaScript код выполняется в браузере (то, что мы называем «на стороне клиента», в отличие от запуска «на стороне сервера»).
В последнее время люди начали использовать JavaScript также и на сервере. Возможно, самая известная среда для работы JavaScript на сервере это Node. js. но есть и другие. К примеру, io. js (форк от Node. js).
Мы можем выделить три основные части того, что мы обычно называем «JavaScript».
- Сам язык. Он достаточно стандартный среди различных сред, как на стороне браузера, так и сервера.
- DOM API — как язык может взаимодействовать с различными частями веб страницы в браузере. И, хотя с этой стороны браузеры достаточно близки друг к другу, все же они отличаются. Некоторые библиотеки, особенно заметна Query, пытаются предоставлять унифицированный API.
- API на сервере (или просто API), предоставляемый Node. js или одной из других систем на стороне сервера.
В этой серии статей мы посмотрим все три основных компонента.
Давайте начнем с нескольких простых примеров, которые мы можем запустить в браузере. Возможно, это самый просто способ начать, так как эти примеры требуют только браузер (раз вы это читаете, вероятно, он у вас есть) и текстовый редактор.
Редактор или IDE
Можно использовать любой текстовый редактор.
На MS Windows вы можете использовать даже встроенный Notepad, но я бы рекомендовал что-нибудь более функциональное. Вы можете скачать Notepad++. который очень похож на Notepad, но с кучей разных фич, или Aptana Studio. Научиться работать в последней будет сложнее, так что возможно, вы заходите начать с чего-то попроще.
Вставка или подключение
Вы можете как вставить JavaScript код прямо внутрь HTML файла, так и подключить внешний файл, содержащий весь JavaScript код. В большинстве случаев последнее предпочтительнее, но для нашего первого примера мы вставим JavaScript внутрь некоего HTML (просто для того, чтобы делать всю работу в одном файле).
Чтобы это сделать, мы просто добавляем открывающий тег <script> и закрывающий тег </script>. Между ними мы пишем наш JavaScript код.
Ввод и вывод
Самое первое, что нам нужно узнать, это как взаимодействовать с кодом JavaScript, работающим в браузере. Есть несколько способов, которыми JavaScript может показать текст для пользователя (вывод). Самый простой — функция alert :
alert
Это покажет в браузере всплывающее окно (попап) с текстом. (Вы можете нажать Try! и страница откроется в отдельном окне). Функция alert() сейчас используется редко, но это простой способ продемонстрировать работу JavaScript.
examples/js/alert. html
Если хотите попробовать сделать это самостоятельно, откройте ваш редактор и создайте файл с расширением. html (например, hello. html) и вставьте код ниже в ваш файл. Затем вернитесь в браузер и откройте файл в браузере (большиство браузеров позволяет это сделать с помощью меню File/Open File ).
document. write
examples/js/document_write. html
В этом примере у нас есть некоторый текст (First line), затем JavaScript код, а затем еще немного текста (Last line). Этот код на JavaScript использует функцию document. write для изменения содержимого страницы. Он просто вставит <h1>Hello World</h1> после «First line», но до «Last line».
Эта функция часто использовалась, когда нужно было изменить что-то отображаемое на странице. Сегодня есть более продвинутые способы.
console. log
В заключение давайте посмотрим, как обычно разработчики выводять некую отладочную информацию.
examples/js/console. html
Большинство веб-браузеров предоставляют то, что называется «JavaScript console». Это дополнительное окно (которое не видно в нормально режиме), где браузер выводит предупреждения и ошибки, сгенерированные кодом JavaScript. Разработчики также могут выводить информацию в эту консоль с помощью вызова console. log() .
Для того, чтобы увидеть консоль, вам нужно будет ее открыть. Если вы используете Chrome на OSX вы можете открыть консоль с помощью Command-Option-J .