ES6 Javascript: вызов статических методов из классов с функциями стрелок

Question

Пока это работает как задумано

class ClassWithStaticMethod {

  static staticMethod() {
    return ('staticMethod');
  };

  static staticMethod2() {
    const yee = this.staticMethod();
    return 'staticMethod2 '+yee;
  };

}

console.log(ClassWithStaticMethod.staticMethod2());
//staticMethod2 staticMethod

Это,

i) иметь доступ к staticMethod () с именем класса и

ii) этот метод может вызывать другой статический метод в том же классе, используя " this ",

Это не работает

class ClassWithStaticMethod {

  static staticMethod = () => {
    return ('staticMethod');
  };

  static staticMethod2 = () => {
    const yee = this.staticMethod;
    return 'staticMethod2 '+yee;
  };

}

console.log(ClassWithStaticMethod.staticMethod2());
//staticMethod2 undefined

В том смысле, что я все еще могу получить доступ к методу staticMethod (), но я не могу получить доступ к другому методу в первом методе. Я получаю неопределенный, и если я использую

    const yee = this.staticMethod();

Я получаю ошибку

ошибка TypeError: _this.staticMethod не является функцией

Answer 1

Это одна из особенностей функций стрелок, когда дело касается общего использования: у них общая область действия this.(Вот почему мы должны использовать function(), если вы хотите лучший стек вызовов).Во втором методе this относится к контексту вызова: window.

Как упомянуто ниже в комментарии, не используйте сокращенный синтаксис для вашего удобства;Есть причина, по которой у нас так много вариантов.

Чтобы исправить это, вы можете просто использовать function() для определения второй функции;или () в случае объекта.

Это, однако, будет работать:

class ClassWithStaticMethod2 {

  static staticMethod = () => {
    return ('staticMethod');
  };

  static staticMethod2 = function() {
    console.log(this)
    const yee = this.staticMethod();
    return 'staticMethod2 '+yee;
  };

}

Проверьте это здесь .

Answer 2

Функции стрелок наследуют свои this от внешней области видимости, а не this в зависимости от контекста их вызова.Поскольку staticMethod2 пытается получить доступ к this.staticMethod, это будет работать только в том случае, если this относится к ClassWithStaticMethod - то есть, если staticMethod2 является стандартной функцией , а не функцией стрелки.

Вам также необходимо вызвать this.staticMethod().(const yee = this.staticMethod; приведет к тому, что staticMethod будет приведен к строке, а не вызван)

Измените эти две проблемы, и все будет работать как ожидалось:

class ClassWithStaticMethod {

  static staticMethod = () => {
    return ('staticMethod');
  };

  static staticMethod2 = function() {
    const yee = this.staticMethod();
    return 'staticMethod2 '+yee;
  };

}

console.log(ClassWithStaticMethod.staticMethod2());