Object.defineProperty

来源:3-3 监听data变化的核心API是什么

齊帥

2021-03-29 17:30:35

老師請問Object.defineProperty這個東西是JS的原生方法嗎?所以我們是在這個方法上定義他的get跟set來達到監聽的效果嗎?可否詳細解釋一下這個方法,因為完全不了解此方法是個什麼東西....

写回答

1回答

好帮手慕慕子

2021-03-29

同学你好,对于你的问题解答如下:

1、是的,Object.defineProperty是js提供的原生方法。

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

(1)语法:

Object.defineproperty( object,‘propName’ ,descriptor);

(2)参数详解:

  • object :要定义属性的对象,返回的也是

  • propName :要定义或修改的属性的名称。

  • descriptor:要定义或修改的属性描述符

(3)重点了解下该方法如何监测数据,配合get和set方法实现数据绑定。可以结合注释测试理解下面的代码示例:

  var obj = {}
       const res =  Object.defineProperty(obj, 'age', {
            get() {
                console.log('触发了get方法...')
                return age;//返回age的值
            },
            set(val) {
                console.log('触发了set方法...')
                age = val // 给age设置值
            }
        })
        //  Object.defineProperty()方法在obj对象添加了一个新属性age,并返回该对象
        console.log(res)
        // 给age属性设置值时,默认会触发set方法,,此时控制台会输出'触发了set方法...'
        obj.age = 18
        // 访问age属性时,默认会触发get方法,此时控制台会输出'触发了get方法...'
        console.log(obj.age)

控制台打印结果如下:

http://img.mukewang.com/climg/6061a5ee09a2edb414830514.jpg

祝学习愉快~

0

0 学习 · 15276 问题

查看课程