Объекты в javascript кратко

Обновлено: 04.07.2024

Объект в JS — это набор свойств и их значений в памяти, на которые можно сослаться с помощью идентификатора.

Все объекты в JavaScript являются потомками Object ; все объекты наследуют методы и свойства из прототипа объекта Object.prototype , хотя они и могут быть переопределены.

ключ — это идентификатор (или имя) свойства (тип String или Symbol),
значения могут быть любыми (любой тип, включая другие объекты).

Свойства объекта также иногда называют полями объекта .

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

Свойства, значениями которых являются функции, называются методами .

После имени свойства следует двоеточие ":", и затем указывается значение свойства. Если в объекте несколько свойств, то они перечисляются через запятую.

Имя свойства должно соответствовать ограничениям, касающимся имён переменных JavaScript (например, должно содержать только буквы, цифры или символы $ и _), но может быть невалидным или состоять из нескольких слов, но тогда оно должно быть заключено в кавычки :

Есть два типа свойств, отличающихся определенными атрибутами:

свойство-значение (ассоциирует ключ со значением);
свойство-акцессор (ассоциирует ключ с одной из двух функций-акцессоров: геттер и сеттер).

Особенности сравнения двух объектов

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

Два массива не считаются равными, даже если они имеют один и тот же набор элементов, следующих в том же порядке.

Чтобы подчеркнуть отличие от простых типов JavaScript, объекты иногда называют ссылочными типами . Если следовать этой терминологии, значениями объектов являются ссылки, и можно сказать, что объекты сравниваются по ссылке (см. ниже):

ВАЖНО! значения двух объектов считаются равными тогда и только тогда, когда они ссылаются на один и тот же объект в памяти.

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

Виды объектов в JavaScript

Все объекты можно условно разделить на несколько видов:

глобальный объект;
объектные типы:
- собственно объекты (коллекции свойств и их значений);
- массивы (коллекции данных, упорядоченных в виде списка элементов);
- функции (фрагменты программного кода (подпрограммы), позволяющие формализовать определённую логику поведения и обработки данных).
объекты-обертки.

Глобальный объект - это объект JavaScript, свойства которого являются глобальными идентификаторами, доступными из любого места программы на JavaScript.

Когда выполняется запуск интерпретатора JavaScript (или когда вебброузер загружает новую страницу), создается новый глобальный объект, в котором инициализируется начальный набор свойств, определяющих:

глобальные свойства, такие как undefined , Infinity и NaN ;
глобальные функции, такие как isNaN() , parseInt() и eval() ;
функции-конструкторы, такие как Date() , RegExp() , String() , Object() и Array() ;
глобальные объекты, такие как Math и JS0N .

В программном коде верхнего уровня, т. е. в JavaScript-коде, который не является частью функции, сослаться на глобальный объект можно посредством ключевого слова this :

JavaScript спроектирован на основе простой парадигмы. В основе концепции лежат простые объекты. Объект — это набор свойств, и каждое свойство состоит из имени и значения, ассоциированного с этим именем. Значением свойства может быть функция, которую можно назвать методом объекта. В дополнение к встроенным в браузер объектам, вы можете определить свои собственные объекты. Эта глава описывает как пользоваться объектами, свойствами, функциями и методами, а также как создавать свои собственные объекты.

Обзор объектов

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

В JavaScript объект — это самостоятельная единица, имеющая свойства и определённый тип. Сравним, например, с чашкой. У чашки есть цвет, форма, вес, материал, из которого она сделана, и т.д. Точно так же, объекты JavaScript имеют свойства, которые определяют их характеристики.

Объекты и свойства

В JavaScript объект имеет свойства, ассоциированные с ним. Свойство объекта можно понимать как переменную, закреплённую за объектом. Свойства объекта в сущности являются теми же самыми переменными JavaScript, за тем исключением, что они закреплены за объектом. Свойства объекта определяют его характеристики. Получить доступ к свойству объекта можно с помощью точечной записи:

Как и все переменные JavaScript, имя объекта (которое тоже может быть переменной) и имя свойства являются чувствительными к регистру. Вы можете определить свойство указав его значение. Например, давайте создадим объект myCar и определим его свойства make , model , и year следующим образом:

Неопределённые свойства объекта являются undefined (а не null ).

Свойства объектов JavaScript также могут быть доступны или заданы с использованием скобочной записи (более подробно см. property accessors). Объекты иногда называются ассоциативными массивами, поскольку каждое свойство связано со строковым значением, которое можно использовать для доступа к нему. Так, например, вы можете получить доступ к свойствам объекта myCar следующим образом:

