JavaScript. Типы данных и операторы

1. Литералы 
2. Переменные 
3. Массивы
4. Функции 
5. Объекты 

Они делятся на встроенные и пользовательские (определяемые программистом).

Литералы - данные, непосредственно используемые в программе. Литералы могут быть разных типов.

• Числовые литералы: 10 2.310 2.3е+2
• Строковый литерал: 'Строковый' "Строковый" 

Литералы используются в операциях присваивания:

	var a=10;
	var str='Строка' ;
	if (x=='text') alert(x);

view raw Ex1.js hosted with ❤ by GitHub

Присваивание выполняется справа налево:

result = x = 5+7;

view raw Ex2.js hosted with ❤ by GitHub

Экранирование кавычек в тексте знаком '/"'.

Переменные

Объявление переменных происходит через var, можно определять через запятую, присваивая ей значение или нет. 

	var k;
	var h='Привет';
	var k, h='Привет';
	var t=37,a=3.2;

view raw Ex3.js hosted with ❤ by GitHub

Тип переменной определяется по её значению. JavaScript является гибко типизированным языком в разных частях программы одна и та же переменная может иметь значения разных типов. 

Для определения типа переменой существует оператор typeof();

	var i=5; alert(typeof(i)) ;
	i = new Array() ; alert(typeof(i));
	i=3.4; alert(typeof(i));
	i='Привет'; alert(typeof(i));
	i=window.open() ; alert(typeof(i));

view raw Ex4.js hosted with ❤ by GitHub

Области видимости 

Объявление с var вне функции делает переменную глобальной. 

Объявление var внутри функции делает переменную локальной.  

	function f()
	{
	var k=5;
	}
	f(); alert(k);

view raw Ex5.js hosted with ❤ by GitHub

Конфликт локальных и глобальных переменных 

	var k=7;
	function f() {
	Var k=5;
	}
	Alert(k);

view raw Ex6.js hosted with ❤ by GitHub

Будет выдано 7, так как в блоке вывода фигурирует глобальная переменная.

Примечание, при объявлении можно var не писать. 

for(i=0; i<8; i++)

view raw Ex7.js hosted with ❤ by GitHub

Отсутвие var в функции, делает переменную конструктора. 

	function f()
	{
	Var i; //переменная локальная
	k=5; //переменная глобальная
	}

view raw Ex8.js hosted with ❤ by GitHub

Нестандартный пример с неожиданным выводом 

	function f(i) {
	k=7;
	if(i==3) k=5;
	else {
	f(3);
	alert(k) ;
	}
	}
	f(0);

view raw Ex9.js hosted with ❤ by GitHub

Будет выведено 5, так как вызов f(3) изменил значение переменной k. 

Массивы 

Массивы делятся на встроенные, называемые коллекциями, и пользовательские. 

Для определения пользовательского используется конструктор Array. 

	a = new Array(); //пустой массив длины 0
	h = new Array(10); //массив длины 10
	с = new Array(10, 'Привет'); //массив из двух элементов: числа и строки
	d = [5, 'Тест', 2.71, 'Число е']; //краткий способ создавать массив из 4 элементов

view raw Ex10.js hosted with ❤ by GitHub

Элементы нумеруются с 0. Не могут быть многомерными. Но может быть массив массивов. 

Методы по работе с массивами

Метод join() объединяет элементы массива в строку. 

Обратный метод split() рабивает сроку на элементы массива по разделителю. 

Пример 

	localURL= "file: ///C:/department/internet/js/2.html"
	b=split(':/');

view raw Ex11.js hosted with ❤ by GitHub

Полученный массив 

	b[0] = "file";
	b[1] = "//C";
	b[2] = "department/internet/js/2.html";

view raw Ex12.js hosted with ❤ by GitHub

Меняем значения у 0 и 1 элементов массива:

	b[0] = "http:";
	b[1] = "/www.intuit.ru";

view raw Ex13.js hosted with ❤ by GitHub

Склеим получившиеся значения:

