search

melanke / Watch.JS

watch the changes of any object or attribute
Other
2.14k stars 219 forks source link

clerical error on user-content-do-you-want-to-know-when-new-attributes-change-too ? #87

Closed wywzxxz closed 9 years ago

wywzxxz commented 9 years ago

When I tried this demo(https://github.com/melanke/Watch.JS#user-content-do-you-want-to-know-when-new-attributes-change-too) , it didn't work both in chrome or nodejs. however this is working( proposed in issue#71) watch(ex, function (){...}, 1, true); i.e:

        <html>
            <head>
                <script src="watch.js" type="text/javascript"></script>
        <!-- watch will be global variable -->
            </head>
            </body>
                <script>
                    //defining our object no matter which way we want
        var ex = {
            l1a: "bla bla",
            l1b: {
                l2a: "lo lo",
                l2b: "hey hey"        
            }
        };

        watch(ex, function (prop, action, difference, oldvalue){

            alert("prop: "+prop+"\n action: "+action+"\n difference: "+JSON.stringify(difference)+"\n old: "+JSON.stringify(oldvalue)+"\n ... and the context: "+JSON.stringify(this));    

        }, 10, true);

        ex.l1b.l2c = "new attr"; //it is not instantaneous, you may wait 50 miliseconds

        setTimeout(function(){
            ex.l1b.l2c = "other value";
        }, 100);
                </script>
            </body>
        </html>

so I wonder it's a clerical error or I still get some thing wrong?

wywzxxz commented 9 years ago

....but failed in nodejs( v0.12) ，any idea?

        var WatchJS = require("watchjs")
        var watch = WatchJS.watch;
        var unwatch = WatchJS.unwatch;
        var callWatchers = WatchJS.callWatchers;
        //defining our object no matter which way we want
        var ex = {
            l1a: "bla bla",
            l1b: {
                l2a: "lo lo",
                l2b: "hey hey"        
            }
        };

        watch(ex, function (prop, action, difference, oldvalue){

            console.log("prop: "+prop+"\n action: "+action+"\n difference: "+JSON.stringify(difference)+"\n old: "+JSON.stringify(oldvalue)+"\n ... and the context: "+JSON.stringify(this));    

        }, 100, true);
        ex.l1a="asdasdasdasdads";//Good
        ex.l1b.l2a = "new attr"; //Good
        ex.l1b.l2c = "new attr"; 

        setTimeout(function(){
            ex.l1a="a";//Good
            ex.l1c="asd";//fail
            ex.l1b.l2c = "other value";//fail
            console.log("change");
            setTimeout(function(){
                ex.l1a="a`12`12";//Good
                ex.l1c="asd";//fail
                ex.l1b.l2c = "other value";//fail
                console.log("change");
            }, 1000);   
        }, 1000);
wywzxxz commented 9 years ago

update: For Nodejs , the module installed by npm couldn't work in this case, but the js file download directly worked.