Имена свойств объекта могут быть строками JavaScript, или тем, что может быть сконвертировано в строку, включая пустую строку. Как бы то ни было, доступ к любому имени свойства, которое содержит невалидный JavaScript идентификатор (например, имя свойства содержит в себе пробел и тире или начинается с цифры), может быть получен с использованием квадратных скобок. Этот способ записи также полезен, когда имена свойств должны быть динамически определены (когда имя свойства не определено до момента исполнения). Примеры далее:

Обратите внимание, что все ключи с квадратными скобками преобразуются в тип String, поскольку объекты в JavaScript могут иметь в качестве ключа только тип String. Например, в приведённом выше коде, когда ключ obj добавляется в myObj , JavaScript вызывает метод obj.toString () и использует эту результирующую строку в качестве нового ключа.

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

Вы можете пользоваться квадратными скобками в конструкции for. in чтобы выполнить итерацию всех свойств объекта, для которых она разрешена. Чтобы показать как это работает, следующая функция показывает все свойства объекта, когда вы передаёте в неё сам объект и его имя как аргументы функции:

Так что если вызвать эту функцию вот так showProps(myCar, "myCar"), то получим результат:

Перечисление всех свойств объекта

Начиная с ECMAScript 5, есть три способа перечислить все свойства объекта (получить их список):

циклы for. in (en-US)
Этот метод перебирает все перечисляемые свойства объекта и его цепочку прототипов
Этот метод возвращает массив со всеми собственными (те, что в цепочке прототипов, не войдут в массив) именами перечисляемых свойств объекта o .
Этот метод возвращает массив содержащий все имена своих свойств (перечисляемых и неперечисляемых) объекта o .

До ECMAScript 5 не было встроенного способа перечислить все свойства объекта. Однако это можно сделать с помощью следующей функции:

Это может быть полезно для обнаружения скрытых (hidden) свойств (свойства в цепочке прототипа, которые недоступны через объект, в случае, если другое свойство имеет такое же имя в предыдущем звене из цепочки прототипа). Перечислить доступные свойства можно, если удалить дубликаты из массива.

Создание новых объектов

JavaScript содержит набор встроенных объектов. Также вы можете создавать свои объекты. Начиная с JavaScript 1.2, вы можете создавать объект с помощью инициализатора объекта. Другой способ — создать функцию-конструктор и сделать экземпляр объекта с помощью этой функции и оператора new .

Использование инициализаторов объекта

Помимо создания объектов с помощью функции-конструктора вы можете создавать объекты и другим, особым способом. Фактически, вы можете записать объект синтаксически, и он будет создан интерпретатором автоматически во время выполнения. Эта синтаксическая схема приведена ниже:

здесь obj — это имя нового объекта, каждое property_i — это идентификатор (имя, число или строковый литерал), и каждый value_i — это значения, назначенные property_i . Имя obj и ссылка объекта на него необязательна; если далее вам не надо будет ссылаться на данный объект, то вам не обязательно назначать объект переменной. (Обратите внимание, что вам потребуется обернуть литерал объекта в скобки, если объект находится в месте, где ожидается инструкция, чтобы интерпретатор не перепутал его с блоком.)

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

Следующая инструкция создаёт объект и назначает его переменной x , когда выражение cond истинно.

Следующий пример создаёт объект myHonda с тремя свойствами. Заметьте, что свойство engine — это также объект со своими собственными свойствами.

Вы также можете использовать инициализатор объекта для создания массивов. Смотрите array literals.

До JavaScript 1.1 не было возможности пользоваться инициализаторами объекта. Единственный способ создавать объекты — это пользоваться функциями-конструкторами или функциями других объектов, предназначенных для этой цели. Смотрите Using a constructor function.

Использование функции конструктора

Другой способ создать объект в два шага описан ниже:

Определите тип объекта, написав функцию-конструктор. Название такой функции, как правило, начинается с заглавной буквы.
Создайте экземпляр объекта с помощью ключевого слова new .

Чтобы определить тип объекта создайте функцию, которая определяет тип объекта, его имя, свойства и методы. Например предположим, что вы хотите создать тип объекта для описания машин. Вы хотите, чтобы объект этого типа назывался car , и вы хотите, чтобы у него были свойства make, model, и year. Чтобы сделать это, напишите следующую функцию:

Заметьте, что используется this чтобы присвоить значения (переданные как аргументы функции) свойствам объекта.

Теперь вы можете создать объект, называемый mycar , следующим образом:

