snippetjavascriptTip

Typechecking objects with Proxy in JavaScript

Submitted by: @import:30-seconds-of-code·Mar 2, 2026·

Viewed 0 times

javascripttypecheckingwithproxyobjects

Problem

A while back, I was working on a project where some objects had rigid structure requirements. As I was really not in the mood to use TypeScript, I decided to create a typechecking mechanism for objects using the Proxy object.
Drawing inspiration from React's PropTypes, I created a handful of typechecking functions for the most common types.
The next step was to decide on how an object's shape would be defined. This proved an easy task, as I could simply use the names of the type checking functions as values for the keys of the object.
Having decided how to define shapes, I needed to convert this shape definition into a function that would take an object and wrap it with a Proxy. The Proxy would in turn intercept any attempts to set a property and check if the value being set is of the correct type. If it is, the value is set as expected. If not, the trap returns false, which means the operation was not a success. Similarly, properties not in the shape definition should not be set, so the trap returns false for those as well.
Having set everything up, it was time to test it out. Here's an example of the whole thing put together:

Solution

const bool = v => typeof v === 'boolean';
const num = v => typeof v === 'number' && v === v;
const str = v => typeof v === 'string';
const date = v => v instanceof Date;

The next step was to decide on how an object's shape would be defined. This proved an easy task, as I could simply use the names of the type checking functions as values for the keys of the object.
Having decided how to define shapes, I needed to convert this shape definition into a function that would take an object and wrap it with a Proxy. The Proxy would in turn intercept any attempts to set a property and check if the value being set is of the correct type. If it is, the value is set as expected. If not, the trap returns false, which means the operation was not a success. Similarly, properties not in the shape definition should not be set, so the trap returns false for those as well.
Having set everything up, it was time to test it out. Here's an example of the whole thing put together:
As you can see, createShapeCheckerProxy can be used with a plain object to create a reusable function that wraps an object with a type checking Proxy. The defined types are used to typecheck individual properties and could be extended to support more complex types and special rules. Overall, this can be a pretty useful tool for typechecking objects at runtime, without having to use TypeScript or similar tools.

Code Snippets

const bool = v => typeof v === 'boolean';
const num = v => typeof v === 'number' && v === v;
const str = v => typeof v === 'string';
const date = v => v instanceof Date;

const shape = { name: 'str', age: 'num', active: 'bool', birthday: 'date' };

const createShapeCheckerProxy = (types, shape) => {
  const validProps = Object.keys(shape);
  const handler = {
    set(target, prop, value) {
      if (!validProps.includes(prop)) return false;
      const validator = types[shape[prop]];
      if (!validator || typeof validator !== 'function') return false;
      if (!validator(value)) return false;
      target[prop] = value;
    }
  };
  return obj => new Proxy(obj, handler);
};

Context

From 30-seconds-of-code: typecheck-proxy

Revisions (0)

No revisions yet.