在 JavaScript 中使用代理对对象进行类型检查

最新推荐文章于 2024-07-08 20:44:40 发布

Q shen

最新推荐文章于 2024-07-08 20:44:40 发布

阅读量138

点赞数

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/qq_52010446/article/details/130449268

版权

本文介绍了如何受到React PropTypes的启发，在JavaScript中利用Proxy创建一个类型检查器，用于在运行时验证对象属性的类型。通过定义不同类型的检查函数，如bool、num、str和date，然后创建一个形状定义，结合Proxy的set陷阱，确保对象属性赋值符合预设的类型。这种方法允许在不使用TypeScript等静态类型检查工具的情况下，进行动态类型检查。

摘要由CSDN通过智能技术生成

从 React 的中汲取灵感，我为最常见的类型PropTypes创建了一些类型检查函数。

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’ };
决定了如何定义形状后，我需要将这个形状定义转换成一个函数，该函数接受一个对象并用Proxy. Proxy反过来，它会拦截任何设置属性的尝试，并检查设置的值是否属于正确的类型。如果是，则该值按预期设置。如果没有，陷阱返回false，这意味着操作不成功。同样，不应设置不在形状定义中的属性，因此false这些陷阱也会返回。

const createShapeCheckerProxy = (types, shape) => {
const validProps = Object.keys(shape);
const handler = {
set(target, prop, value) {
if (!validProps.includes(prop)) return false;