这篇文章是接上一篇继续来总结一下关于数据监测 observer 实现响应式的原理。
响应式的原理:
只要要数据发生改变,页面视图就发生变化
简单来说 就是一个方法,里面使用for in循环,分别为对象属性添加 get() 和 set() 方法,来实现对数据监测,这就要用到上一篇文章中提到的 defineProperty 对象自定义属性
直接看段代码:
let obj ={
name:'tom',
age:22,
company:{
address:'北京'
}
};
obj.name = 'lily'
如果想实现在改变数据的同时,页面视图或者用到次数据的地方也能够做出相应,所以就要对这个数据做观察,就需要重新定义属性,使用 defineProperty()方法
let obj ={
name:'tom',
age:22,
company:{
address:'北京'
}
};
//观察数据
function observe(obj){
for(let key in obj){
let val = obj[key];//将原有的值先存到第三方变量中
Object.definePropert