JS-Funktion nimmt ein Objekt als Eingabe und gibt ein Objekt zurück, das Aktionen für das übergebene Objekt ausführt

Question

Ich habe eine Funktion geschrieben, die ein Objekt eingibt, das den Wert auf den Schlüssel setzen oder ein Objekt direkt zuweisen kann. Der Setter und Getter funktionieren gut, aber wenn das Objekt einem anderen Objekt zugewiesen wurde, funktioniert es nicht gut (das Objekt ändert sich überhaupt nicht).

Die seltsame Sache ist, wenn das Objekt "innerhalb" der Funktionen ausgegeben wurde, ist das Ergebnis korrekt. Aber das Ergebnis ist nicht das, was ich "außerhalb" der Funktionen erwartet habe. Könnte das jemand erklären?

function foo(input) { 
    return { 
     set: function(key, value) { 
      input[key] = value; 
      console.log(input); 
     }, 
     get: function(key) { 
      return input[key]; 
     }, 
     assign: function(object) { 
      input = Object.assign({}, object); 
      console.log(input); 
     } 
    }; 
}; 

var obj = {}, 
    bar = foo(obj); 

bar.set('x', 1); // {x: 1} 
console.log(obj); // {x: 1} 
bar.set('y', 2); // {x: 1, y: 2} 
console.log(obj); // {x: 1, y: 2} so far so good 
bar.assign({  // {a: 5, b: 10} 
    a: 5, 
    b: 10 
}); 
console.log(obj); // {x: 1, y: 2} supposed to be {a: 5, b: 10} but it was not 
bar.assign({  // {a: 15} 
    a: 15 
}); 
console.log(obj); // {x: 1, y: 2} didn't change at all 
bar.set('b', 20); // {a: 15, b: 20} 
console.log(obj); // {x: 1, y: 2} 
console.log(bar.get('a')); // 15 

Answer 1

var obj = {} 

Die oben erzeugt ein Objekt (die wir einen Anruf wird) und weist einen Verweis auf sie obj.

bar = foo(obj); 

Jetzt übergeben Sie den Wert von obj, die der Verweis auf A ist, zu foo.

function foo(input) 

... und dann Sie es input zuweisen.

So, jetzt haben Sie zwei Variablen (input und obj), die beide Werte haben, die einen Verweis auf A. sind

input = Object.assign({}, object); 

Sie nun ein neues Objekt (B) erstellen, kopieren alles von object darauf, und dann zu input zuweisen.

So, jetzt haben Sie die beiden Variablen, input zeigt auf B und obj-A zeigen.

console.log(obj); // {x: 1, y: 2} supposed to be {a: 5, b: 10} but it was not 

Das ist, weil Sie bei obj suchen sind aber die Werte, die Sie erwarten, sind auf input (die Sie nicht zugreifen können, weil sie in ihrem Umfang nicht ist).

---

können Sie ändern das vorhandene Objekt stattdessen einen neuen zu erstellen:

assign: function(object) { 
     Object.assign(input, object); 
     console.log(input); 
    } 

... aber das wird die vorhandenen Werte nicht löschen.

Wenn Sie das tun wollen, dann haben Sie so explizit tun:

assign: function(object) { 
     for (var prop in object) { 
      delete object[prop]; 
     } 
     Object.assign(input, object); 
     console.log(input); 
    } 

Answer 2

hier: input = Object.assign({}, object), zuweisen Sie neues Objekt ({}), so dass Sie bearbeiten ursprünglich nicht-Objekt übergeben. Ändern Sie diese Zeile nur auf Object.assign(input, object) sollte tun, was Sie wollen.

Answer 3

Das Problem besteht darin, dass jedes Mal, wenn Sie die Zuweisungsfunktion aufrufen, ein neues Objekt erstellt wird. Um das Eingabeobjekt zu erweitern, verwenden Sie Object.assign (input, object) anstelle von input = Object.assign ({}, object);

function foo(input) { 
    return { 
     set: function(key, value) { 
      input[key] = value; 
      console.log(input); 
     }, 
     get: function(key) { 
      return input[key]; 
     }, 
     assign: function(object) { 
      Object.assign(input, object); 
      console.log(input); 
     } 
    }; 
};