Eu fiquei um pouco perdida com relação a aula de orientação de objetos privados em JavaScript, em parte pelo fato das novas alterações que foram propostas, em parte porque deu a impressão que o prof. Ricardo talvez tenha feito algo que já não é boa prática (que segundo ele mesmo não deveríamos "roubar" e exibir um atributo privado diretamente) e eu estava tentando já seguir a forma "nova" de fazer enquanto acompanhava junto, usando o # e tudo mais já para experimentar o recurso (e já podia ver as limitações que o recurso tem). O meu código ficou assim:

class Cliente {
  nome;
  cpf;
}

class ContaCorrente {
  agencia;
  #saldo = 0;

  sacar(valor) {
    if (this.#saldo >= valor) {
      this.#saldo -= valor;
    }
  }

  depositar(valor) {
    if (valor > 0) {
      this.#saldo += valor;
    }
  }

  extrato(this.#saldo) {
    console.log(this.#saldo);
  }
}

const cliente1 = new Cliente();
cliente1.nome = "Ricardo";
cliente1.cpf = 111222233309;

const cliente2 = new Cliente();
cliente2.nome = "Alice";
cliente2.cpf = 88822233309;

const contaCorrenteRicardo = new ContaCorrente();
//contaCorrenteRicardo.#saldo = 10000; <- não é permitido porque é privado

contaCorrenteRicardo.agencia = 1001;

contaCorrenteRicardo.depositar(100);
contaCorrenteRicardo.sacar(50);

const valorSacado = contaCorrenteRicardo.sacar(50);

console.log(contaCorrenteRicardo);
console.log(contaCorrenteRicardo.extrato);

A minha dúvida é a seguinte: eu não consigo exibir diretamente o atributo #valor com console.log(contaCorrenteRicardo);, porque como é um atributo privado, ele não exibe. Então pensei em como seria a melhor forma de exibir e com isso resolvi criar esse método contaCorrenteRicardo.extrato. Porém, não dá certo de se fazer isso em JavaScript, porque ele me dá o erro na declaração do método extrato(#saldo)/extrato(this.#saldo) (tentei ambas as formas, mas não funcionaram).

https://pasteboard.co/JNNDPai.png

As saídas são semelhantes, então segue o retorno da versão com "extrato(this.#saldo)" com os erros que apareceram:

:22
  extrato(this.#saldo) {
          ^^^^

SyntaxError: Unexpected token 'this'
    at Loader.moduleStrategy (internal/modules/esm/translators.js:145:18)
    at async link (internal/modules/esm/module_job.js:47:21)

Então eu pergunto: qual seria a forma "correta" de implementar isso, no JavaScript "moderno", sem "quebrar a regra" de tentar exibir um atributo privado diretamente?

EDIT: Avançando no curso, eu cheguei na parte de getters e setters, aí eu imagino que isso se resolveria com os getters, porque para ser sincera, o exemplo que ele deu na aula 4 :

  get cliente() {
    return this._cliente;
  }

era ruim, porque , sinceramente, mesmo que eu comente toda essa parte, o resultado é absolutamente O MESMO (provavelmente porque o prof. nem estava usando atributos privados "de verdade" para início de conversa?)

EDIT 2: Como feedback, eu diria que achei que tudo isso que envolvia atributos privados ficou desnecessariamente confuso. Se no início do curso, o prof. Ricardo pediu para garantir que estávamos com o JavaScript mais novo, penso se não seria melhor ter feito o curso pensando na versão mais recente de uma vez ao invés de misturar os conceitos das diferentes versões? Reassistindo várias vezes essa parte tentando entender, não só me pareceu que eu estava confusa com a explicação, parecia que o próprio professor acabava se confundindo, uma hora mostrando que quando usa # nas classes privadas o Node.js não deixa exibir, já que isso não é "o certo", depois usando o _ para fazer exatamente aquilo que ele tinha acabado de mostrar que não era boa prática mesmo se o Node permitisse por não ser um # (ou seja, exibir diretamente o valor alí, como um atributo não privado). Eu senti a boa vontade de mostrar os recursos, mas o resultado final acabou mais trazendo confusão que esclarecendo. E ele não mostrou alí como seria a forma certa de exibir, o que está me deixando com todas essas dúvidas, que acabaram se acumulando quando chegou na parte de getters e setters e mais ainda quando chegou em construtores, já que o conceito de getter e setter não ficou tão claro, já que dava o mesmo resultado mesmo se eu comentasse as linhas dos getters.

EDIT 3: Consultei um amigo que trabalha com JS ele me disse que no fim tudo o Babel acaba ajustando tudo para versão mais antiga do ECMAScript (ES5, por exemplo) e que esses recursos novos são bons, pois permitem celeridade no desenvolvimento de coisas mais complexas, que teria sido melhor que ele já tivesse focado nos recursos novos "sem tanto receio de escolher um e causar tanta confusão nisso". Achei válido repassar esse feedback também.

Muito obrigada!