I Shar

I Shar

мир глазами веб-разработчика

JavaScript: стрелочная функция как геттер

может ли стрелочная функция в JavaScript быть геттером

I Shar

время чтения 2 мин.

Photo by Lindsey Duce on Unsplash

Согласно определению, синтаксис get связывает свойство объекта с функцией, которая будет вызываться при обращении к этому свойству. Таким образом, доступ к свойству, возвращающему динамическое вычисляемое значение, в JavaScript можно реализовать с помощью геттера (getter).

Таким образом, геттер getId при обращении к свойству id объекта obj с помощью ключевого слова this вернет значение этого свойства 1:

let obj = {
    id: 1,
    get getId() {
        return this.id
    }
};
console.log(obj.getId) // 1

Но, можно ли использовать стрелочную функцию в качестве геттера:

let obj = {
    id: 1,
    getId: () => this.id
};

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

Однако, в данном случае вступают в силу другие правила языка JavaScript.

Используя синтаксис:

getId: () => this.id

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

let obj = {
    id: 1,
    getId: () => this.id
};
console.log(obj.getId()) // undefined

Таким образом, вместо ожидаемого результата 1, мы получим undefined. К сожалению приведенный выше синтаксис не позволяет использовать стрелочную функцию в качестве геттера.

Следует заметить, что вызов свойства getId без скобок, вернет нам контент самой функции:

let obj = {
    id: 1,
    getId: () => this.id
};
console.log(obj.getId); // () => this.id


Спасибо за внимание.

    • frontend
    • js

Новые публикации

Далее

Категории

О нас

Frontend & Backend. Статьи, обзоры, заметки, код, уроки.