web-dev-qa-db-fra.com

Quelle est la différence entre ImmutableJS Map () et 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(…)

Quelqu'un pourrait-il expliquer la différence.

Merci,

javascriptimmutable.js
39
sowdri

Dans cet exemple,

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

Ici, d.get('address') est immuable. Sa valeur ne peut pas changer pour d'autres objets. Nous ne pouvons créer un nouvel objet qu'à partir de l'objet existant en utilisant la fonction Immutable.Map.set() d'ImmutableJS.

Mais, l'objet référencé par d.get('address') c'est-à-dire, {postcode:5085} Est un objet JavaScript standard. Il est modifiable. Une instruction comme celle-ci peut modifier la valeur de postcode:

d.get('address').postcode=6000;

Si vous vérifiez à nouveau la valeur de d, vous pouvez voir que sa valeur a été modifiée.

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

ce qui est contraire aux principes d'immuabilité.

La raison en est que les structures de données ImmutableJS comme List et Map ne confèrent la fonction d'immuabilité qu'aux membres de niveau 1 des List/Map.

Donc, si vous avez des objets à l'intérieur des tableaux ou des tableaux à l'intérieur des objets et que vous voulez qu'ils soient également immuables, votre choix est 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}}

Dans l'exemple ci-dessus, vous pouvez clairement savoir comment fromJS rend les membres imbriqués immuables.

J'espère que vous avez compris la différence entre Map et fromJS. Meilleurs vœux =)

74
Samu Joseph

fromJS effectue une conversion en profondeur. C'est-à-dire, il recurrera toutes les clés et convertira tous les éléments en listes, cartes, etc.

Dans votre deuxième exemple, address est un objet simple, pas un objet ImmutableJS, vous ne pouvez donc pas utiliser setIn pour modifier sa valeur.

25
timetofly