export class Observe{
constructor (value){
this.value = value;
this.walk (value)
}
walk (obj){
const keys = Object.keys(obj)
for(let i=0; i<keys.length; i++){
defineFn(obj,keys[i])
}
}
}
function defineFn (obj,key,val){
if(arguments.length === 2 ){
val = obj[key]
}
if(typeof val === 'object'){
console.log('@',777);
new Observe(val)
}
Object.defineProperty(obj,key,{
get(){
console.log(`${key}属性内读取了${val}`);
return val
},
set(newVal){
console.log(`${key}属性被修改了${newVal}`);
}
})
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
<script type="module">
import {Observe} from './observe.js';
let obj = {a:1,b:'22',c:{s:999}}
let p= new Observe(obj)
console.log(p);
obj.a
obj.a=22
obj.b
obj.b=999
obj.c.s
obj.c.s=888
// console.log(p);
// console.log(Observe);
</script>