Эта инструкция создаёт объект типа Car со ссылкой mycar и присваивает определённые значения его свойствам. Значением mycar.make станет строка "Eagle", mycar.year — это целое число 1993, и так далее.

Вы можете создать столько объектов car, сколько нужно, просто вызывая new . Например:

Объект может иметь свойство, которое будет другим объектом. Например, далее определяется объект типа Person следующим образом:

и затем создать два новых экземпляра объектов Person как показано далее:

Затем, вы можете переписать определение car и включить в него свойство owner , которому назначить объект person следующим образом:

Затем, чтобы создать экземпляры новых объектов, выполните следующие инструкции:

Заметьте, что вместо того, чтобы передавать строку, литерал или целое число при создании новых объектов, в выражениях выше передаются объекты rand и ken как аргумент функции. Теперь, если вам нужно узнать имя владельца car2, это можно сделать следующим образом:

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

добавляет свойство color к car1, и устанавливает его значение равным "black." Как бы там ни было, это не влияет на любые другие объекты. Чтобы добавить новое свойство всем объектам одного типа, вы должны добавить свойство в определение типа объекта car .

Использование метода Object.create

Объекты также можно создавать с помощью метода Object.create . Этот метод очень удобен, так как позволяет вам указывать объект прототип для нового вашего объекта без определения функции конструктора.

Наследование

Все объекты в JavaScript наследуются как минимум от другого объекта. Объект, от которого произошло наследование называется прототипом, и унаследованные свойства могут быть найдены в объекте prototype конструктора.

Индексы свойств объекта

В JavaScript 1.0 вы можете сослаться на свойства объекта либо по его имени, либо по его порядковому индексу. В JavaScript 1.1 и позже, если вы изначально определили свойство по имени, вы всегда должны ссылаться на него по его имени, и если вы изначально определили свойство по индексу, то должны ссылаться на него по его индексу.

Это ограничение налагается когда вы создаёте объект и его свойства с помощью функции конструктора (как мы это делали ранее с типом Car ) и когда вы определяете индивидуальные свойства явно (например, myCar.color = "red" ). Если вы изначально определили свойство объекта через индекс, например myCar[5] = "25 mpg" , то впоследствии сослаться на это свойство можно только так myCar[5] .

Исключение из правил — объекты, отображаемые из HTML, например массив forms . Вы всегда можете сослаться на объекты в этих массивах или используя их индекс (который основывается на порядке появления в HTML документе), или по их именам (если таковые были определены). Например, если второй html-тег в документе имеет значение атрибута NAME равное "myForm", вы можете сослаться на эту форму вот так: document.forms[1] или document.forms["myForm"] или document.myForm .

Определение свойств для типа объекта

Вы можете добавить свойство к ранее определённому типу объекта воспользовавшись специальным свойством prototype . Через prototype создаётся свойство, единое для всех объектов данного типа, а не одного экземпляра этого типа объекта. Следующий код демонстрирует это, добавляя свойство color ко всем объектам типа car , а затем присваивая значение свойству color объекта car1 .

Смотрите свойство prototype (en-US) объекта Function в Справочнике JavaScript для получения деталей.

Определение методов

Метод — это функция, ассоциированная с объектом или, проще говоря, метод — это свойство объекта, являющееся функцией. Методы определяются так же, как и обычные функции, за тем исключением, что они присваиваются свойству объекта. Например вот так:

где objectName — это существующий объект, methodname — это имя, которое вы присваиваете методу, и function_name — это имя самой функции.

Затем вы можете вызвать метод в контексте объекта следующим образом:

Вы можете определять методы для типа объекта, включая определение метода в функцию конструктора объекта. Например, вы можете определить функцию, которая форматирует и отображает свойства до этого определённых объектов car . Например,

где pretty_print — это функция отображения горизонтальной линии и строки. Заметьте, что использование this позволяет ссылаться на объект, которому принадлежит метод.

Вы можете сделать эту функцию методом car, добавив инструкцию

к определению объекта. Таким образом, полное определение car примет следующий вид:

Теперь вы можете вызвать метод displayCar для каждого из объектов как показано ниже:

Использование this для ссылки на объект

В JavaScript есть специальное ключевое слово this, которое вы можете использовать внутри метода, чтобы ссылаться на текущий объект. Предположим, у вас есть функция validate, которая сверяет свойство value, переданного ей объекта с некоторыми верхним и нижним значениями:

Вы можете вызвать эту функцию validate в каждом элементе формы, в обработчике события onchange . Используйте this для доступа к этому элементу, как это сделано ниже:

В общем случае, this ссылается на объект, вызвавший метод.

