Referenz Speicherung in Objekt/Variable

Question

ich für diese um gesucht zu funktionieren, aber so haben bisher nicht gelungen, ein Duplikat zu finden, die ich die falschen Schlüsselwörter werden kann ...

ich vorübergehend bin versucht zu ändern Funktion, die in einem Objekt gespeichert ist, aber Probleme haben, es auf das zurückzusetzen, was es vorher war.

Bedenken Sie:

// Set the options object 
var options = { 
    success: function(){ 
     console.log('Original Function Called'); 
    } 
} 

// Save the options 
$('#foo').data('bar',options); 

Und dann in einer anderen Funktion:

// Get the options 
var options = $('#foo').data('bar'); 

// Store the old options 
var old_options = options; 

// Temporarily change the success function 
options.success = function(){ 
    console.log('Temporary Function Called'); 
} 

// Save the options 
// This allows the other functions to access the temporary function 
$('#foo').data('bar',options); 

// Do stuff here that uses the new options 

// Reset the options to include the original success function 
$('#foo').data('bar',old_options); 

Ich würde die Temporary Function Called nur Anzeige einmal hat jedoch zu erwarten, scheint es völlig den alten success Rückruf zu ersetzen der temporäre Rückruf.

Kann mir jemand sagen, warum und wie ich das umgehen kann?

UPDATE

Ich dachte, dass extend dieses Problem beheben würde, aber es scheint, dass das Problem ein wenig tiefer sein kann. Ich habe beschlossen, dieses Mal einen Ausschnitt meines eigentlichen Codes zu posten. Bitte beachten Sie die folgenden vor dem Lesen:

1. SM ziemlich viel ist nur ein Alias ​​von jQuery, bitte ignorieren.
2. success und error sind Parameter an die Funktion geliefert

Hier ist mein Code:

// Get the properties 
var properties = $(form).data('autosave'); 
switch(parameter){ 
    case 'save': 
     var old_properties = $.extend({},properties); 
     // Set the new callbacks if they have been supplied 
     properties.options.success = typeof success!=='undefined' ? success : old_properties.options.success; 
     properties.options.error = typeof error!=='undefined' ? error : old_properties.options.error; 
     // Save the properties 
     $(form).data('autosave',properties); 
     // Call the save method before setting the interval 
     SM(form)._as_save(); 
      properties = $.extend({},old_properties); 
     // Save the old properties 
     $(form).data('autosave',properties); 
     // Clear the current interval 
     clearInterval(properties.interval); 
     // Call the save method periodically 
     properties.interval = setInterval(function(){ 
     SM(form)._as_save(); 
     },properties.options.interval); 
    break; 
} 
// Save the properties 
$(form).data('autosave',properties); 

Answer 1

Wenn Sie diesen Code ausführen:

var old_options = options; 

Sie kein Kopie machen des gesamten Objekts options, das Sie später wiederherstellen können. Sie speichern lediglich eine Referenz an die gleiche Objekt. Mit anderen Worten, ist old_options das gleiche Objekt wie options, so dass, wenn Sie einen neuen Wert in options.success zuweisen, sind Sie es in beide optionsundold_options — ändern, weil sie das gleiche Objekt sind.

Um dies zu beheben, können Sie eine Objektklonfunktion verwenden, um eine Kopie des Objekts zu erstellen, die Sie später wiederherstellen können.

var old_options = $.extend(true, {}, options); 

Wenn Sie jetzt options.success ändern, sind Sie nur in der options Objekt zu ändern: Da Sie jQuery verwenden, können Sie die Zeile oben ändern. old_options ist nicht betroffen, so dass Ihr späterer Aufruf wird es erfolgreich wiederherstellen:

$('#foo').data('bar',old_options); 

