JavaScript Reflect 对象
在 JavaScript 中,Reflect 是一个全局对象,在 ECMAScript 6 (ES6) 中引入。它包含静态方法,提供了一种在运行时与对象交互的更好方法。
与大多数全局对象不同,Reflect 不是构造函数。您不能将其与 new 运算符一起使用,也不能将 Reflect 对象作为函数调用。Reflect 的所有方法都是静态的,就像 Math 对象一样。
它包含在运行时从对象访问、更新、删除等属性的各种方法。
Reflect 对象的主要功能
- 对象构造 − Reflect API 允许在运行时使用 Reflect.construct() 方法创建对象。
- 函数调用 − Reflect API 的 apply() 方法用于通过传递上下文和参数来调用函数或对象方法。
- 对象属性操作 − Reflect API 具有不同的方法来设置、更新或删除对象属性。此外,它还可以通过阻止对象扩展来处理对象的扩展。
语法
以下是使用 Reflect API 方法的语法 -
Reflect.method();
在上面的语法中,'method' 是泛化。它可以是 Reflect API 的任何方法,例如 get、set、apply、construct、has 等。
Reflect 方法
在下表中,我们列出了 Reflect 的所有方法 -
名称 |
描述 |
---|---|
apply() |
调用函数。 |
construct() |
允许指定不同的原型。 |
defineProperty() |
允许插入或编辑对象属性。 |
deleteProperty() |
允许删除 object 属性。 |
get() |
获取属性的值。 |
getOwnPropertyDescriptor() |
允许获取对象的描述符。 |
getPrototypeOf() |
获取对象的原型。 |
has() |
检查对象中是否存在该属性。 |
isExtensible() |
允许检查对象是否可扩展。 |
ownKeys() |
返回目标对象自己的键,并忽略继承的键。 |
preventExtensions() |
防止对象的扩展。 |
set() |
将值设置为 object 属性。 |
setPrototypeOf() |
允许将对象的原型设置为 null 或其他对象。 |
例子
示例 1
在下面的示例中,我们定义了一个 car 对象。'prop' 变量包含字符串格式的属性名称。
我们使用 Reflect 对象的 get() 方法从 car 对象访问 'model' 属性。我们将对象名称作为 get() 方法的第一个参数传递,将属性名称作为第二个参数传递。
在输出中,您可以看到 'model' 属性的值。
<html>
<body>
<div id="output">The model of the car is: </div>
<script>
const car = {
name: "Audi",
model: "Q6",
price: 7000000,
}
let prop = "model";
let model = Reflect.get(car, prop);
document.getElementById("output").innerHTML += model;
</script>
</body>
</html>
输出
示例 2
在下面的示例中,我们使用 set() 方法将属性设置为对象。set() 方法将对象、属性名称和值作为参数。
输出显示 'doors' 属性值。这样,您可以在 Reflect API 的 set() 方法在运行时将属性设置为对象。
<html>
<body>
<div id="output">The total doors in the Audi Q6 is: </div>
<script>
const car = {
name: "Audi",
model: "Q6",
price: 7000000,
}
const model = Reflect.set(car, "doors", 4);
document.getElementById("output").innerHTML += car.doors;
</script>
</body>
</html>
输出
在执行上述脚本时,将弹出输出窗口,在网页上显示文本。
示例 3
在下面的示例中,我们使用 has() 方法动态地检查对象中是否存在特定属性。
这两个符号看起来相似但不同,您可以在输出中看到这一点。
<html>
<body>
<p id="output"></p>
<script>
const car = {
name: "Audi",
model: "Q6",
price: 7000000,
}
const isName = Reflect.has(car, "name");
if (isName) {
document.getElementById("output").innerHTML = "The Car object contains the name.";
}
</script>
</body>
</html>
输出