Vue3.0 为什么采用 Proxy

Object.defineProperty()

作用:在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回这个对象。

1. 基本使用

语法:Object.defineProperty(obj, prop, descriptor)

参数:

  1. 要添加属性的对象

  2. 要定义或修改的属性的名称或 [Symbol]

  3. 要定义或修改的属性描述符

看一个简单的例子

let person = {}
let personName = 'lihua'

//在person对象上添加属性namep,值为personName
Object.defineProperty(person, 'namep', {
    //但是默认是不可枚举的(for in打印打印不出来),可:enumerable: true
    //默认不可以修改,可:wirtable:true
    //默认不可以删除,可:configurable:true
    get: function () {
        console.log('触发了get方法')
        return personName
    },
    set: function (val) {
        console.log('触发了set方法')
        personName = val
    }
})

//当读取person对象的namp属性时,触发get方法
console.log(person.namep)

//当修改personName时,重新访问person.namep发现修改成功
personName 

版权声明:本文为weixin_42066070原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。