Reagieren: Warum ist es notwendig, unveränderliche Requisiten zu haben, wenn Werte trotzdem als Wert übergeben werden?

Question

Ich nicht zu tief in JavaScript. Deshalb habe ich folgendes basteln gemacht:

var demo = 'test'; 

var obj = { 
    x: 'abc' 
} 

function foo(str) { 
    str += '_123'; 

    return str; 
} 

var ret = foo(demo); 
var retObj = foo(obj.x); 

console.log('Result: %s', ret); // => 'test_123' 
console.log('Used parameter: %s', demo); // 'test' 

console.log('Result: %s', retObj); // 'abc_123' 
// The value of the property is still unchanged. So 
// it has been passed in as by value. As as copy. 
console.log('Used parameter: %s', obj.x); // 'abc' 

Ich gebe einen String an die Funktion weiter. Einmal als primitive Variable und das nächste Mal als Objekteigenschaft.

Danach sind die ursprünglichen Daten unverändert. => Das äußere System ist unverändert.

Jetzt frage ich mich:

Warum sie diese Unveränderlichkeit Funktion in Reaktion haben Sie?

Ich meine: Sie sagen, eine Funktion soll etwas tun und als Ergebnis liefern. Aber nicht das System als Ganzes zu ändern.

Aber wenn Daten als wertmäßig trotzdem übergeben werden? Warum macht das so eine große Sache aus Unveränderlichkeit?

Answer 1

In beiden Beispielen übergeben Sie eine Zeichenfolge an die Funktion. obj ist ein Objekt, aber obj.x ist eine Zeichenfolge.

JavaScript behandelt Strings und Zahlen (Primitive) als unveränderlich. Also, wenn Sie tun:

var a = "bob"; 
var b = a; 
b = "jack"; 

Die ursprüngliche Zeichenfolge a unverändert sein wird.

Aber Objekte sind anders. Wenn Sie das tun:

var propsObj = { name: "bob" }; 
var newPropsObj = propsObj; 
newPropsObj.name = "jack"; 

Dann propsObj wird sich auch ändern, so ist propsObj jetzt { name: "jack" }.

React verwendet Zeug, das Sie als Requisiten übergeben, und stellt das virtuelle DOM her. Da react diese verwendet, um zu sehen, ob sich etwas geändert hat, und nur Dinge rendern, die sich geändert haben, verlässt sich reactive auf Ihren Code, um Requisiten oder Zustände nicht zu ändern, nachdem Sie sie übergeben haben, um zu reagieren.

Im zweiten Beispiel wird dies dazu führen, dass reactive denkt, dass neue und alte Requisiten immer noch gleich sind, so dass reaccept (fälschlicherweise) zu dem Schluss kommt, dass es nicht erneut gerendert werden muss.