es6基础知识5(defineProperty)


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()的第一个参数是要在其上定义属性的对象,第二个参数是要定义或者修改属性的名称,第三个是属性的修饰符。属性的修饰符包括有configurableenumerablewritablevalue等等,这些属性的描述符定义了属性的值,熟悉是否可配置,可枚举,可写,此外还包括属性的读写描述符,详细的可以参考这里defineProperty。需要强调的是,通过 defineProperty() 添加或修改的属性,configurableenumerablewritable默认是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没有被枚举出来,原因就在于通过.[]操作符添加的属性,其configurableenumerablewritable默认为true,而通过defineProperty()默认为false

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容