web-dev-qa-db-ja.com

ImmutableJS Map()とfromJS()の違いは何ですか?

var a = {address: {postcode: 5085}}

var b = Immutable.fromJS(a)
var c = b.setIn(['address', 'suburb'], 'broadview').toJS(); // no error
console.log(c); 

var d = Immutable.Map(a);
var e = d.setIn(['address', 'suburb'], 'broadview').toJS(); // error invalid keyPath(…)

誰かが違いを説明できますか。

おかげで、

39
sowdri

この例では、

_var a = {address: {postcode: 5085}}
var d = Immutable.Map(a);
_

ここで、d.get('address')は不変です。値は他のオブジェクトに変更できません。 ImmutableJSのImmutable.Map.set()関数を使用して、既存のオブジェクトからのみ新しいオブジェクトを作成できます。

ただし、d.get('address')で参照されるオブジェクト、つまり_{postcode:5085}_は標準のJavaScriptオブジェクトです。変更可能です。このようなステートメントは、postcodeの値を変更できます。

_d.get('address').postcode=6000;
_

Dの値を再度確認すると、値が変更されていることがわかります。

_console.log(JSON.stringify(d));   //Outputs {"address":{"postcode":6000}}
_

これは不変性の原則に反しています。

理由は、ListMapなどのImmutableJSデータ構造は、List/Mapのレベル1メンバーのみに不変性機能を付与するためです。

したがって、配列内にオブジェクトがあるか、オブジェクト内に配列があり、それらも不変にする場合は、_Immutable.fromJS_を選択します。

_var a = {address: {postcode: 5085}}
var b = Immutable.fromJS(a);
b.get('address').postcode=6000;
console.log(JSON.stringify(b));   //Outputs {"address":{"postcode":5085}}
_

上記の例から、fromJSがネストされたメンバーを不変にする方法を明確に知ることができます。

MapfromJSの違いを理解してください。すべての最高=)

74
Samu Joseph

fromJSは深い変換を行います。つまり、すべてのキーを再帰処理し、すべての要素をリスト、マップなどに変換します。

2番目の例では、addressはImmutableJSオブジェクトではなくプレーンオブジェクトなので、setInを使用して値を変更することはできません。

25
timetofly