Objetos de proxy de JavaScript

Cuando trabajamos con objetos, podemos crear unobjeto proxyque intercepta y cambia el comportamiento de un objeto existente.

Lo hacemos usando elApoderadoobjeto nativo, introducido en ES2015.

Supongamos que tenemos uncarobjeto:

const car = {
  color: 'blue'
}

Un ejemplo muy simple que podemos hacer es devolver una cadena 'No encontrado' cuando intentamos acceder a una propiedad que no existe.

Puede definir un proxy al que se llama cada vez que intenta acceder a una propiedad de este objeto.

Lo hace creando otro objeto que tiene unget()método, que recibe el objeto de destino y la propiedad como parámetros:

const car = {
  color: 'blue'
}

const handler = { get(target, property) { return target[property] ?? ‘Not found’ } }

Ahora podemos inicializar nuestro objeto proxy llamandonew Proxy(), pasando el objeto original y nuestro controlador:

const proxyObject = new Proxy(car, handler)

Ahora intente acceder a una propiedad contenida en elcarobjeto, pero haciendo referencia a él desdeproxyObject:

proxyObject.color //'blue'

Esto es como llamarcar.color.

Pero cuando intentas acceder a una propiedad que no existe encar, me gustacar.test, volveríasundefined. Usando el proxy, obtendrá de vuelta el'Not found'cadena, ya que eso es lo que le dijimos que hiciera.

proxyObject.test //'Not found'

No estamos limitados aget()método en un controlador de proxy. Ese fue el ejemplo más simple que pudimos escribir.

Tenemos otros métodos que podemos usar:

  • applyse llama cuando usamosapply()en el objeto
  • constructse llama cuando accedemos al constructor de objetos
  • deletePropertyse ejecuta cuando intentamos eliminar una propiedad
  • definePropertyse llama cuando definimos una nueva propiedad en el objeto
  • setse ejecuta cuando intentamos establecer una propiedad

etcétera. Básicamente, podemos crear una puerta protegida que controle todo lo que sucede en un objeto y proporcionar reglas y controles adicionales para implementar nuestra propia lógica.

Otros métodos (también llamadostrampas) que podemos utilizar son:

  • enumerate
  • getOwnPropertyDescriptor
  • getPrototypeOf
  • has
  • isExtensible
  • ownKeys
  • preventExtensions
  • setPrototypeOf

todo correspondiente a la funcionalidad respectiva.

Usted puedeleer más sobre cada uno de ellos en MDN.

Hagamos otro ejemplo usandodeleteProperty. Queremos evitar eliminar propiedades de un objeto:

const car = {
  color: 'blue'
}

const handler = { deleteProperty(target, property) { return false } }

const proxyObject = new Proxy(car, handler)

Si llamamosdelete proxyObject.color, obtendremos un TypeError:

TypeError: 'deleteProperty' on proxy: trap returned falsish for property 'color'

Of course one could always delete the property directly on the car object, but if you write your logic so that that object is inaccessible and you only expose the proxy, that is a way to encapsulate your logic.


More js tutorials: