Observing Changes using ES6 Proxies

ES6 Proxies can be used to observe changes / react to changes when an object property gets set through the proxy.

Decide for yourself whether & when it's appropriate to observe changes.

In this Twitter thread Addy Osmani lists some use cases for ES6 Proxies.

Always consider whether it is sensible to have mutable data, or whether immutable data structures are more appropriate. By the way, ES6 Proxies can be used to implement immutable data structures :) Here in this post I'll show one way of observing a mutable data object.

Check caniuse.com for the latest browser support info.

The code:

Run the example (repeatedly):

Output:

That's it! One way of observing property changes.