Через this можно обратиться и к родительской форме элемента, воспользовавшись свойством form . В следующем примере форма myForm содержит элемент ввода Text и кнопку button1 . Когда пользователь нажимает кнопку, значению объекта Text назначается имя формы. Обработчик событий кнопки onclick пользуется this.form чтобы сослаться на текущую форму, myForm .

Определение геттеров и сеттеров

Геттер (от англ. get - получить) — это метод, который получает значение определённого свойства. Сеттер (от англ. set — присвоить) — это метод, который присваивает значение определённому свойству объекта. Вы можете определить геттеры и сеттеры для любых из встроенных или определённых вами объектов, которые поддерживают добавление новых свойств. Синтаксис определения геттеров и сеттеров использует литеральный синтаксис объектов.

Ниже проиллюстрировано, как могут работать геттеры и сеттеры в объекте определённом пользователем:

Объект o получит следующие свойства:

o.a — число
o.b — геттер, который возвращает o.a плюс 1
o.c — сеттер, который присваивает значение o.a половине значения которое передано в o.c

Следует особо отметить, что имена функций, указанные в литеральной форме "[gs]et propertyName() < >" не будут в действительности являться именами геттера и сеттера. Чтобы задать в качестве геттера и сеттера функции с явно определёнными именами, используйте метод Object.defineProperty (или его устаревший аналог Object.prototype.__defineGetter__ ).

В коде ниже показано, как с помощью геттера и сеттера можно расширить прототип объекта Date и добавить ему свойство year, которое будет работать у всех экземпляров класса Date . Этот код использует существующие методы класса Date - getFullYear и setFullYear для работы геттера и сеттера.

Определение геттера и сеттера для свойства year :

Использование свойства year заданного геттером и сеттером:

В принципе, геттеры и сеттеры могут быть либо:

определены при использовании Инициализаторов объекта, или
добавлены существующему объекту в любой момент, при использовании методов добавления геттеров и сеттеров.

Когда определение геттера и сеттера использует инициализаторы объекта, всё что вам нужно, это дополнить геттер префиксом get а сеттер префиксом set . При этом, метод геттера не должен ожидать каких либо параметров, в то время как метод сеттера принимает один единственный параметр (новое значение для присвоения свойству). Например:

Геттеры и сеттеры, могут быть добавлены существующему объекту в любой момент, при помощи метода Object.defineProperties . Первый параметр этого метода - объект, которому вы хотите присвоить геттер и сеттер. Второй параметр - это объект, имена свойств которого будут соответствовать именам создаваемых свойств, а значения - объекты определяющие геттер и сеттер создаваемых свойств. В следующем примере создаются в точности такие же геттер и сеттер, как и в примере выше:

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

Удаление свойств

Вы можете удалить свойство используя оператор delete . Следующий код показывает как удалить свойство.

Вы также можете воспользоваться delete чтобы удалить глобальную переменную, если ключевое слово var не было использовано при её объявлении:

Смотри delete чтобы получить дополнительную информацию.

Сравнение объектов

В JavaScript объекты имеют ссылочный тип. Два отдельных объекта никогда не будут равными, даже если они имеют равный набор свойств. Только сравнение двух ссылок на один и тот же объект вернёт true.

В JavaScript балом правят объекты. Если вы поняли объекты, вы поняли JavaScript.

В JavaScript почти всё объекты:

Логические значения могут быть объектами (если определены при помощи ключевого слова new)
Числа могут быть объектами (если определены при помощи ключевого слова new)
Строки могут быть объектами (если определены при помощи ключевого слова new)
Даты (Date) всегда объекты
Математические константы и функции (Math) всегда объекты
Регулярные выражения всегда объекты
Массивы всегда объекты
Функции всегда объекты
Объекты всегда объекты

Все значения в JavaScript, за исключением примитивов, являются объектами.

Примитивы в JavaScript

Примитивные значения это значения, у которых нет свойств и методов.

Примитивный тип это тип данных, у которых примитивное значение.

JavaScript определяет 5 примитивных типов данных:

Примитивные значения неизменяемы (они жестко заданы и не могут быть изменены).

Если x = 3.14, вы можете изменить значение x. Но вы не можете изменить значение 3.14.

Значение	Тип	Комментарий
"Привет"	string	"Привет" всегда "Привет"
3.14	number	3.14 всегда 3.14
true	boolean	true всегда true
false	boolean	false всегда false
null	null (object)	null всегда null
undefined	undefined	undefined всегда undefined

Объекты это переменные

Переменные JavaScript могут содержать одиночные значения:

