JavaScript defineProperty() 方法

JavaScript 的handler.defineProperty() 方法用於定義物件上的新屬性或修改現有屬性。它是 Proxy 物件的一部分，允許你為另一個物件建立代理並修改其行為。此方法接受三個引數：目標物件、屬性鍵和屬性描述符。

屬性描述符是一個物件，它定義了屬性的特性，例如其值、是否可寫或可配置。此方法提供了一種控制屬性訪問和操作方式的方法，從而實現資料驗證等高階功能。

語法

以下是 JavaScript handler.defineProperty() 方法的語法：

new Proxy(target, {
   defineProperty(target, property, descriptor) {}
});

引數

target − 表示目標物件。
property − 表示要檢索其描述的屬性的名稱或符號。
descriptor − 要定義或修改的屬性的描述符。

返回值

此方法返回一個布林值，指示屬性是否成功定義。

示例 1

讓我們來看下面的例子，我們將定義一個新屬性。

<html>
<style>
body {
   font-family: verdana;
   color: #DE3163;
}
</style>
<body>
<script>
let x = {};
let y = {
   defineProperty(x, propertyKey, descriptor) {
      document.write(JSON.stringify(descriptor));
      return Reflect.defineProperty(x, propertyKey, descriptor);
   }
};
let z = new Proxy(x, y);
z.tp = 132;
</script>
</body>
</html>

輸出

如果執行上述程式，它將在網頁上顯示文字。

示例 2

考慮另一個場景，我們將修改現有屬性。

<html>
<style>
body {
   font-family: verdana;
   color: #DE3163;
}
</style>
<body>
<script>
let x = {
   tp: 1122
};
let y = {
   defineProperty(x, propertyKey, descriptor) {
      document.write(JSON.stringify(descriptor));
      return Reflect.defineProperty(x, propertyKey, descriptor);
   }
};
let c = new Proxy(x, y);
c.tp = 'WELCOME';
</script>
</body>
</html>

輸出

執行上述指令碼後，它將在網頁上顯示文字。

列印頁面