javascriptclassgoogle-chrome-devtoolsprivate-membersprivate-methods

Why is JavaScript private method accessible from console.log


I wrote a simple code:

const secure = new class {
    #privateProperty = 4;
    #privateMethod() {
        console.log( 'The property ' + this.#privateProperty + ' should not be accessible outside this class' );
    }
}

If it is immediately followed by the syntax below

secure.#privateMethod();

I get an error which says Uncaught SyntaxError: Private field '#privateMethod' must be declared in an enclosing class

However, If I don't immediately call the secure.#privateMethod() and then go to developer tool - console and write the syntax there, it outputs:

The property 4 should not be accessible outside this class

Is there a special reason why this is happening?


Solution

  • It's a feature, not a bug! New in the devtools of Chrome 111:

    To better facilitate debugging, DevTools now supports evaluating expressions with private class members. (1381806)

    This is very useful when developing classes with private fields. You no longer need to put a breakpoint in a class method to be able to run code that accesses (gets, sets, invokes) private fields.