Object.defineProperty基本用法

一、基本使用

Object.defineProperty是JavaScript中的一个方法，它用于在一个对象上定义一个新的属性或修改已经存在的属性。

使用Object.defineProperty，我们可以通过以下方式定义一个属性：

Object.defineProperty(obj, prop, descriptor)
1

• obj：要定义属性的对象。
• prop：要定义或修改的属性的名称。
• descriptor：一个对象，用于描述属性的特性。包括以下可选的属性：
  • value：属性的值。
  • writable：是否可以修改属性的值（默认为false）。
  • enumerable：是否可以通过for…in或Object.keys()遍历到该属性（默认为false）。
  • configurable：是否可以通过delete运算符删除属性或修改属性的特性（默认为false）。
  • get：获取属性值的方法。
  • set：设置属性值的方法。

通过Object.defineProperty，我们可以灵活地控制属性的特性。例如，我们可以定义一个只读的属性，不允许修改其值：

let obj = {};
Object.defineProperty(obj, 'readOnlyProp', {
  value: 'read only',
  writable: false
});
obj.readOnlyProp = 'new value'; // 报错，不能修改只读属性
1
2
3
4
5
6

我们还可以定义一个计算属性，其中get方法用于计算属性值：

let obj = {
  x: 5,
  y: 10
};
Object.defineProperty(obj, 'sum', {
  get: function() {
    return this.x + this.y;
  }
});
console.log(obj.sum); // 输出 15
1
2
3
4
5
6
7
8
9
10

另外，Object.defineProperty方法可以用来修改已存在属性的特性。例如，我们可以将一个已有的属性改为只读：

let obj = {
  prop: 'value'
};
Object.defineProperty(obj, 'prop', {
  writable: false
});
obj.prop = 'new value'; // 报错，无法修改只读属性
1
2
3
4
5
6
7

总之，Object.defineProperty是一个非常有用的方法，可以用来定义和修改对象的属性，从而更好地控制属性的特性和行为。

二、数据代理

使用Object.defineProperty实现数据代理，比如将A对象的下的属性，代理到B对象上，当我访问B.a的时候，其实访问的是A.a
要使用Object.defineProperty实现数据代理，可以通过以下步骤实现将A对象的属性代理到B对象上。

1. 创建A对象和B对象：

const A = {};
const B = {};
1
2

2. 使用Object.defineProperty将A对象的属性代理到B对象上：

Object.defineProperty(B, 'a', {
    get: function () {
        return A.a;
    },
    set: function (newValue) {
        A.a = newValue;
    }
});
1
2
3
4
5
6
7
8

这会将A对象下属性a的访问和赋值操作代理到B对象下的属性a上。

3. 测试数据代理：

A.a = 123;
console.log(B.a);  // 输出: 123

B.a = 456;
console.log(A.a);  // 输出: 456
1
2
3
4
5

现在，访问B对象的属性a实际上是在访问A对象的属性a，对B对象的属性a赋值实际上是在修改A对象的属性a。这样就实现了数据代理的功能。