Доступ к родительскому `this` из установщика объекта

Question

Как вы можете получить доступ к родительскому контексту из установщика в объекте?

В следующем примере представьте, что мне нужна переменная Foo.other для вычисления установщика state.bar. Как бы вы достигли этого?

class Foo {
    constructor() {
        this.other = 'i am an other variable'
        this.state = {
            _bar: 'default',
            set bar(flag) {
                console.log() // how can I access foo.other from here?
                this._bar = flag
            },
            get bar() {
                return this._bar
            }
        }
    }
}

const foo = new Foo()
foo.state.bar = 'yolo'

Answer 1

this возвращает указатель на текущий объект. Вы можете сохранить эту ссылку в переменной, а затем использовать эту переменную для извлечения старого объекта this, когда область была изменена. Наиболее распространенными именами таких переменных являются self, _this, _self, me и _me.

class Foo {
  constructor() {
    var self = this;
    this.other = 'i am an other variable';
    this.state = {
      _bar: 'default',
      set bar(flag) {
        console.log(self.other);
        this._bar = flag;
      },
      get bar() {
        return this._bar;
      }
    }
  }
}

const foo = new Foo();
foo.state.bar = 'yolo';

Answer 2

Вызывая this внутри установщика, вы ссылаетесь на объект state, для которого не определено свойство other (Проверьте второй файл console.log, который ссылается на this._bar).

Вы можете сохранить this в переменной (self) следующим образом:

class Foo {
    constructor() {
        const self = this;
        this.other = 'i am an other variable'
        this.state = {
            _bar: 'default',
            set bar(flag) {
                console.log(self.other);
                console.log(this._bar);
                this._bar = flag
            },
            get bar() {
                return this._bar
            }
        }
    }
}

const foo = new Foo()
foo.state.bar = 'yolo'