Создание динамического наполнения страницы. Основы JavaScript

12.1.5.4. Другие типы

JavaScript различает специальный тип и одноименное примитивное значение null – явное (программно-установленное) пустое значения, и значение undefined типа "undefined", которое говорит о том, что значение еще не было назначено:

typeof null //результат – "object"
typeof undefined //результат – "undefined"

В JavaScript можно объявить переменную не инициализируя ее. В этом случае значение переменной будет равно undefined.

В JavaScript есть логический тип с возможными значениями true и false (оба являются ключевыми словами в JavaScript ). Любое значение может быть преобразовано к логическому в согласии со следующими правилами:

1. false, 0, пустая строка ( "" ), NaN, null, и undefined трактуются как false ;
2. все остальное как true.

Преобразование можно провести в явном виде с использованием функции Boolean():

Boolean("") //результат – "false"
Boolean(234) //результат – "true"

Эта возможность используется достаточно редко, поскольку такое преобразование производится автоматически в тех случаях, когда ожидается логическое значение, как в выражении if. Поэтому обычно просто говорят о "истинных значениях" и "ложных значениях", подразумевая, в какое из логических значений оно преобразуется.

Поддерживаются стандартные логические операторы && (логическое и ), || (логическое или ) и ! (логическое не ).

12.1.5.5. Переменные

Переменная в JavaScript объявляется с использованием ключевого слова var:

var a;
var name = "Иван";

12.1.5.6. Операторы

В JavaScript есть стандартные математические операторы +, -, *, / и % (остаток от деления). Значения присваиваются оператором =, также есть операторы составного присваивания += и -=. Они позволяют записать короче часто встречающиеся выражения типа: x = x operator y:

x += 5
x = x + 5

Можно использовать ++ и -- для увеличения или уменьшения значения переменной на единицу. Помещать этот оператор можно как за символом переменной ( i++ ) так и перед или ( ++i ).

Оператор " + " применяется еще и для конкатенации строк:

"Привет, " + "мир!" //результат – "Привет, мир!"

При добавлении строки к числу последнее автоматически конвертируется в строку:

"3" + 4 + 5 //результат – "345"
3 + 4 + "5" //результат – "75"

Добавление пустой строки к чему-либо можно использовать, как преобразование к строке.

В JavaScript Comparisons есть следующие операторы сравнения: <, >, <= и >=. Их можно использовать и со строками и с числами. Сравнение значений уже несколько сложнее. Оператор двойного равенства производит преобразование типов, что может привести к несколько неожиданным результатам:

"Привет" == "Привет" //результат – "true"
1 == true //результат – "true"

Чтобы этого избежать следует использовать оператор тройного равенства, который учитывает типы:

1 === true //результат – "false"
true === true //результат – "true"

Есть также обратные операторы != и !== для двойного и тройного равенства соответственно.

12.1.5.7. Управляющие структуры

JavaScript имеет Си-подобные управляющие структуры. Условные операторы: if и else, из которых можно делать цепочки:

var name = "Котенок";
if (name == "Щенок") {
    name += "!";
} else if (name == "Котенок") {
    name += "!!";
} else {
    name = "!" + name;
}
name == Котенок!!"

В JavaScript есть циклы while и do-while. Первый можно использовать для бесконечного цикла; второй в том случае если вы хотите, чтобы тело цикла выполнилось как минимум один раз:

while (true) {
    // Бесконечный цикл!
}

do {
    var input = get_input();
} 
while (inputIsNotValid(input))

В JavaScript for такой же, как в C, C# и Java:

for (var i = 0; i < 5; i++) {
    // будет выполнен 5 раз
}

Операторы && и || "закорачиваются", т.е. будет ли выполнен или нет второй операнд, зависит от значения первого. Это можно использовать для проверки значения объекта на null перед тем как пытаться прочитать его свойства:

var name = o && o.getName();

Или для установки значений по умолчанию:

