Что творится с контекстом внутри ES6 классов?

Question

[Роман]

В общем вся суть вопроса - почему ломается контекст у ClassC. Я примерно понимаю, что это происходит потому что метод init вызывается из конструктора класса ClassA, но на мой взгляд это выглядит багом, так как не позволяет нормально работать с приватными методами в рамках одного класса.

Подскажите, описано ли такое поведение где нибудь в спецификации или это баг?

Если описано, то пожалуйста скиньте по возможности ссылку на описание конкретно этого поведения.

class ClassA {
    constructor(){
        this.#methidA();
        this.init();
    }
    
    init(){
    
    }

    #methidA(){
        console.log('in ClassA.#methodA');
    }
}
const a = new ClassA(); // все отлично





class ClassB extends ClassA {
    constructor(){
        super();
        this.#methidB();
    }
    
    #methidB(){
        console.log('in ClassB.#methodB');
    }
}
const b = new ClassB(); // все отлично





class ClassC extends ClassA {
    init(){
        this.#methidC(); 

    }
    
    #methidC(){
        console.log('in ClassC.#methodC');
    }
}
const c = new ClassC(); // this.#methidC(); TypeError: Receiver must be an instance of class ClassC

Comments

[Lynn «Кофеман»]

Описано. И есть объяснение, хотя на мне взгляд не очень внятное, у Акселя Раушмайера

https://2ality.com/2019/07/private-class-fields.ht...

[Роман]

Ох, спасибо большое, пойду изучать.

[Роман]

Посмотрел. Ситуация похожая, но:
1. для статических методов.
2. она обратная моей. То есть в пункте 6.2 как раз и показано, что вызов метода производится в пространстве SubClass-а. И именно такого поведения я ожидаю в моем примере - вызова метода init в пространстве класса ClassC

В общем что то не то происходит с JS)))))

[Роман]

Похоже проблема была в банальной неготовности объекта

class ClassA {
    constructor() {
        this.#methodA();
        this.init();
    }

    init() {

    }

    #methodA() {
        console.log('in ClassA.#methodA');
    }
}
const a = new ClassA(); // все отлично

class ClassC extends ClassA {
    init() {
        setImmediate(()=>{
            this.#methodC();
        })
        
    }

    #methodC() {
        console.log('in ClassC.#methodC');
    }
}
const c = new ClassC(); // все отлично

Answer 1

[Alexandroppolus]

Потому что во время вызова конструктора ClassA, где у тебя вызывается init из ClassC, объект ещё "не доделан", где-то внутри, до полноценного экземпляра ClassC, в частности, ему ещё не добавлены приватные методы ClassC.

Скопируй в консоль Хрома этот код:

код

class ClassA {
    constructor(){
        this.#methidA();
        this.init();
    }
    
    init(){
    
    }

    #methidA(){
        console.log('in ClassA.#methodA');
    }
}

class ClassC extends ClassA {
    init(){
        console.log('*** this in init(): ', this);
        debugger;
    }
    
    #methidC(){
        console.log('in ClassC.#methodC');
    }
    callMethidC() {
        console.log('*** this in callMethidC(): ', this);
        debugger;
        this.#methidC();
    }
}

const c = new ClassC();
c.callMethidC();

и нажми ентер.

на брекпоинтах разверни в консоли экземпляр класса, который будет в последних выводах в консоль (это надо делать именно во время остановок на брекпоинтах, иначе будет одинаково).
можно увидеть, что в первом случае в [[PrivateMethods]] не хватает метода #methidC()

приватные методы, судя по всему, хранятся не в прототипе, а в какой-то скрытой области, которую можно увидеть только вот так, в момент дебага.

надо поисследовать, почитать спецификацию. Сам их не использую, у нас на работе TS )

Comments

[Роман]

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

[Роман]

Ваша гипотеза о неготовности объекта полностью подтвердилась

class ClassA {
    constructor() {
        this.#methodA();
        this.init();
    }

    init() {

    }

    #methodA() {
        console.log('in ClassA.#methodA');
    }
}
const a = new ClassA(); // все отлично

class ClassC extends ClassA {
    init() {
        setImmediate(()=>{
            this.#methodC();
        })
        
    }

    #methodC() {
        console.log('in ClassC.#methodC');
    }
}
const c = new ClassC(); // все отлично