当前位置:首页 > JavaScript

js 实现反射

2026-03-15 02:07:36JavaScript

反射的基本概念

反射(Reflection)是指在运行时检查、访问和修改对象的结构和行为的能力。JavaScript 虽然没有像 Java 或 C# 那样内置完整的反射 API,但可以通过一些内置方法和特性实现类似功能。

获取对象的属性和方法

使用 Object.keys()Object.getOwnPropertyNames()Reflect.ownKeys() 可以获取对象的属性列表。

const obj = { a: 1, b: 2 };
console.log(Object.keys(obj)); // ["a", "b"]
console.log(Reflect.ownKeys(obj)); // ["a", "b"]

动态访问属性

通过字符串名称动态访问对象的属性,可以使用 []Reflect.get()

js 实现反射

const obj = { a: 1, b: 2 };
const propName = 'a';
console.log(obj[propName]); // 1
console.log(Reflect.get(obj, propName)); // 1

动态调用方法

使用 Function.prototype.apply()Reflect.apply() 动态调用方法。

const obj = {
  greet: function(name) {
    return `Hello, ${name}!`;
  }
};

const methodName = 'greet';
console.log(obj[methodName].apply(obj, ['Alice'])); // "Hello, Alice!"
console.log(Reflect.apply(obj[methodName], obj, ['Bob'])); // "Hello, Bob!"

检查对象类型

使用 typeofinstanceofObject.prototype.toString.call() 检查对象的类型。

js 实现反射

const value = [1, 2, 3];
console.log(typeof value); // "object"
console.log(value instanceof Array); // true
console.log(Object.prototype.toString.call(value)); // "[object Array]"

修改对象行为

通过 Object.defineProperty()Reflect.defineProperty() 动态修改对象的属性行为。

const obj = {};
Reflect.defineProperty(obj, 'x', {
  value: 42,
  writable: false
});
console.log(obj.x); // 42
obj.x = 100; // 静默失败(严格模式下会报错)
console.log(obj.x); // 42

创建代理对象

使用 Proxy 对象可以对目标对象的操作进行拦截和自定义。

const target = { a: 1 };
const handler = {
  get: function(target, prop) {
    return prop in target ? target[prop] : 0;
  }
};
const proxy = new Proxy(target, handler);
console.log(proxy.a); // 1
console.log(proxy.b); // 0

反射 API(ES6)

ES6 引入了 Reflect 对象,提供了一组静态方法用于反射操作。

const obj = { a: 1 };
console.log(Reflect.has(obj, 'a')); // true
console.log(Reflect.set(obj, 'b', 2)); // true
console.log(obj.b); // 2

通过这些方法,JavaScript 可以实现灵活的反射功能,适用于动态代码生成、元编程等场景。

标签: 反射js
分享给朋友:

相关文章

js实现文件下载

js实现文件下载

使用 a 标签下载文件 通过动态创建 a 标签并设置 download 属性实现文件下载。适用于已知文件 URL 或 Blob 数据的情况。 function downloadFile(url, f…

js实现上传文件

js实现上传文件

文件上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API可以实现文件上传功能。 <input type="file"…

js图片轮播的实现

js图片轮播的实现

基础图片轮播实现 使用HTML、CSS和JavaScript实现一个简单的图片轮播效果。HTML部分定义轮播容器和图片,CSS负责样式和过渡效果,JavaScript处理逻辑。 <div cl…

js实现原理

js实现原理

JavaScript 实现原理 JavaScript 是一种解释型语言,其实现原理涉及多个核心组件和运行机制,包括引擎、运行时环境、事件循环等。 引擎与解释执行 现代 JavaScript 引擎(如…

js 实现日历

js 实现日历

实现日历的基本思路 日历的核心功能是展示日期,并允许用户进行日期选择或导航。JavaScript 可以动态生成日历的 HTML 结构,并处理用户交互逻辑。 基础日历结构 日历通常包含头部(显示月份和…

js实现排序

js实现排序

数组排序方法 JavaScript提供了内置的sort()方法用于数组排序。默认情况下,sort()将元素转换为字符串并按照Unicode码点排序。对于数字排序,需传入比较函数。 const num…