一、基本定义
1.js中的对象属性有两种:数据属性和访问器属性。每种属性都包含各自的特性,供内部使用,js不能直接访问,但是可以通过Object.defineProperty()访问、修改。
2.访问器属性
(1)Object.defineProperty()接受三个参数:属性所在的对象,属性名称和一个描述符对象
var obj = {_name:"张三"};
Object.defineProperty(obj, "name",{
get:function(){
return this._name;
},
set:function(newValue){
this._name = newValue;
console.log("属性值被更改,通知wacher,对象的属性值被更改");
}
})
二、Object.defineProperty()的局限性
1.监测不到对象属性的添加、删除
eg: var data = {_obj:{}}
obj.defineProperty(obj,"obj",{
get:function(){
return this._data;
},
set:function(newValue){
console.log("变化了")
}
})
data.obj.name = "张三";//监测不到
vue中的解决方案:Vue.$set(obj,''name","zhangsan");
2.监测不到数组长度的变化、给数组的某一项直接赋值
eg:var arr = [1,2,3,5];
arr.length = 0;//监测不到
arr[0] = 10;//监测不到
Vue中的解决方案:Vue 实现了一组观察数组的变异方法,可以调用他们来触发视图的更新
源码如下:
Vue中Object.defineProperty()的应用
WGHZ5@@`1$E58$EVVO(LV3N.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 1.ios高性能编程 (1).内层 最小的内层平均值和峰值(2).耗电量 高效的算法和数据结构(3).初始化时...
- 本文是lhyt本人原创,希望用通俗易懂的方法来理解一些细节和难点。转载时请注明出处。文章最早出现于本人github...