parse, stringify, 그리고 깊은 복사

frenchkebab·2021년 9월 23일
0

javascript 지식

목록 보기
26/36

parse, stringify, 그리고 깊은 복사


parse

문자열 -> 객체 로 만드는 메서드


stringify

객체 -> 문자열 로 만드는 메서드


parse와 stringify를 사용한 깊은 복사

const monsterList = [
  { name: '슬라임', hp: 25, att: 10, xp: 10 },
  { name: '스켈레톤', hp: 50, att: 15, xp: 20 },
  { name: '마왕', hp: 150, att: 35, xp: 50 }
];


const monster1 = JSON.parse(JSON.stringify(monsterList[0])); // 깊은 복사
const monster2 = monsterList[0]; // 참조
const monster3 = { ...monsterList[0] }; // 얕은 복사

monster1.name = '새 몬스터';
console.log(monsterList[0].name); // 슬라임

monster2.name = '새 몬스터';
console.log(monsterList[0].name); // 새 몬스터


console.log(monsterList[0] === monster1); // false, 깊은 복사
console.log(monsterList[0] === monster2); // true, 참조 관계

두 과정을 떼서 분해해 보면,

JSON.stringify(monsterList[0]);
// '{"name":"슬라임","hp":25,"att":10,"xp":10}'

JSON.parse(JSON.stringify(monsterList[0]));
// {name: '슬라임', hp: 25, att: 10, xp: 10}

profile
Blockchain Dev Journey

0개의 댓글