反応保持不変性が重要な原因(浅い放射、深い放射)


[不変性]


コメントでは、不変性は理解が必要な話題のようなので、ブログで整理します.
不変性とは、元の値を直接変更せずに新しい値を生成することを意味します.
簡単に言えば、本来の意味を傷つけないということです.
const user = {name:"alsqjarl",age:28}
const copyUser = user; //이것은 배열의 값을 복사하는 것이 아니라 참조 되는 위치가 같아짐
user.age +=1;
/* user = { name: 'alsqjarlwkd', age: 28 } 
copyUser = { name: 'alsqjarlwkd', age: 28 } */
user === copyUser  // true
上記のコードは、userとcopyuserが同じメモリアドレス値を持っていることを示しています.
したがって、ユーザーが所有するオブジェクトの値が変更されると、copy userも同じアドレスを持つため、これらの値の変更は同じであることに気づきます.
だから反応の中で...名前のsperad演算子を使用してコピーします.
...貼り付けると、新しいオブジェクトが割り当てられ、メモリに割り当てられたアドレスも異なります.
const user = { name: 'alsqjarlwkd', age: 28 } 
const otherUser = { ...user }; 
user.name = 'Lee';
/* user = { name: 'Lee', age: 28 } 
otherUser = { name: 'alsqjarlwkd', age: 28 } */ 
user === otherUser // false 서로 다른 참조 값을 가지고 있음
したがって、user値の変更は他のユーザのオブジェクトにはまったく影響しません(不変性を維持することに成功しました).
簡単に言えば、日常生活で2枚の印刷物を引いて、別の印刷物に落書きをしても、他の印刷物に影響を与えないに等しい.
ただし、オブジェクトの奥行きが深くなると、問題が発生します.spread演算子は浅いコピーなので、深いオブジェクトを異なるものにするには、深いコピーが必要です.
const user = { name: 'alsqjarlwkd', age: 28, friends: ['Park', 'Kim']}
const otherUser = { ...user }; 
user.name = 'Lee';
user.friends.push('Kang');
/* user = { name: 'Lee', age: 25, friends: ['Park', 'Kim', 'Kang'] }
otherUser = { name: 'alsqjarlwkd', age: 25, friends: ['Park', 'Kim', 'Kang'] }
*/ 
user === otherUser // false 
user.friends === otherUser.friends // true
上記のコードに示すように、浅いレプリケーションは、1つのオブジェクトの深さからのみレプリケーションされることを保証します.ますます深くなると、不変性を保つには大きな問題が発生します.内側の深さにコピーする場合は、拡散演算子を深さパケットに再配置する必要があります.
const user = { name: 'alsqjarlwkd', age: 28, friends: ['Park', 'Kim']}
const otherUser = { ...user, friends: [...user.friends] }; 
user.name = 'Lee'; 
user.friends.push('Kang');

/* user = { name: 'Lee', age: 28, friends: ['Park', 'Kim', 'Kang'] } 
copyUser = { name: 'alsqjarlwkd', age: 28, friends: ['Park', 'Kim'] } 
*/ 
user === otherUser // false 
user.friends === otherUser.friends // false
このような浅いレプリケーションを使用すると、メモリリファレンスアドレスの値が異なりますが、オブジェクトの構造が複雑であればあるほど、不変性を維持することは難しくなります.
したがって、immerのようなライブラリを使用して不変性を維持することもできます.

反応の中で不変性を保つことがなぜ重要なのか。


開発者として、メンテナンス可能で可読性の良いコードを作成する必要があります.
不変性を保たないと、使用するデータがどこで変化し、流行に追いつくことが難しくなり、予想外の副作用やバグを引き起こす可能性があります.
不変性を守り、明確に書かれたコードは他の開発者がコードを見たとき、データが私の知らないところで変化した可能性があります.これは、不要な疑いがない場合に、プロセスに従ってコードを読み、理解するのに役立ちます.
したがって、変わらずデータを変更すると、予想可能で信頼できるコードになる可能性があります.
最初から不変性を保つのは、反応器が創造した新しい概念ではなく、反応器にstateやpropsを利用できるという考えが溶け込んでいる.
stateまたはpropsとして可変値を使用すると、一連のイベントで新しく作成されたオブジェクトが変数に割り当てられていることがわかります.これらの新しい値の参照により、既存の値の値がどのように変化するかを追跡することが容易になります.
単純な不変性概念に比べて,なぜ不変性を維持してコードを記述するのかに焦点を当てると,より良いコードを記述することができる.