globalURL = b.join("/"); // globalURL = http://www.intuit.ru/department/internet/js/2.html

view raw Ex14.js hosted with ❤ by GitHub

Метод reverse()

Метод reverse() применяется для изменения порядка элементов массива на противоположный. Инициализируем массив:

a = new Array('мать', 'видит', 'дочь');

view raw Ex15.js hosted with ❤ by GitHub

Упорядочим его в обратном порядке, вызвав метод reverse(), тогда новый массив будет содержать:

	a[0] = 'дочь';
	a[1] = 'видит';
	a[2] = 'мать';

view raw Ex16.js hosted with ❤ by GitHub

Метод sort()

Метод sort() интерпретирует элементы массива как строковые литералы и сортируем массив в алфавитном (лексикографическом) порядке. Метод sort() меняет массив. В предыдущем примере, применив a.sort, получим:

	a[0] = 'видит';
	a[1] = 'дочь';
	a[2] = 'мать';

view raw Ex17.js hosted with ❤ by GitHub

Если необходимо отсортировать числа, в функцию sort() добавляется необязательный аргумент, являющийся именем функции, удовлетворяющей следующим требованиям:

• у нее должно быть два аргумента
• она должна возвращать число
• если первый аргумент функции должен считаться меньшим  (большим, равным), чем второй аргумент, то функция должна возвратить отрицательное (положительное, ноль) значение

Функция имеет вид:

a.sort(myfuction)

view raw Ex18.js hosted with ❤ by GitHub

Если нам необходимо сортировать числа, то мы можем использовать следующую функцию:

	function compar(a,b) {
	if(a < b) return -1;
	if(a > b) return 1;
	return 0;
	}

view raw compar.js hosted with ❤ by GitHub

Для примера создадим массив $b = new Array(10,6,300,25,18)$ и сравним результаты сортировки без аргумента и с функцией compar в качестве аргумента:

	document.write("Алфавитный порядок: <br>");
	document.write(b.sort());
	document.write("<br> Алфавитный порядок: <br>");
	document.write(b.sort(compar));

view raw Ex19.js hosted with ❤ by GitHub

</ br> $Алфавитный порядок:)$ </ br> $10, 18, 25, 300, 6)$ </ br> $Числовой порядок:)$ </ br> $6, 10, 18, 25, 300)$ </ br> Метод sort() понимает элементы массива как строки, но не преобразует их в строки.

Операторы

• {...}
• if ... else ...
• ()?
• while
• for
• break
• continue
• return

{...}

Фигурные скобки определяют составной оператор - блок. 

Назначение - определение тела цикла, тело условного оператора или функции.

if ... else ...

Условный оператор применяется для ветвления программы по логическому условию. Есть два варианта синтаксиса:

	if (логическое_выражение) оператор;
	if (логическое_выражение) оператор_1; else оператор_2;

view raw Ex20.js hosted with ❤ by GitHub

Пример использования:

	if (navigator.javaEnabled())
	alert('Ваш браузер поддерживает Java');
	else
	alert('Ваш браузер НЕ поддерживает Java');

view raw Ex21.js hosted with ❤ by GitHub

()?

Этот оператор называется условным выражением, выдает одно из двух значений в зависимости от выполнения некоторого условия. Синтаксис:

(логическое_выражение) ? значение_при_true : значение_при_false

view raw Ex22.js hosted with ❤ by GitHub

Является альтернативой if...else... . Следующие примеры равносильны:

	//1 пример
	TheFinalMessage = (k<5) ? 'Готово!' : 'Подождите...';
	//2 пример
	if (k<5) TheFinalMessage='Готово!';
	else TheFinalMessage='Подождите...';

view raw Ex23.js hosted with ❤ by GitHub

while

Оператор while задает цикл. Определяется следующим образом:

while (условие_продолжения_цикла) тело_цикла;

view raw Ex24.js hosted with ❤ by GitHub

Формально, цикл while работает следующим образом:

1. проверяется условие_продолжения цикла:
• если оно ложно (false), цикл закончен,
• если же оно истинно (true), продолжаем далее
2. выполняем тело_цикла;
3. переходим к п.1.

