【Vue学习】——何为数据代理

重生之搬砖忍者

于 2023-10-15 18:21:43 发布

阅读量98

点赞数

文章标签： vue.js 学习前端

本文链接：https://blog.youkuaiyun.com/qq_54847700/article/details/133845696

版权

本文介绍了JavaScript中如何使用数据代理实现对对象属性的操作，通过`Object.defineProperty`方法实现在obj2上代理obj的x属性，支持读取和设置值。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>何为数据代理</title>
</head>
<body>
    <!-- 数据代理：通过一个对象代理对另一个对象中属性的操作（读/写） -->
<script typr="text/javascript">
    let obj = {x:100}
    let obj2 = {y:200}

    Object.defineProperty(obj2,'x',{
        get(){
            return obj.x
        },
        set(value){
            obj.x=value
        }
    })

</script>

</body>
</html>