vue计算属性 computed_vue computed 处理枚举值-优快云博客

本文介绍了计算属性在JavaScript中的应用，包括其定义、使用Object.defineProperty方法实现getter和setter，get函数的执行时机，以及它相对于methods的优势，如缓存提高效率和便于调试。讲解了如何通过定义和设置set函数来管理计算属性的修改。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、定义：要用的属性不存在，要通过已有属性计算得来
2、原理：底层借助了Objcet.defineproperty方法提供的getter和setter
3、get函数什么时候执行？？
（1）、初次读取时会执行一次
（2）、当依赖的数据发生改变时会被再次调用
4、优势：与methods实现相比，computed（计算属性）内部有缓存机制（复用），效率更高，调式方便
5、备注：
（1）计算属性最终会出现在vm上，直接读取使用即可
（2）如果计算属性要被修改，那必须写set函数去响应修改，且set要引起计算时依赖的数据发生改变

Object.defineProperty方法

let person= {
name:'张三'
sex:'男'
}
//Object.defineProperty
第一个参数指向person
第二个是要穿进对象的参数
第三个是对象，里面有很多值，value是给第二个参数赋值的
Object.defineProperty(person,"age"{
value:18，//不加下面的代码默认情况下，age的值是不可以枚举（不可以遍历）的
enumerable:true,//控制属性是否可以枚举，默认false
writable:true,//控制属性是否可以被修改，默认false
configurable:true//控制属性是否可以呗删除,默认false

1、当有人读取person的age属性时,get()就会被调用,且返回就是age的值
get(){
return //返回所需要改的值
}
//当有人修改person的age属性时,set函数就会被调用，且会收到修改的具体值
set(value){

}
})