Объекты – тоже переменные. Но объекты могут содержать множество значений.

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

Объект в JavaScript это набор именованных значений.

Свойства объекта

Именованные значения объектов в JavaScript называются свойствами.

Свойство	Значение
firstName	Иван
lastName	Петров
age	50
eyeColor	карие

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

ассоциативным массивам в PHP
словарям в Python
хэш-таблицам в C
хэш-картам в Java
хэшам в Ruby и Perl

Методы объекта

Методы это действия, которые можно выполнить с объектами.

Свойствами объектов могут быть как примитивные значения, так и другие объекты и функции.

Метод объекта это свойство, которое содержит определение функции.

Свойство	Значение
firstName	Иван
lastName	Петров
age	50
eyeColor	карие
fullName	function()

Объекты JavaScript это контейнеры для именованных значений, которые называются свойства и методы.

Создание объектов JavaScript

В JavaScript вы можете определять и создавать свои собственные объекты.

Существует несколько способов создания объектов:

Определение и создание объекта при помощи объектного литерала.
Определение и создание объекта при помощи ключевого слова new.
Определение конструктора объекта и создание переменных с типом этого конструктора.

В ECMAScript 5 объекты также можно создавать при помощи функции Object.create().

Использование объектных литералов

Это самый простой способ создания объектов JavaScript.

Используя объектные литералы, вы одновременно определяете и создаете объект.

Объектный литерал — это список из пар имя:значение (вроде age:50), помещенных в фигурные скобки < >.

В следующем примере создается новый объект JavaScript с четырьмя свойствами:

Пробелы и переносы строки не имеют значения. Определение объекта может занимать несколько строк:

Использование ключевого слова new

В следующем примере также создается новый объект JavaScript с четырьмя свойствами:

Внимание! Код в двух предыдущих примерах делает одно и то же. Поэтому нет необходимости использовать выражение new Object(). Для простоты, лучшей читаемости и большей скорости выполнения используйте первый вариант создания объектов (при помощи объектных литералов).

Работа по ссылке

Объекты JavaScript адресуются только по ссылке, а не по значению.

Так, если переменная person является объектом, то следующее выражение не создаст ее копию:

Объект x это не копия объекта person. Это и есть объект person. И x, и person – один и тот же объект.

Любые изменения объекта x также приведут к аналогичным изменениям объекта person, потому что x и person это один и тот же объект.

Объект – это неупорядоченная коллекция свойств. Свойство – это часть объекта имитирующая переменную. Свойство состоит из имени и значения.

В JavaScript есть три категории объектов:

Объекты базового типа – это объекты, определённые в спецификации ECMAScript. Например, объекты типа Array , Function , Date или RegExp являются объектами базового типа.
Объекты среды выполнения – это объекты, определённые в среде выполнения (такой как браузер). Например, объекты типа HTMLElement , являются объектами среды выполнения.
Пользовательские объекты – это любой объект, созданный в результате выполнения программного кода JavaScript.

Создание объекта

Объект можно создать с помощью литерала объекта или оператора new с конструктором.

Литерал объекта – это заключённый в фигурные скобки список из нуля или более свойств (пар имя: значение), разделённых запятыми. Именем свойства может быть любой допустимый идентификатор, строковой литерал (допускается использовать пустую строку) или число. Числовые имена свойств автоматически преобразуются в строки. Значением свойства может быть значение любого типа или выражение (значением свойства в этом случае станет результат вычисления выражения):

Создание объекта с помощью оператора new:

Операции с объектом

Основные операции производимые с объектами – это добавление новых свойств, изменение уже существующих свойств, удаление свойств и обращение к свойствам.

Добавить новое свойство в объект можно присвоив свойству значение. Чтобы присвоить свойству значение, к нему нужно получить доступ. Для доступа к свойству используется один из операторов доступа: . (точка) или [] (квадратные скобки):

Обращение к свойству и изменение значения осуществляется точно так же (с помощью операторов доступа):

Удаление свойства осуществляется с помощью оператора delete:

Для перебора свойств объекта используется цикл for-in:

Методы объекта

Свойство, значением которого является функция, называется методом . Вызов метода осуществляется точно также, как и вызов обычной функции – с помощью оператора () (оператор вызова):

Для доступа к свойствам объекта внутри метода используется ключевое слово this . Оно содержит ссылку на объект, с помощью которого был вызван метод:

Вместо ключевого слова this можно использовать непосредственно имя объекта, но это не очень удобно, так как, если изменится имя объекта, в методах придётся также изменять имя:

Читайте также: