HTML: Markup language
CSS: Styling language
JavaScript: Scripting language
Web APIs: Programming interfaces
All web technology
Learn web development
Discover our tools
Get to know MDN better
This page was translated from English by the community. Learn more and join the MDN Web Docs community.
View in English Always switch to English
This feature is well established and works across many devices and browser versions. It’s been available across browsers since июль 2015 г..
Синтаксис get связывает свойство объекта с функцией, которая будет вызываться при обращении к этому свойству.
get
const obj = { log: ["a", "b", "c"], get latest() { return this.log[this.log.length - 1]; }, }; console.log(obj.latest); // Expected output: "c"
{get prop() { ... } } {get [expression]() { ... } }
prop
Имя свойства для привязывания к заданной функции.
expression
Начиная с ECMAScript 6, вы также можете использовать выражения для вычисляемого имени свойства для привязки к заданной функции.
Иногда желательно разрешить доступ к свойству, которое возвращает динамически вычисляемое значение, или вы можете захотеть отражать состояние внутренней переменной без необходимости использования явных вызовов методов. В JavaScript, это можно реализовать при помощи использования геттера.
Невозможно сделать так, чтобы геттер был привязан к свойству и одновременно чтобы это свойство действительно содержало значение, хотя можно использовать геттер и сеттер в сочетании, чтобы создать тип псевдо-свойство.
Учтите следующее при работе с синтаксисом get:
{ get x() { }, get x() { } }
{ x: ..., get x() { } }
Геттер можно удалить при помощи оператора delete.
delete
Ниже создаётся псевдо-свойство latest для объекта obj, который выведет последний элемент массива в консоль лог.
latest
obj
const obj = { log: ["example", "test"], get latest() { if (this.log.length === 0) return undefined; return this.log[this.log.length - 1]; }, }; console.log(obj.latest); // "test"
Обратите внимание, что попытка присвоить значение latest не изменит его.
Если вы хотите удалить геттер, используйте delete:
Если вы хотите удалить геттер, используйте delete
delete obj.latest;
defineProperty
Для добавления геттера к существующему объекту в любое время используйте Object.defineProperty().
const o = { a: 0 }; Object.defineProperty(o, "b", { get: function () { return this.a + 1; }, }); console.log(o.b); // Runs the getter, which yields a + 1 (which is 1)
Примечание: Вычисляемые свойства являются экспериментальной технологией, частью предложений спецификации ECMAScript 6, и массовой поддержки браузерами пока нет. Код ниже вызовет синтаксическую ошибку в неподдерживаемых средах.
var expr = "foo"; var obj = { get [expr]() { return "bar"; }, }; console.log(obj.foo); // "bar"
Геттеры дают нам возможность определять свойство объекта , но они не вычисляют значение этого свойства до тех пор, пока оно не станет доступно. Геттер откладывает стоимость вычисления значения до тех пор, пока это значение не станет нужно, и если оно никогда не понадобится, то вы никогда не заплатите.
Дополнительная техника оптимизации заключается в том, чтобы лениться или откладывать вычисление значения свойства и кешировать его для дальнейшего доступа. Так поступают умные или запоминающие геттеры. Значение вычисляется в первый раз при вызове геттера и затем сохраняется в кеше так, что последующие обращения будут возвращать кешированные значения без его пересчёта. Это полезно в следующих ситуациях:
Значит, вам не нужно использовать ленивый геттер для свойства, значение которого вы собираетесь менять потому, что геттер не будет пересчитывать значение.
В следующем примере у объекта есть геттер как собственное свойство. При получении свойства, свойство удаляется из объекта и вновь добавляется, но в этот раз неявно, как свойство с данными. В итоге значение возвращается.
get notifier() { delete this.notifier; return this.notifier = document.getElementById("bookmarked-notification-anchor"); },
Для Firefox смотрите также модуль XPCOMUtils.jsm , который определяет функцию defineLazyGetter().
defineLazyGetter()
Использование ключевого слова get и Object.defineProperty() даёт похожие результаты, но при использовании в classes между ними есть тонкая разница.
Object.defineProperty()
classes
При использовании get свойство будет определено в прототипе объекта, в то время, как при использовании Object.defineProperty () свойство будет определено в экземпляре, к которому применяется.
Object.defineProperty ()
class Example { get hello() { return "world"; } } const obj = new Example(); console.log(obj.hello); // "world" console.log(Object.getOwnPropertyDescriptor(obj, "hello")); // undefined console.log( Object.getOwnPropertyDescriptor(Object.getPrototypeOf(obj), "hello"), ); // { configurable: true, enumerable: false, get: function get hello() { return 'world'; }, set: undefined }
Enable JavaScript to view this browser compatibility table.
Object.prototype.__defineGetter__()
Object.prototype.__defineSetter__()