title: es6基础知识5(defineProperty)
date: 2019-06-30 08:58:35
tags:
-defineProperty
categories:
-前端
我们都知道,在创建了一个对象后,如果要添加或者修改对象的属性,可以通过.
和[]
操作符来实现,就像这样:
let obj1 = {x: 1, y: 2}
obj1.x = 2; //修改属性
obj1.z = 3; //添加属性
在es6中,defineProperty()
方法的作用跟.
和[]
操作符的作用类似,也可以实现添加修改对象的属性。不过,相比之下,defineProperty()
能够实现对属性描述符的设置。
在mdn中,对defineProperty
的解释是这样的Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。
具体来讲这个方法这样使用:
let obj = {x: 1, y: 2}
Object.defineProperty(obj, 'z', {
value: 3,
writable: true,
enumerable: true
})
defineProperty()
的第一个参数是要在其上定义属性的对象,第二个参数是要定义或者修改属性的名称,第三个是属性的修饰符。属性的修饰符包括有configurable
、enumerable
、writable
、value
等等,这些属性的描述符定义了属性的值,熟悉是否可配置,可枚举,可写,此外还包括属性的读写描述符,详细的可以参考这里defineProperty。需要强调的是,通过 defineProperty()
添加或修改的属性,configurable
、enumerable
、writable
默认是false。因此for...in
循环中,不能循环到这些属性。
let obj = {x: 1, y: 2}
Object.defineProperty(obj, 'z', {
value: 3
})
console.log(obj)
for(let attr in obj) {
console.log(attr)
}
运行结果:
可以看出通过控制台打印出的obj属性里包含属性z
,但是z
没有被枚举出来,原因就在于通过.
或[]
操作符添加的属性,其configurable
、enumerable
、writable
默认为true
,而通过defineProperty()
默认为false