js中的数据描述符和数据存储符
OneWord 2020-12-04 JavaScript
# JS中对象添加属性的传统方法
let obj = {}
obj.a = 1
1
2
2
# 添加属性使用数据描述符
这时候我们需要使用Object.defineProperty()给对象添加属性。可接受三个参数,第一个参数为对象名称,第二个参数为添加的属性名,第三个参数为一个对象。如下:
let obj = {}
Object.defineProperty(obj, 'a', {
value: 1, //添加值
enumerable: true //可遍历
})
1
2
3
4
5
2
3
4
5
以上方法value的值即为a的属性值,enumerable即为数据描述符,true即为可遍历。其中,对象中还可以传入其他数据描述符,如下:
let obj = {}
Object.defineProperty(obj, 'a', {
value: 1, //添加值
enumerable: true, //是否可遍历
writable:true, //是否可以修改
configrable:true //是否可以删除
})
1
2
3
4
5
6
7
2
3
4
5
6
7
其中,除了enumerable这个数据描述符外,还有writable,configrable,当值修改为flase时,对象便无法进行修改删除操作。
# 添加属性使用数据存储符
数据存储符即为一个函数,get即为当获取了某一属性就执行该函数,而set为当设置了某一属性就执行该函数 如下:
let obj2 = {}
Object.defineProperty(obj2,'key',{
get:function(){ //只要获取key属性就执行该函数
console.log('我获取了key')
},
set:function(){ //只要设置key属性就执行该函数
console.log('我设置了key')
}
})
obj2.key //控制台打印"我获取了key"
obj2.key = 2 //控制台打印"我设置了key"
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11