Классы: одноименные статический и не статический метод

Есть ли какие-то подводные камни при объявлении статического и не статического метода с одним именем? Работает ли во всех современных браузерах? Вообще, так допустимо делать? Смотрите пример:

class User {
    constructor() {
        this.name = "Name";
        this.surname = "Surname";
    }

    fi() {
        return "this: " + [this.name, this.surname].join(" ");
    }

    static fi(user) {
        return "static: " + [user.name, user.surname].join(" ");
    }
}

user = new User;
console.log(user.fi());
console.log(User.fi(user));
this: Name Surname
static: Name Surname

Ответы (2 шт):

Автор решения: user7860670

Возможно вас вводит в заблуждение зарезервированное слово static. В javascript оно никак не влияет на то, получится ли статический метод или нет. Собственно в javascript в принципе отсутствует разделение на статические и нестатические методы. Да и сами методы никак не отличаются от функций. Любая функция может быть вызвана как в контексте объекта - с передачей параметра this либо без него (то бишь когда this === undefined).

В вашем примере в первом случае функция вызывается в контексте объекта, на который ссылается user. А вторая - в контексте объекта User. Но это можно обойти используя call / apply:

class User {
    constructor() {
        this.name = "Name";
        this.surname = "Surname";
    }

    fi() {
        if (this === undefined)
        {
          return "this: " + "undefined";
        }
        else
        {
          return "this: " + [this.name, this.surname].join(" ");
        }
    }

    static fi(user) {
        if (this === undefined)
        {
          return "static: " + "undefined" + " | " + [user.name, user.surname].join(" ");
        }
        else
        {
          return "static: " + this.toString() + " | " + [user.name, user.surname].join(" ");
        }
    }
}

user = new User;
console.log(user.fi());
console.log(user.fi.call(undefined));
console.log(User.fi(user));
console.log(User.fi.call(undefined, user));
→ Ссылка
Автор решения: vsemozhebuty

Теоретически, у них разные места хранения и разные цепочки наследования (см. диаграмму в https://javascript.info/static-properties-methods), так что конфликта не будет, разве что в голове читателя. Всё зависит от ситуации. Если есть опасность путаницы, лучше развести.

→ Ссылка