javascript - español - immutable react js

¿Cuál es la diferencia entre ImmutableJS Map() y fromJS()?

Question

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(…)

Podría alguien explicar la diferencia.

Gracias,

Answer 1

En este ejemplo,

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

Aquí, d.get(''address'') es inmutable . Su valor no puede cambiar a ningún otro objeto. Solo podemos crear un nuevo objeto a partir del objeto existente utilizando la función Immutable.Map.set() de ImmutableJS.

Pero el objeto al que hace referencia d.get(''address'') , es decir, {postcode:5085} es un objeto JavaScript estándar. Es mutable Una declaración como esta puede alterar el valor del postcode :

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

Si vuelve a verificar el valor de d, puede ver que el valor ha cambiado.

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

que está en contra de los principios de inmutabilidad.

La razón es que las estructuras de datos de ImmutableJS como List and Map imparten la característica de inmutabilidad solo a los miembros de nivel 1 de List / Map .

Por lo tanto, si tiene objetos dentro de matrices o matrices dentro de objetos y los quiere también como inmutables, su elección es 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}}

A partir del ejemplo anterior, puede saber claramente cómo, desde fromJS los miembros anidados son inmutables.

Espero que hayas entendido la diferencia entre Map y fromJS . Todo lo mejor =)

Answer 2

fromJS hace una conversión profunda. Es decir, recurrirá a través de todas las claves y convertirá todos los elementos en Listas, Mapas, etc.

En su segundo ejemplo, la address es un objeto simple, no un objeto ImmutableJS, por lo que no puede usar setIn para cambiar su valor.