Untitled

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>

<script id="jsbin-javascript">
function Observer(data) {
    this.data = data;
    this.traversal(data);
}

Observer.prototype.traversal = function(obj) {
    let val;
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            val = obj[key];

            if (typeof val === 'object') {
                new Observer(val);
            }
            this.convert(key, val);
        }
    }
}

Observer.prototype.convert = function(key, val) {
    Object.defineProperty(this.data, key, {
        configurable: true,
        enumerable: true,
        get: function() {
            console.log(`你访问了 ${key}`);
            return val;
        },
        set: function(newVal) {
            console.log(`你设置了 ${key}, 新的值为${newVal}`);
            if (val === newVal) return;
            val = newVal;
        }
    });
}

let app1 = new Observer({
    name: 'youngwind',
    age: 25
});

let app2 = new Observer({
    university: 'bupt',
    major: 'computer'
});

app1.data.name;
app1.data.age = 100;
app2.data.university;
app2.data.major = 'science';
</script>


<script id="jsbin-source-javascript" type="text/javascript">function Observer(data) {
    this.data = data;
    this.traversal(data);
}

Observer.prototype.traversal = function(obj) {
    let val;
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            val = obj[key];

            if (typeof val === 'object') {
                new Observer(val);
            }
            this.convert(key, val);
        }
    }
}

Observer.prototype.convert = function(key, val) {
    Object.defineProperty(this.data, key, {
        configurable: true,
        enumerable: true,
        get: function() {
            console.log(`你访问了 ${key}`);
            return val;
        },
        set: function(newVal) {
            console.log(`你设置了 ${key}, 新的值为${newVal}`);
            if (val === newVal) return;
            val = newVal;
        }
    });
}

let app1 = new Observer({
    name: 'youngwind',
    age: 25
});

let app2 = new Observer({
    university: 'bupt',
    major: 'computer'
});

app1.data.name;
app1.data.age = 100;
app2.data.university;
app2.data.major = 'science';</script></body>
</html>