Программирование на JavaSсript.

JavaSсript ни в коем случае не путайте с языком программирования Java, не имеет к JavaScript никакого отношения.

Зачем нужен JavaScript?

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

Начало...

Тег «script» Программы на JavaScript могут быть вставлены в любое место HTML-документа внутри блока <script> ,,,</script>.

<!DOCTYPE HTML>
<html>
<body>
....................
HTML-код перед скриптом...
....................
<script>
alert( 'Привет, мир!' );
</script>
....................
HTML-код после скрипта.
....................
</body>
</html>

Коментарии

// Этот комментарий занимает всю строку
/* Пример с двумя сообщениями. Это - многострочный комментарий. */

Строгий режим

На протяжении долгого времени JavaScript развивался без проблем с обратной совместимостью. Новые функции добавлялись в язык, в то время как старая функциональность не менялась. Преимуществом данного подхода было то, что существующий код продолжал работать. А недостатком – что любая ошибка или несовершенное решение, принятое создателями JavaScript, застревали в языке навсегда. Так было до 2009 года, когда появился ECMAScript 5 (ES5). Он добавил новые возможности в язык и изменил некоторые из существующих. Чтобы устаревший код работал, как и раньше, по умолчанию подобные изменения не применяются. Поэтому нам нужно явно их активировать с помощью специальной директивы: "use strict".
В строгом режиме нельзя:
использовать переменные без их объявления;
дублировать имена свойств в объектах;
дублировать параметры функций;
удалять переменные, функции и аргументы;
использовать зарезервированные слова;
использовать устаревшие конструкции.

Переменные

Переменная – это «именованное хранилище» для данных. Мы можем использовать переменные для хранения товаров, посетителей и других данных. Для создания переменной в JavaScript используйте ключевое слово let. Приведённая ниже инструкция создаёт (другими словами, объявляет) переменную с именем «message»:

Браузерные события

Раздичают слнующие браузерные события:
События мыши:
click – происходит, когда кликнули на элемент левой кнопкой мыши (на устройствах с сенсорными экранами оно происходит при касании).
contextmenu – происходит, когда кликнули на элемент правой кнопкой мыши.
mouseover / mouseout – когда мышь наводится на / покидает элемент.
mousedown / mouseup – когда нажали / отжали кнопку мыши на элементе.
mousemove – при движении мыши.

События при нажатии на клавиши

С помощью события onkeydown (нажата клавиша клавиатуры) происходит выполнение соответствующего кода. Код нажатой клавиши получаем с помощью свойства keyCode.

Например:
document.onkeydown = function(e) {
if (e.keyCode == 27) {
alert('Была нажата клавиша ESC');
}
}

Например:
var KEY_ESC = 27;
document.onkeydown = function(e) {
if (e.keyCode == KEY_ESC) {
alert('Была нажата клавиша ESC');
}
}

Функции в языке Java Skript

Для создания функций в языке Java Script применяется следующая конструкция.

Например:
function f1(m1,m2,m3) {
var z = m1 * m2 - m3;
return (z); }

Где:
- function - зарезервированное ключевое слово обозначающее объявление функции.
- f1 - имя функции
- m1, m2 ... m3 - входные параметрв функции, может быть неограниченно много.
- { ... } - так называемое тело функции, где происходят необходимые действия.
- return () - необязательный оператор, применяется в случае вывода информации из функции.
С помощью оператора return можно вывести несколько переменных.
например return {w:x, y:h}; где x и h внутренние переменные

Объектная модель документа «Document Object Model» (DOM)

Основой HTML-документа являются теги.

В соответствии с объектной моделью документа («Document Object Model», коротко DOM), каждый HTML-тег является объектом. Вложенные теги являются «детьми» родительского элемента. Текст, который находится внутри тега, также является объектом.
Все эти объекты доступны при помощи JavaScript, мы можем использовать их для изменения страницы.
Например, document.body – объект для тега <body>.

Создание, вставка и удаление элементов

Создание элемента в JavaScript выполняется с помощью метода createElement:

document.createElement(tagName, [options]);
где:
tagName - Имя тега;
options - опции;
Например:
const elem = document.createElement('div');
Создали блок DIV

СайтоСтроение