JavaScript для детей. Самоучитель по программированию
жүктеу/скачать 6,41 Mb. Pdf көрінісі
|
JavaScript для детей
Часть I. Основы var cat = { legs: 3, name: "Гармония", color: "Черепаховый" }; JavaScript знает, что ключи всегда строковые, поэтому можно обхо- диться без кавычек. В этом случае имена ключей должны соответ- ствовать тем же правилам, что и имена переменных: например, в них не должно быть пробелов. Но если ключ указан в кавычках, пробелы в его имени допустимы: var cat = { legs: 3, "full name": "Гармония Филомена Уси-Пусечка Морган", color: "Черепаховый" }; Помните, что, хотя ключ всегда является стро- ковым (в кавычках он записан или без), значение, соответствующее этому ключу, может быть любого типа — даже переменной, в которой хранятся данные. Кроме того, весь объект можно записать одной строкой, хотя читать такую программу будет, пожа- луй, не слишком удобно: var cat = { legs: 3, name: "Гармония", color: "Черепаховый" }; Доступ к значениям внутри объектов Хранящиеся в объектах значения можно получить с помощью квадрат- ных скобок — так же, как элементы массива. Единственное различие в том, что вместо индекса (число) используется ключ (строка). cat["name"]; " Гармония " Точно так же, как необязательны кавычки при записи литерала объ- екта, их можно опускать и при доступе к значениям по ключу. Однако в этом случае код будет немного другим: Full name — полное имя 4. Объекты 73 cat.name; " Гармония " Такую запись называют точечной нотацией. Вместо того чтобы писать имя ключа в кавычках внутри квадратных скобок, мы просто ста- вим точку, после которой пишем имя ключа, без кавычек. И, аналогично ключам без кавычек при записи литерала, такой прием сработает, только если ключ не содержит специальных символов — например, пробелов. Теперь предположим, что вы хотите узнать, какие вообще ключи есть у данного объекта. Для этого в JavaScript есть удобное средство — команда Object.keys(): var dog = { name: "Оладушек", age: 6, color: "белый", 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;, Object key — ключ объекта Dog — пес Bark — лай 74 Часть I. Основы и браузер отобразил содержимое объекта. Тут надо отметить, что раз- ные браузеры могут показывать объекты по-разному. Например, Chrome (на момент написания этих строк) выводит объект cat в консоли следу- ющим образом: Object { legs : 3 , name : " Гармония ", color : " Черепаховый "} Chrome перечисляет ключи в таком порядке — (legs, name, color), но другие браузеры могут выводить их в другой очередности. Дело в том, что JavaScript хранит ключи объектов, не упорядочивая их. В массивах элементы расположены строго один за другим: индекс 0 перед индексом 1, индекс 3 после индекса 2; однако в случае объектов неясно, как расположить элементы друг относительно друга. Должен ли ключ color стоять перед legs или после? «Правильного» ответа на этот вопрос нет, поэтому объекты хранят свои ключи без конкретной очеред- ности, в результате чего разные браузеры показывают ключи в разном порядке. Так что никогда не полагайтесь в своих программах на тот или иной порядок ключей. Добавление ключей через точку Новые ключи также можно добавлять через точечную нотацию. Давайте перепишем этим способом предыдущий пример, то есть создадим пустой объект и заполним его данными: var cat = {}; cat.legs = 3; cat.name = "Гармония"; cat.color = "Черепаховый"; Если обратиться к несуществующему свойству объекта, JavaScript вернет специальное значение undefi ned, сообщая таким образом: «здесь ничего нет». Например: var dog = { name: "Оладушек", legs: 4, isAwesome: true }; dog.isBrown; undefined Is awesome — классный Is brown — коричневый 4. Объекты 75 Здесь мы определили три свойства объекта dog: name, legs и isAwesome. Свойства isBrown среди них нет, поэтому dog.isBrown возвращает undefi ned. Массивы объектов До этого момента мы рассматривали только массивы и объекты, в кото- рых содержатся данные простых типов, такие как числа и строки. Однако ничто не мешает сделать элементом массива или объекта другой массив или объект. Например, так может выглядеть массив с объектами, описы- вающими динозавров: var dinosaurs = [ { name: "Тираннозавр рекс", period: "Верхнемеловой" }, { name: "Стегозавр", period: "Верхнеюрский" }, { name: "Платеозавр", period: "Триасовый" } ]; Получить сведения о первом динозавре можно уже известным нам способом — указав индекс в квадратных скобках: dinosaurs[0]; { name: " Тираннозавр рекс ", period: " Верхнемеловой " } А если нужно только название первого динозавра, достаточно ука- зать ключ объекта в еще одних квадратных скобках, следом за индексом: dinosaurs[0]["name"]; " Тираннозавр рекс " Другой вариант — воспользоваться точечной нотацией: dinosaurs[1].period; " Верхнеюрский " ! Точечную нотацию можно использовать только с объектами, для массивов она не подходит. Period — период |