JavaScript для детей

а не составляется постепенно, шаг за шагом.

Например, чтобы создать массив с числами от 1 до 3, можно вве-

сти литерал массива [1, 2, 3] . Альтернативный способ — создать

пустой массив и методом push добавить в него значения 1, 2 и 3.

Не всегда заранее известно, что за данные будут храниться в мас-

сиве или объекте, поэтому создавать массивы и объекты с помощью

одних лишь литералов не получится.

Key — ключ

{ "key1": 99 }

Ключ, обязательно

Значение

строковый

любого типа

Рис. 4.1. Общий синтаксис создания объекта

На рис. 4.1 показан базовый синтаксис создания нового объекта.

При создании объекта ключ записывается перед двоеточием (:),

а значение — после. Это двоеточие напоминает знак «равно», поскольку

значения, стоящие слева, присваиваются именам (ключам), стоящим

справа, что похоже на создание переменных со значениями. Все пары

«ключ-значение» должны быть разделены запятыми — в нашем примере

эти запятые стоят в конце строк. И обратите внимание, что после завер-

шающей пары «ключ-значение» ("color": "Черепаховый") запятую

ставить не нужно — следом за этой парой ставится закрывающая фигур-

ная скобка.

Ключи без кавычек

Создавая первый объект, мы писали имена ключей в кавычках, однако

это не обязательно. Следующая запись тоже является допустимым лите-

ралом объекта:

71

var cat = {

legs: 3,

name: "Гармония",

color: "Черепаховый"

};

JavaScript знает, что ключи всегда строковые, поэтому можно обхо-

диться без кавычек. В этом случае имена ключей должны соответ-

ствовать тем же правилам, что и имена переменных: например, в них

не должно быть пробелов. Но если ключ указан в кавычках, пробелы

в его имени допустимы:

var cat = {

legs: 3,

Full name —

"full name": "Гармония Филомена Уси-Пусечка Морган",

полное имя

color: "Черепаховый"

};

Помните, что, хотя ключ всегда является стро-

ковым (в кавычках он записан или без), значение,

соответствующее этому ключу, может быть любого

типа — даже переменной, в которой хранятся

данные.

Кроме того, весь объект можно записать одной

строкой, хотя читать такую программу будет, пожа-

луй, не слишком удобно:

var cat = { legs: 3, name: "Гармония", color: "Черепаховый" };

Доступ к значениям внутри объектов

Хранящиеся в объектах значения можно получить с помощью квадрат-

ных скобок — так же, как элементы массива. Единственное различие

в том, что вместо индекса (число) используется ключ (строка).

cat["name"];

"Гармония"

Точно так же, как необязательны кавычки при записи литерала объ-

екта, их можно опускать и при доступе к значениям по ключу. Однако

в этом случае код будет немного другим:

72 Часть I. Основы

cat.name;

"Гармония"

Такую запись называют точечной нотацией. Вместо того чтобы

писать имя ключа в кавычках внутри квадратных скобок, мы просто ста-

вим точку, после которой пишем имя ключа, без кавычек. И, аналогично

ключам без кавычек при записи литерала, такой прием сработает, только

если ключ не содержит специальных символов — например, пробелов.

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

есть у данного объекта. Для этого в JavaScript есть удобное средство —

команда Object.keys():

Object key —

ключ объекта

Dog — пес

var dog = { name: "Оладушек", age: 6, color: "белый", 

Bark — лай

bark: "Гав тяф тяф!" };

var cat = { name: "Гармония", age: 8, color: "черепаховый" };

Object.keys(dog);

["name", "age", "color", "bark"]

Object.keys(cat);

["name", "age", "color"]

Object.keys(anyObject) возвращает массив, содержащий все ключи

объекта anyObject.

Добавление элементов объекта

Пустой объект похож на пустой массив, только вместо квадратных ско-

бок при его создании используются фигурные:

var object = {};

Добавлять элементы объекта можно так же, как элементы мас-

сива, — но используя строки вместо чисел:

var cat = {};

cat["legs"] = 3;

cat["name"] = "Гармония";

cat["color"] = "Черепаховый";

cat;

{ color: "Черепаховый", legs: 3, name: "Гармония" }

Мы начали с пустого объекта под названием cat, а затем пооче-

редно добавили к нему три пары «ключ-значение». Потом мы ввели cat;,

4. Объекты 73

и браузер отобразил содержимое объекта. Тут надо отметить, что раз-

ные браузеры могут показывать объекты по-разному. Например, Chrome

(на момент написания этих строк) выводит объект cat в консоли следу-

ющим образом:

Object {legs: 3, name: "Гармония", color: "Черепаховый"}

Chrome перечисляет ключи в таком порядке — (legs, name, color),

но другие браузеры могут выводить их в другой очередности. Дело в том,

что JavaScript хранит ключи объектов, не упорядочивая их.

В массивах элементы расположены строго один за другим: индекс 0

перед индексом 1, индекс 3 после индекса 2; однако в случае объектов

неясно, как расположить элементы друг относительно друга. Должен ли