О статических членах

Статические члены класса ES6 на самом деле являются членами функционального объекта, а не его объекта-прототипа. Рассмотрим следующий пример, где я буду использовать обычные методы вместо геттера, но механика идентична геттеру:

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

    nonStaticMethod() {
        return 'Foo non-static';
    }
}

staticMethod станет членом объекта функции-конструктора, тогда как nonStaticMethod станет членом прототипа этого объекта функции:

function Foo() {}

Foo.staticMethod = function() {
    return 'Foo static';
}

Foo.prototype.nonStaticMethod = function() {
    return 'Foo non-static';
}

Если вы хотите запустить staticMethod из "экземпляра" Foo, вам придется сначала перейти к его constructor, который является объектом функции, членом которого является staticMethod:

let foo = new Foo();

foo.staticMethod(); // Uncaught TypeError: foo.staticMethod is not a function

// Get the static member either on the class directly
// (this works IF you know that Foo is foo's constructor)

Foo.staticMethod(); // > 'Foo static'


// this is the same, provided that neither 'prototype' nor
// 'prototype.constructor' has been overridden afterwards:

Foo.prototype.constructor.staticMethod(); // > 'Foo static'


// ...or by getting the prototype of foo
// (If you have to perform a computed lookup of an object's constructor)
// You'll want to perform such statements in a try catch though...

Object.getPrototypeOf(foo).constructor.staticMethod(); // > 'Foo static'

function.length

Все функции имеют свойство length который говорит вам, сколько аргументов принимает эта функция:

function Foo(a, b) {}
Foo.length; // > 2

Таким образом, в вашем примере поиск прототипа от Bar.length до Foo.length действительно никогда не произойдет, поскольку length уже найден непосредственно в Bar. Простое переопределение не сработает:

Foo.length = 3;
Foo.length; // still 2

Это потому, что свойство недоступно для записи. Давайте проверим с помощью getOwnPropertyDescriptor:

Object.getOwnPropertyDescriptor(Foo, 'length');
/*
    { 
        value: 0,
        writable: false,
        enumerable: false,
        configurable: true
    }
*/

Кроме того, вместо определяемого вами геттера value вы можете просто использовать function.name, чтобы получить имя конструктора функции/класса:

Foo.name; // > 'Foo'

Давайте воспользуемся этим, чтобы переопределить свойство length для Foo. Мы по-прежнему можем переопределить Foo.length, поскольку это свойство настраивается:

Object.defineProperty(Foo, 'length', {
    get() {
        return this.name.length;
    }
});

Foo.length; // 3

Это раздувание кода

Крайне нежелательно делать это для каждого расширяющего класса или определять статический геттер для каждого, что эквивалентно приведенному выше коду. Невозможно полностью переопределить поведение без какого-либо оформления функциональных объектов. Но поскольку мы знаем, что классы — это всего лишь синтаксический сахар, и на самом деле мы имеем дело только с объектами и функциями, написать декоратор несложно!

function decorateClasses(...subjects) {

    subjects.forEach(function(subject) {

        Object.defineProperty(subject, 'value', {
            get() {
                const superValue = Object.getPrototypeOf(this).value || '';

                return superValue + this.name;
            },
            enumerable: true,
            configurable: true,
        });

        Object.defineProperty(subject, 'length', {
            get() {
                return this.value.length;
            },
            enumerable: true,
            configurable: true,
        });
    })

}

Эта функция принимает один или несколько объектов, для которых она переопределяет свойство length и устанавливает свойство value. Оба являются аксессорами с методом get. get value явно выполняет поиск прототипа, а затем объединяет результаты с именем функции, которой он принадлежит. Итак, если у нас есть 3 класса:

class Foo {

}

class Bar extends Foo {

}

class Baz extends Bar {

}

Мы можем украсить все классы сразу:

decorateClasses(Foo, Bar, Baz);

Если мы получим доступ к value и length во всех трех классах (функциях), мы получим желаемые результаты:

Foo.value; // 'Foo'
Foo.length; // 3

Bar.value; // 'FooBar'
Bar.length; // 6

Baz.value; // 'FooBarBaz'
Baz.length; // 9