数据劫持
/*
1.Object.getOwnPropertyDescriptor([obj], [key])
2.Object.getOwnPropertyDescriptors([obj])
+ configurable: true
+ enumerable: true [for...in / Object.keys]
+ writable: true··
+ value: 10
+ 即“常规手段”设置对象成员,一般可删除,可枚举,可修改。
+ 但浏览器内置的属性/方法,一般是不可枚举,可删除,可修改。
*/
let obj = {
x: 10,
y: 20
}
console.log(Object.getOwnPropertyDescriptor(obj, 'x'))
/*
Object.defineProperty([obj],[key],{
// 设置规则
})
// 默认规则
+ 成员不存在,新增后默认都是false
+ 成员存在,修改规则前的规则
*/
/*
Object.defineProperty 数据劫持
*/
let obj = {
x: 10,
y: 20
}
let proxy = { ...obj }
Object.defineProperty(obj, 'x', {
get(){
// 访问x成员值时候会触发get
// 函数的返回值就是成员访问的结果
// return obj.x; // => 死递归
return proxy.x
},
set(val){
// 设置x成员值得时候触发set
// val为新值
// obj.x = val // 死递归
proxy.x = val
}
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
编辑 (opens new window)
上次更新: 2023/10/07, 23:46:08