Question

我正在尝试在javascript中创建一个对象观察者。

这是我得到的：

//object to observe an object
        observe : {
            parent : this, //keep context of parent
            references : {}, //keep track of setted references
            originals : {}, // also for the originals
            callStack : 0, // trying to prevent the callstack

            // set an object to observe..
            setObject : function ( name, object ){
                this.references[name] = object;
                //app.utils.extendObject is a working object extending function.
                this.originals[name] = app.utils.extendObject( new Object , object );
                //start watching the object
                this.watchObject( name );
            },

            watchObject : function ( referenceName ){
                this.callStack++;
                //walk through reference
                for( prop in this.references[referenceName] ){
                    // if the reference differs from the original...
                    if( this.references[referenceName][prop] !== this.originals[referenceName][prop]  ){
                        //... log the differance
                        console.log( referenceName + " with property " + prop + " has changed." );
                    }
                }
                // set variable with call to this function
                var func = eval( "app.utils.observe.watchObject(" + referenceName + ")" );

                //read somewhere this could do the trick
                if( callStack == 1000 ){
                    setTimeout( func , 100 );
                }
                func();

            }

        }

问题是callstack错误，是否有更好的方法来观察它？当然，我现在可以在Chrome中使用Object.observe，但我想要一个crossbrowser解决方案。

感谢任何帮助！

Answer 1

我稍微修改了您的代码，将callback函数添加到watchObject方法。如果您想要监听更改并执行某些操作，这将非常有用。

watchObject: function (referenceName, callback) {
    for (prop in this.references[referenceName]) {
        if (this.references[referenceName][prop] !== this.originals[referenceName][prop]) {
            console.log(referenceName + " with property " + prop + " has changed.");
            callback && callback.call(this.references[referenceName], this.originals[referenceName][prop], this.references[referenceName][prop]);
            this.originals[referenceName][prop] = this.references[referenceName][prop];
        }
    }
}

另外，我将setInterval放在setObject：

中

var self = this;
setInterval(function() {
    self.watchObject(name, callback);
}, 300);

http://jsfiddle.net/59Fnt/1/

试图观察javascript对象

1 个答案: