function proxy(initialState) { if (!(typeof initialState === "object" && initialState !== null) && Array.isArray(initialState)) { throw new Error("proxy must be an object or an array"); } const handler = { get(target, property) { return target[property]; }, set(target, property, value) { // Short-circuit if value changed is the same, prevents performance issues. if (target[property] === value) return true; // initialised ?? customLog(target, property, value); console.log(target, property, value); if (typeof value === "object") { value = proxy(value); } return target[property] = value; }, }; const proxiedObject = new Proxy({}, handler); /** * We need to loop the state manually inorder to convert the deeply nested * objects into proxies. * * Initially the proxied object is {} empty. * When we loop, we take every key from the initialState passed as parameter and set it in the proxiedObject along with it's value. When this is done, the set() TRAP is called internally. During which we check if the initalState's value is an array or object. If so, we wrap it in another Proxy and set it as the value to the parent proxiedObject. */ for (const key in initialState) { proxiedObject[key] = initialState[key]; } initialised = true; return proxiedObject; }