var name = otherName || "default";

В JavaScript есть также тернарный оператор:

var allowed = (age > 18) ? "Да" : "Нет";

Конструкция switch может быть использована для разветвления на основании числового или строчного значения:

switch (action) {
    case 'Рисовать':
        drawit();
        break;
    case 'Есть':
        eatit();
        break;
    default:
        donothing();
}

Если забыть написать break, то выполнение "провалится" в следующий case:

switch (a) {
    case 1: // проваливаемся
    case 2:
        eatit();
        break;
    default:
        donothing();
}

Выражение default необязательно, его можно опустить.

Можно использовать "выражения" как в switch, так и в case ; сравнение будет проводиться с использованием оператора тройного равенства ===:

switch(1 + 3):
    case 2 + 2:
        yay();
        break;
    default:
        neverhappens();
}

12.1.5.8. Объекты

В JavaScript объекты это просто коллекции пар "ключ-значение". Таким образом, они несколько похожи на:

• словари в Python;
• хэши в Perl и Ruby;
• хэш-таблицы в C и C++;
• HashMaps в Java;
• ассоциативные массивы в PHP.

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

"Ключ" должен быть в JavaScript строкой, в то время как значение может быть любым JavaScript типом – включая и сами объекты. Это позволяет строить достаточно сложные структуры данных.

Есть два способа создать объект:

var obj = new Object();

или

var obj = {};

Эти два способа абсолютно идентичны. Второй способ называется объектный литерал.

После создания объекта ему можно присвоить свойства двумя способами:

obj.name = "Иван"
var name = obj.name;

или

obj["name"] = "Иван";
var name = obj["name"];

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

obj.for = "Иван"; // Синтаксическая ошибка, т.к. 'for' является зарезервированным словом
obj["for"] = "Иван"; // Нет ошибки

Объектно-литеральный синтаксис может быть использован для определения свойств объекта в момент его создания:

var obj = {
    name: "Петров",
    "for": "Иван",
    details: {
        color: "orange",
        size: 12
    }
}

Доступ к свойствам можно выстраивать в цепь (т.е. вызывать свойства свойств и т.д.):

obj.details.color //результат – "orange"
obj["details"]["size"] //результат – "12"

12.1.5.9. Массивы

Массивы в JavaScript это специальный тип объектов. Они представляют собой почти рядовые объекты (числовые свойства доступны только через [] синтаксис), но имеют свойство "length", значение которого всегда больше на единицу наибольшего индекса в массиве.

Старый способ создания массивов:

var a = new Array();
a[0] = "собака";
a[1] = "кошка";
a[2] = "мышь";

a.length //результат – "3"

Более удобен "массивно-литеральный" синтаксис:

var a = ["собака", "кошка", "мышь"];

a.length //результат – "3"

Необходимо помнить, что array.length не всегда число элементов массива:

var a = ["собака", "кошка", "мышь"];
a[100] = "лиса";

a.length //результат – "101"

Длина массива это просто число на единицу большее наибольшего индекса.

Если запросить элемент с несуществующим индексом, то будет возвращено undefined:

typeof (a[90]) //результат – "undefined"

Обойти массив можно вот так:

for (var i = 0; i < a.length; i++) {
    // работаем с a[i]
}

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

Безопасный способ добавления элемента к концу массива:

a[a.length] = item; //тоже что и a.push(item);

Поскольку a.length на единицу больше наибольшего индекса, вы можно быть уверенным, что добавлен элемент в пустую позицию в конец массива.

Массивы имеют набор встроенных методов:

• concat возвращает новый массив с элементами, добавленными к нему;
• pop удаляет из массива и возвращает последний элемент;
• push добавляет один или несколько элементов в конец массива (также как ar[ar.length] );
• sort сортирует элементы в качестве необязательного параметра можно передать функцию;
• splice позволяет удалить или заменить целый интервал элементов в массиве;
• unshift добавляет элемент в начало массива.