<!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>
let a = { b: 1 };
let c = { d: 2 };
// 場景：通過（操作）c讀到b，也能修改（寫）b
Object.defineProperty(c, "b", {
// 通過c通路b時
get() {
return a.b;
},
// 調用時意味要改變c的b
set(val) {
a.b = val;
},
});
</script>
</body>
</html>
首先，驗證一下a上有沒有b，列印結果如下圖，是存在b的
再驗證一下c上有沒有b,列印如下圖，也是有的
來列印一下c,能看到c上原來的屬性d：2，同時也存在b，invoke property getter，值為1，及為b服務的get和set方法
這時候來修改一下c.b的資料 =100,并且列印a.b的資料，如下，發現a.b的值被修改了。