3

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();

            }

        }

問題はコールスタック エラーです。これを観察するより良い方法はありますか? もちろん、現在 Chrome で Object.observe を使用できますが、クロスブラウザ ソリューションが必要です。

どんな助けでも大歓迎です！

4

1 に答える 1

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/

于 2013-03-28T21:00:00.820 に答える