Object.defineProperty()死循环的问题

Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象。
语法:

Object.defineProperty(obj, prop, descriptor)

obj:要定义属性的对象
prop:要定义或修改的属性的名称或 Symbol
descriptor:要定义或修改的属性描述符

image.png

数据描述符:

            
            let obj = {}
            Object.defineProperty(obj, 'name', {
                value: 1,
            })
            console.log(obj.name)//1
            obj.name = 'zqf'
            console.log(obj.name)//1
            
            let obj = {}
            Object.defineProperty(obj, 'name', {
                value: 1,
                writable: true
            })
            console.log(obj.name)//1
            obj.name = 'zqf'
            console.log(obj.name)//zqf

存取描述符:

           
            let obj = {
                initValue: '1',
            }
            Object.defineProperty(obj, 'name', {
                get(){
                    return obj.initValue
                },
                set(value) {
                    obj.initValue = value
                }
            })
            console.log(obj.name)
            obj.name = 'zqf'
            console.log(obj.name)
            

使用存取描述符遇到的问题:
当Object.defineProperty设置的prop和obj原有的prop相同时会造成死循环,如下面的initValue属性

            let obj = {
                initValue: '1',
            }
            Object.defineProperty(obj, 'initValue', {
                get(){
                    return obj.initValue
                },
                set(value) {
                    obj.initValue = value
                }
            })
            console.log(obj.initValue)
            obj.initValue = 'zqf'
            console.log(obj.initValue)

原因:
console.log(obj.initValue)触发get方法,return obj.initValue再次触发get方法
obj.initValue = 'zqf'触发set方法,obj.initValue = value再次触发set方法

详细的说明请看MDN文档

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容