Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Proxy em objetos complexos

Flavio, boa tarde.

Depois da sua orientação na outra pergunta sobre Proxy e Module e com um pouco mais de pesquisa, consegui montar um ambiente para exercitar mais sobre o Proxy no Browser. Acabei adotando o Rollup (rollupjs.org) como bundler ES6 e usando o Chrome (sem babel)... Obrigado.

E logo no início surgiu a dúvida de como interceptar o acesso à propriedades de objetos que, por sua vez, são propriedades do objeto que "colocamos" no Proxy.

Tentando explicar melhor...

//myObj.js

export default class myObj {
  constructor() {

    this.a = {};
    this.a.b = 'a_b';
    this.a.c = 'a_c';
  }

//main.js

import Proxies from './proxies.js';

import myObj from './ myObj.js;

let ts = new myObj();

let myts = Proxies.create(ts,['hello','goodbye'], obj => console.log(obj));

var {a:{b}} = myts

console.log(b);

Proxies é idêntica a ProxyFactory do curso. Tudo funciona e recebo no console "a_b", mas a propriedade interceptada é myts.a, o Proxy não "acusa" o acesso à myts.a.b.

Caso não esteja fazendo nada errado, qual seria a solução para fazer o Proxy de um objeto complexo e conseguir identificar exatamente qual a propriedade está sendo acessada, mesmo que ela esteja em objetos internos ao objeto raiz?

Abs

4 respostas
solução!

Oi Paulo,

Dei uma olhada no seu código, mas vi que ele nem compila: esta faltando aspas simples para o fechando do import de um módulo e você referencia "hello" e "goodbye" que não existem na declaração do seu objeto. Contudo, como você foi bem direto na sua pergunta eu já posso compartilhar minha opinião sobre o assunto.

O Proxy do ES6 e nenhum outro proxy que eu conheço fará deep proxying (nested proxy). Ou seja, ele não sai criando proxy dos relacionamentos de um objeto.

O mais correto seria você receber a dependência de A, no caso, B, em seu construtor. No ato de passar B você passaria um proxy. Se você usa um sistema de DI, isso fica ainda mais fácil.

Contudo, se você quiser fazer deep proxing, você pode dar uma olhada neste artigo:

https://medium.com/@chekofif/using-es6-s-proxy-for-safe-object-property-access-f42fa4380b2c#.56eqgyjm0

Espero ter ajudado a esclarecer um pouco o contexto desse problema.

Sucesso e bom estudo!

Oi Paulo, tudo certo?

Oi Flavio, tudo certo e obrigado pela orientação.

O código que mandei não estava completo. Editei para simplificar o envio e acho que acabou complicando.

Bem legal o link e acabei vendo outros links com uso mais complexo de Proxy...(membrane pattern, Proxy c/ weakmap, etc...). Não entendi tudo que li, mas vou ler de novo até entender... ;-).

Por exemplo entendi que fazer deep Proxy pode consumir desnecessariamente muita memória e prejudicar a performance. A alternativa para melhorar isso, seria usar weakmap, entendi o básico do weakmap e sua relação com o GC, mas ainda não consegui visualizar como implementar a solução Proxy + weakMap exatamente..

Vou continuar os estudos por aqui e se a coisa ficar muito feia, te aviso...

Abs

Não, nem com weakmap é recomendado. O que o cara que postou nesse link que te passei adotou uma má prática. Não é porque é possível que você vai fazer. Ele apenas mostrou uma prova de conceito.

O mais correto é você fazer o design de suas classes recebendo das dependências pelo construtor. Aliás, é um assunto que está agendado para o módulo 3. Só não tenho como explicar aqui detalhado porque envolve padrão, boas práticas, design de classes e por ai vai