Property accessors
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Доступ к свойствам объекта можно получить, используя точечную и скобочную записи.
Интерактивный пример
Синтаксис
object.property object["property"]
Описание
Можно думать об объекте как об ассоциативном массиве (или карте, словаре, хэш-таблице, таблице поиска). Ключи в таком массиве - это имена свойств объекта.
Когда речь идёт о свойствах объекта, обычно различают собственно свойства и методы. Однако разделение свойство/метод это не более чем условность. Метод - это просто свойство, которое можно вызвать (например, если оно содержит ссылку на функцию
в качестве значения.
Есть два способа доступа к свойствам: точечная и скобочная записи.
Точечная запись
В записи object.property
, property должно быть действительным идентификатором. (В стандарте ECMAScript, имена свойств технически называются "IdentifierNames", а не "Identifiers", поэтому зарезервированные слова могут быть использованы в их качестве, но это не рекомендуется). Например, object.$1
является верной записью, а object.1
- нет.
const variable = object.property_name;
object.property_name = value;
const object = {};
object.$1 = 'foo';
console.log(object.$1); // 'foo'
object.1 = 'bar'; // SyntaxError
console.log(object.1); // SyntaxError
Здесь метод с именем createElement
считывается с объекта document
и вызывается.
document.createElement("pre");
Если вы хотите вызвать метод на численном литерале, не имеющий части с экспонентой или точки, отделяющей дробную часть, нужно ставить пробел перед точкой, являющейся частью обращения к этому методу, чтобы интерпретатор не посчитал, что это точка отделяет дробную часть числа (или использовать другие способы этого избежать).
// SyntaxError, здесь считается, что 77. это число,
// поэтому такая запись эквивалентна (77.)toExponentional()
// что является ошибкой
77.toExponentional()
// Рабочие варианты:
77.toExponential()
77
.toExponential()
;(77).toExponential()
// Здесь первая точка относится к числу, вторая вызывает метод
// то есть эта запись равносильна (77.).toExponential()
77..toExponential()
// Эквивалентно (77.0).toExponential()
77.0.toExponential()
Скобочная запись
В записи object[property_name]
, property_name
- это выражение, вычисляющееся в строку или символ. Это может быть любая строка, не обязательно действительный идентификатор, например '1foo'
, '!bar!'
или даже ' '
(пробел).
const variable = object[property_name];
object[property_name] = value;
Пример, аналогичный примеру в предыдущем пункте:
document["createElement"]("pre");
Пробел перед скобкой допускается:
document["createElement"]("pre");
Имена свойств
Имена свойств могут быть строками или символами. Любое другое значение приводится к строке. Следующий код выводит 'value'
, поскольку число 1
приводится к строке '1'
.
const object = {};
object["1"] = "value";
console.log(object[1]);
Этот пример также выводит 'value',
так как и foo
, и bar приводятся к одной и той же строке.
const foo = { unique_prop: 1 };
const bar = { unique_prop: 2 };
const object = {};
object[foo] = "value";
console.log(object[bar]);
В движке SpiderMonkey JavaScript это строка '[object Object]'
.
Привязка методов
Метод не привязан к содержащему его объекту. Это значит, что значение this
в методах объекта не всегда указывает на него. Вместо этого, this
"передаётся" при вызове метода. Смотрите подробнее this
.
Примеры
Скобочная запись или eval
Новички JavaScript часто делают ошибку, используя eval там, где можно просто использовать скобочную запись.
Например, следующий синтаксис можно часто увидеть в скриптах.
x = eval("document.forms.form_name.elements." + strFormControl + ".value");
Функция eval()
очень медленная и её использования следует избегать, когда это возможно. Кроме того, строка strFormControl
при таком использовании обязаны содержать действительный идентификатор, что не является обязательным для id
полей формы, то есть, например, поле с id 1 не получится получить такой записью. Лучше вместо этого использовать скобочную запись:
x = document.forms["form_name"].elements[strFormControl].value;
Спецификации
Specification |
---|
ECMAScript Language Specification # sec-property-accessors |
Совместимость с браузерами
BCD tables only load in the browser