JavaScript
Javascript – скриптовый язык, предназначенный для создания интерактивных веб-страниц. Javascript не требуется компилировать, он подключается к HTML-странице и работает "как есть".
Что умеет javascript:
изменять веб-страницу, писать на ней текст, добавлять и удалять теги, менять стили элементов;
реагировать на события: скрипт может ждать, когда что-нибудь случится (клик мыши, окончание загрузки страницы) и реагировать на это выполнением заданной функции;
выполнять запросы к серверу и загружать данные без перезагрузки страницы.
Подключение Javascript
1. Команды внутри страницы.
Javascript подключается напрямую в HTML-файл. Самый простой способ – написать javascript-команды внутрь тега <script> где-нибудь в теле страницы. Когда браузер читает HTML-страничку, и видит <script>, он первым делом читает и выполняет код, а только потом продолжает читать страницу дальше.
Пример 1. В данном примере будет показано начало страницы, затем три раза выполнится функция alert, которая выводит окошко с информацией, а только потом появится остальная часть страницы.
<html>
<body>
<h1>Считаем овечек</h1>
<script type="text/javascript">
for(var i = 1; i <= 5; i++) {
alert("Овечка номер " + i + "!")
}
</script>
<h1>Расчет окончен.</h1>
</body>
</html>
В этом примере использовались следующие элементы.
<script type="text/javascript"> ... </script>
Тег <script> сообщает браузеру о том, что внутри находится исполняемый скрипт. Атрибут type говорит о том, что это javascript. Вообще говоря, атрибут может отсутствовать - разницы нет, но с точки зрения стандарта его следует указать.
Конструкция for – обычный цикл, по синтаксису аналогичный другим языкам программирования.
Объявление var i – объявление переменной внутри цикла: i – локальная переменная.
Функция alert – выводит сообщение на экран и ждет, пока пользователь не нажмет ОК.
2. Команды в заголовке
Обычно javascript стараются отделить от собственно документа. Для этого его помещают внутрь тега HEAD, а в теле страницы по возможности оставляется чистая верстка.
Пример 2. В данном примере javascript-код только описывает функцию count_sheeps, а ее вызов осуществляется по нажатию на кнопку input.
<html>
<head>
<script type="text/javascript">
function count_sheeps() {
for(var i=1; i<=5; i++) {
alert("Овечка номер " + i + "!")
}
}
</script>
</head>
<body>
<input type="button" onclick="count_sheeps()" value="Считать овечек!"/>
</body>
</html>
3. Внешние скрипты
Иногда javascript-код вообще не пишут в HTML, а подключают отдельный файл со скриптом:
<script src="/scripts/main_script.js"></script>
При этом файл /my/script.js содержит javascript-код, который иначе мог бы находиться внутри тега <script>. Это удобно, потому что один и тот же файл со скриптами можно подключать на разных страницах. При правильных настройках сервера браузер закеширует его и не будет скачивать каждый раз заново.
Чтобы подключить несколько скриптов, используют несколько таких тегов:
<script src="/scripts/script1.js"></script>
<script src="/scripts/script2.js"></script>
При указании атрибута src содержимое тега игнорируется, то есть одновременно подключить внешний файл и написать что-то внутри тега нельзя. Придется делать два разных тега <script>: первый с src, второй – с командами, которые будут выполнены после выполнения внешнего файла.
Основные элементы языка
Как и во многих языках, предложения на языке javascript можно разделять точкой с запятой, но при переходе на новую строку в javascript точка с запятой необязательна, ее можно не ставить.
Например, эти две строки полностью эквивалентны:
a = 5
a = 5;
В javascript перевод строки почти всегда подразумевает точку с запятой. Например:
Вот так не будет работать:
var a = "длинная
строка "
Так как перевод строки подразумевает точку с запятой, и javascript поймет это как
var a = "длинная;
строка ";
Комментарии возможны в двух вариантах // и /*...*/:
// однострочные комментарии
/*
многострочные
комментарии
*/
Переменные в javascript слабо типизированы. Это означает, что при объявлении не нужно указывать тип. Можно присвоить любой переменной любое значение. Однако при этом интерпретатор javascript (браузер) всегда знает, какого типа значение содержит данная переменная, а значит, какие операции к ней применимы.
Объявление переменных:
var orange = "Апельсин"
Переменную не обязательно объявлять. Достаточно ее просто присвоить:
x = 5
Строки
Для объявления строк используются кавычки: простые ' или двойные ". Между ними нет никакой разницы.
a = 'моя'
b = "строка"
Для конкатенации строк используется оператор +.
Пример 3.
a = "моя"
b = "строка"
alert(a + ' ' + b)
Числа
Все числа хранятся в формате float64, т.е 8 байт с плавающей точкой. В этом формате не всегда возможны точные вычисления.
Пример 4. alert(0.1+0.2) // выведет не 0.3! |
Конструкции языка
Цикл While
Две формы while:
1. Цикл с предусловием (проверка условия в начале):
while(i<5) { … }
2. Цикл с постусловием (проверка условия в конце):
do { … } while (i<5)
Цикл For
for (var i=0;i<10;i++) { ...}