首页  >  文章  >  web前端  >  JavaScript Proxy()对象的理解使用(代码示例)

JavaScript Proxy()对象的理解使用(代码示例)

藏色散人
藏色散人原创
2019-03-27 15:19:512553浏览

JavaScript中的代理对象用于定义基本操作的自定义行为(例如,属性查找,赋值,枚举,函数调用等)。

JavaScript  Proxy()对象的理解使用(代码示例)

语法:

var p = new Proxy(target, handler);

参数:代理对象接受如上所述的两个参数,如下所述:

target:要使用Proxy包装的目标对象(可以是任何类型的对象,包括函数,类,甚至是另一个代理)。

handler:一个对象,其属性是在对其执行操作时定义代理行为的函数。

例:

<script> 
const Person = { 
    Name: &#39;John Nash&#39;, 
    Age: 25 
}; 
  
const handler = { 
    // target表示Person,而prop表示代理属性。
    get: function(target, prop) { 
        if (prop === &#39;FirstName&#39;) { 
            return target.Name.split(&#39; &#39;)[0]; 
        } 
        if (prop === &#39;LastName&#39;) { 
            return target.Name.split(&#39; &#39;).pop(); 
        } 
        else { 
            return Reflect.get(target,prop); 
        } 
    } 
}; 
  
const proxy1 = new Proxy(Person, handler); 
  
document.write(proxy1 + "<br>"); 
  
// 虽然没有像FirstName和LastName那样的属性,但是我们仍然获取到它们,就好像它们是属性而不是函数一样。
document.write(proxy1.FirstName + "<br>"); 
document.write(proxy1.LastName  + "<br>");      
</script>

输出:

[object Object]
John
Nash

注意:如果安装了NodeJs,上面的代码可以直接在终端运行,否则可以在HTML文件中运行,方法是在script标签中粘贴上面的代码,然后在任何web浏览器的控制台中检查输出。

相关推荐:《JavaScript教程

以上是JavaScript Proxy()对象的理解使用(代码示例)的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn