JavaScript 代理能否为未定义的属性创建动态 Getter 和 Setter？

JavaScript 中的动态 Getter 和 Setter

简介：

JavaScript 提供了灵活的机制，通过 getter 和 setter 来访问和修改属性设置器。虽然如何为预先确定的属性名称定义 getter 和 setter 是众所周知的，但出现了一个问题：是否可以实现适用于未定义属性名称的动态 getter 和 setter？

动态 Getters使用代理的 Setters (ES6)：

从 ES2015 开始，JavaScript 引入了代理，它允许创建充当其他对象的“外观”的对象。这可以拦截和修改属性操作，包括 getter 和 setter。

示例：

以下代码片段演示了使用代理的动态 getter 和 setter：

<code class="javascript">"use strict";
if (typeof Proxy == "undefined") {
    throw new Error("This browser doesn't support Proxy");
}
let original = {
    example: "value",
};
let proxy = new Proxy(original, {
    get(target, name, receiver) {
        if (Reflect.has(target, name)) {
            let rv = Reflect.get(target, name, receiver);
            if (typeof rv === "string") {
                rv = rv.toUpperCase();
            }
            return rv;
        }
        return "missing";
    }
});

console.log(`original.example = ${original.example}`); // "original.example = value"
console.log(`proxy.example = ${proxy.example}`);       // "proxy.example = VALUE"
console.log(`proxy.unknown = ${proxy.unknown}`);       // "proxy.unknown = missing"
original.example = "updated";
console.log(`original.example = ${original.example}`); // "original.example = updated"
console.log(`proxy.example = ${proxy.example}`);       // "proxy.example = UPDATED"</code>

在此示例中：

• 原始对象包含一个值为“value”的属性示例。
• 代理被创建为原始对象的外观，具有get() 处理程序。
• get() 处理程序拦截属性访问。如果该属性在原始版本中存在，则返回其值。如果未找到该属性，则返回“missing”。
• 如果访问的属性值为字符串，则将其转换为大写。
• 通过代理修改属性会反映在原始内容中。
• 创建代理后在原始文件上定义的属性也可以通过代理访问。

以上是JavaScript 代理能否为未定义的属性创建动态 Getter 和 Setter？的详细内容。更多信息请关注PHP中文网其他相关文章！