Такой цикл используется, когда заранее неизвестно количество итераций, например, в ожидании некоторого события. Пример:

	var s='';
	while (s.length < 6){
	s = prompt('Введите строку, длины не менее 6:', '');
	}
	alert('Ваша строка' + s + '.Спасибо!');

view raw Ex25.js hosted with ❤ by GitHub

for

Оператор for - оператор цикла. Он имеет вид:

for (инициализация_переменных_цикла; условие_продолжения_цикла; модификатор_переменных цикла) тело_цикла;

view raw Ex26.js hosted with ❤ by GitHub

Цикл работает следующим образом:

1. выполняется инициализация_переменных_цикла;
2. проверяется условие_продолжения цикла:
• если оно ложно (false), цикл закончен,
• если же оно истинно (true), продолжаем далее
3. выполняем тело_цикла;
4. выполняется модификация_переменных_цикла
5. переходим к п.1.

Пример использования:

	document.write('Кубы чисел от 1 до 100:');
	for(n=1; n<=100; n++)
	document.write('<BR>'+n+'<sup>3<\sup>=' + Math.pow(n,3));

view raw Ex27.js hosted with ❤ by GitHub

Math - втроенный объект, предоставляющий многочисленные математические константы и функции, а Math.pow(n,m) вычисляет степенную функцию $n^{m}$.

break

Оператор break позволяет дострочно покинуть тело цикла. Изменим пример с кубами чисел, распечатаем только кубы, не превышающие 5000.

	document.write('Кубы чисел, меньше 5000:');
	for(n=1, n<=100, n++) {
	s = Math.pow(n,3);
	if (s>5000) break;
	document.write('<BR>'+n+'<sup>3</sup>='+s);
	}

view raw Ex28.js hosted with ❤ by GitHub

Несмотря на то,что переменную n мы заставили пробегать от 1 до 100, т.е. заведомо с запасом, реально же цикл выполнится для значений от 1 до k, где k - номер последней итерации в данном случае.

continiue

Оператор continue позволяет перейти к следующей итерации цикла, пропустив выполнение всех нижестоящих операторов в теле цикла.Если нам нужно вывести кубы чисел от 1 до 100, превышающие 10 000, то мы можем составить такой цикл:

	document.write('Кубы чисел, меньше 5000:');
	for(n=1, n<=100, n++) {
	s = Math.pow(n,3);
	if (s<=10000) continue;
	document.write('<BR>'+n+'<sup>3</sup>='+s);
	}

view raw Ex29.js hosted with ❤ by GitHub

return

Оператор return используют для возврата значения из функции или обработчика события.

	function sign(n){
	if (n>0) return 1;
	if (n<0) return -1;
	return 0;
	}
	alert(sign(-3));

view raw Ex30.js hosted with ❤ by GitHub

Оператор return не только указывает, какое значение должна вернуть функция, но и прекращает выполнение дальнейших операторов в теле функции. При использовании в обработчиках событий оператор return позволяет отменить или не отменять действие по умолчанию, которое совершает браузер при возникновении данного события. Отменить его, однако, можно не для всех событий.

	<FORM ACTION="newpage.html" METHOD=post>
	<INPUT TYPE=submit VALUE="Отправить?" onClick="alert("Не отправим!"); return false;">
	</FORM>

view raw Ex31.html hosted with ❤ by GitHub

В этом примере без оператора return false пользователь увидел бы окно предупреждения "Не отправим!" и далее был бы перенаправлен на страницу newpage.html. Оператор же return false позволяет отменить отправку формы, и пользователь лишь увидит окно предупреждения. Аналогично, чтобы отменить действие по умолчанию для параметров событий onClick, onKeyDown, onKeyPress, onMouseDown, onMouseUp, onSubmit, onReset, нужно использовать return false. Для события onMouseOver с этой же целью нужно использовать оператор return true. Для некоторых же событий, например onMouseOut, onLoad, onUnload, отменить действие по умолчанию невозможно.