Interessanterweise kann dies noch OK auch funktionieren, wenn options.success ein asynchronen Rückruf ist (die aus dem Namen wahrscheinlich klingt).Das ist, weil, was auch immer Code diese .success() Methode später aufrufen, sollten sie immer noch auf eine Referenz auf Ihre modifizierten options Objekt — halten, auch wenn Sie die alte wieder in die Daten des Elements in der Zwischenzeit wiederhergestellt haben. Zumindest konnte man darauf hoffen; Wenn der andere Code in den $().data() zurückfindet, um den Rückruf .success zu finden, dann würden Sie in Schwierigkeiten geraten.

Der obige Aufruf $.extend() führt eine "tiefe" (rekursive) Kopie des Objekts options. Das heißt, wenn eine der Eigenschaften innerhalb von options selbst ein Objekt ist, klont sie auch dieses Objekt, anstatt nur einen Verweis darauf zu kopieren.

Wenn Sie das true Argument auslassen, tut $.extend() eine flache Kopie statt:

var old_options = $.extend({}, options); 

Dies noch ein neues Objekt und Kopien über alle Eigenschaften aus einem bestehenden Objekt erstellt, aber wenn eine dieser Eigenschaften ist selbst ein Objekt, es klont das Objekt nicht, es kopiert nur eine Referenz. Dies ist effizienter, wenn es mit der Struktur des von Ihnen verwendeten Objekts zusammenarbeitet, andernfalls können Sie die Tiefenkopie verwenden.

Wenn die Eigenschaften/Methoden, die Sie zum Speichern und Wiederherstellen benötigen, direkt untergeordnete Objekte des Hauptobjekts sind, sollte eine flache Kopie ausreichen. Hier ist ein Fall, in dem Sie auf jeden Fall eine tiefe Kopie bräuchten:

{ 
    url: 'test', 
    events: { 
     success: function(data) { 
      // ... 
     } 
    } 
} 

Hier haben wir ein Objekt mit einer events Eigenschaft, und diese Eigenschaft ist selbst ein Objekt mit einigen Eigenschaften/Methoden ihres eigenen (in diesem Beispiel einer . events.success() Methode wenn Sie eine flache Kopie dieses Objekts zu tun, das Original und die Kopie wird Aktien ein gemeinsames events Objekt Also, wenn Sie so etwas wie dies tat.

options.events.success = function(...) {...}; 

Sie tatsächlich zu aktualisieren würde, dass in sowohl options als auch old_options. Nein g ood. Das ist, wo eine tiefe Kopie benötigt wird.

Answer 2

Ihr Problem ist, dass Sie mit Objekten arbeiten. Sie übergeben Referenzen auf das Objekt. Das zugrunde liegende Objekt ist das gleiche. Sie haben lediglich eine Variable hinzugefügt, die auf die gleiche Adresse zeigt.

Sie müssen das Objekt klonen. ZB erstellen Sie ein neues Objekt mit den gleichen Eigenschaften und kopieren Sie es.

Diese post kann Ihnen nützlich sein.

Answer 3

Das Problem ist, dass options Referenzsemantik hat:

// Store the old options 
var old_options = options; 

Dieser Kommentar liegt. Sie haben keine Kopie der alten Optionen; Stattdessen haben Sie einen weiteren Verweis auf das gleiche Optionsobjekt (ein anderer Name, mit dem Sie darauf verweisen können). Wenn Sie also options.success überschreiben, ist diese Änderung auch unter old_options sichtbar. Der Code, der .data verwendet, um den Wert der Optionen zu speichern und zurückzusetzen, ist redundant.

Das einzige, was Sie tun müssen, ist dies:

var old_success = options.success; 
options.success = function() { /* whatever */ }; 

// code that uses the new success callback 

options.success = old_success; // restore original value 

Answer 4

Wenn Sie diese var old_options = options tun bist du nicht options Werte, sondern eine Referenz, um es zu kopieren. Von jetzt an zeigen old_options und options auf den gleichen Speicherpunkt und Änderungen an jedem von ihnen betreffen beide.