프론트엔드-코드/Javascript

객체 <-> json 변환

sdafdq 2023. 8. 31. 15:59
const student = {
  name : 'Park',
  age : 30,
  address : 'Daejeon',

  printStudent : function(){
    console.log(this.name, this.age, this.address);
  }
};
const dataJson = JSON.stringify(student, null, 2);
console.log(dataJson);

 

JSON.stringify(객체)

이렇게 하면 됨. json형태의 문자열로 변화시켜주는 거임.

이게 좋은 점이 메소드는 다 삭제되서 나옴.

 

 

 

 

 

JSON.stringify(객체, null, 2) 

이렇게 하면 그러니까.. 마지막 인자 2는 들여쓰기 간격이다.

1만 써도 자동 줄바꿈 해 준다.

 

 

JSON.stringify(객체, ['name', 'age'], 2) 

두번째 인자는 replacer 라고 해서, 일종의.. 필터링 같은 역할이다.

 

저렇게 해 두면 name과 age만 가진 json 형태의 문자열로 나온다.

 

 

function replacer(key, value){
  if(key === '나이'){
    if(value < 20){
      return undefined;
    }
  }
 
    return value;
}

아니면 replacer에 이렇게 함수로 정의 할 수 있다.

console.log(JSON.stringify(students, replacer, 2));

이러면 20살 이하는 아예 키,벨류 자체가 안나온다. 

 

근데 이 replace 로직을 짤 때는,

왠만하면 제외할 것 위주로 짜주는 게 좋다.

왜냐하면 그렇게 하지 않으면 value < 20 이거 했을 때 

만약 왜 이름처럼 값이 문자열인 경우가 있는데, 

그럴 경우 false로 뜨기 때문에(아마) 타입 등 신경써야할 게 좀 있다.

 

 

 

그 다음 json 문자열을 객체로 바꿔주는 것은

JSON.parse(문자열)임

 

배열 형태의 json 문자열을 받아올 경우 마찬가지로 객체배열로 만들어 줌.

'프론트엔드-코드 > Javascript' 카테고리의 다른 글

async/await  (0) 2023.09.01
fetch로 서버로부터 데이터를 받아와 동적으로 html 추가  (0) 2023.08.31
객체  (0) 2023.08.31
이벤트 루프  (0) 2023.08.31
속성값 가져오기  (0) 2023.08.31