REACT_Immutable.js

immutable.js는 자바스크립트에서 불변성 데이터를 다룰 수 있도록 도와줍니다.

immutable은 페이스북에서 json형태의 데이터를 변형하거나 값을 바꿀 때 유용하게 사용하기 위해서 만든 라이브러리이다.

const { Map } =Immutable;
let data = Map({
  a: 1,
  b: 2,
  c: Map({
    d: 3,
    e: 4,
    f: 5
  })
});

let object1 = data.setIn(['c','d'], 10);
console.log(object1.get('c').get('d')); // 10
console.log(data.get('c').get('d')); // 3

Map을 이용하여 데이터를 저장하면 좀더 편하다는데.... 난 잘 모르겠다 ㅋ

const { Map, fromJS } = Immutable;
let data = fromJS({
  a: 1,
  b: 2,
  c: {
    d: 3,
    e: 4,
    f: 5
  }
});

let object1 = data.setIn(['c','d'], 10); 
console.log(object1.getIn(['c','d'])); // 10
console.log(data.get('c').get('d')); // 3

fromJS를 사용하면 좀더 데이터를 정의하는데 편하다

const deserialized = data.toJS();
console.log(deserialized);
//{a: 1, b:2, c: {d:3, e:4}}

toJS를 사용하면 immutable 객체를 일반 객체 형태로 변형할 수 있다.

• 특정 키의 값 불러오기

  data.get('a'); // 1

• 깊숙이 위치하는 값 불러오기

  data.getIn(['c', 'd']); //3

• 값 설정

  const newData = data.set('a', 4);

• 여러값 동시에 설정

  const newData = data.mergeIn(['c'], {d: 10, e: 10});
  const newData = data.setIn(['c', 'd'], 10)
                                          .setIn(['c', 'd'], 11);

List

const { List } = Immutable;
const list = List([0, 1, 2, 3, 4]);

const lit = List()

list 메서드를 사용하는 것이 있다.

https://velopert.com/3354 다음 블로그를 참고하자....

https://devdocs.io/immutable/index#fromjs() 사이트도 좋다.