Alraffe
이것 저것 개발.
Alraffe
전체 방문자
오늘
어제
  • 분류 전체보기
    • TIL
    • Front-end
      • CSS
      • React
      • Next.js
    • Back-end
    • Book
      • Effective Typescript

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • 프론트엔드 책 추천
  • 이펙티브타입스크립트
  • next14
  • 배포 에러
  • 개발자 커피챗
  • TypeScript
  • git
  • frontend
  • JASON.stringify
  • 타입스크립트 추천
  • 노션 이력서
  • 오랠리
  • 프론트엔드
  • vite 배포 에러
  • JS
  • 리액트
  • 프론트엔드회고
  • object 값을 찍고 싶을 떄
  • JavaScript
  • 주니어 개발자 이력서
  • 타입스크립트 책 추천
  • vite 깃헙 배포
  • 깃헙 배포 빈 화면
  • evnentBubbling
  • 타입스크립트 책
  • 타입스크립트
  • Til
  • react
  • JASON.parse()
  • 자바스크립트

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
Alraffe

이것 저것 개발.

TIL

console.log()로 [object]를 찍고 싶을 때

2023. 7. 25. 18:48

 

It's easy~ peasy~lemon-squeeezy~

 

 

// 기존에 data라는 오브젝트가 있다고 가정.


console.log(JSON.stiringify(data));
// or
alert(JSON.stringify(data));

 

JSON.stringify() 와 JSON.parse()

 

JSON.stringify(value[, replacer, space])
: value를 JSON형태의 값으로 변환시켜주는 함수

 

 JSON.stringify사용방법을 뜯어보면 value는 필수값으로 JSON형태로 변환할 값을 입력한다. replacer와 space는 옵션값이며, replacer는 배열일 수도 함수일 수도 있다. 배열이 매개변수로 넘겨질 경우 배열에 있는 값만 결과 값에 포함된다. 한편 함수로 넘겨질 경우 함수에서 리턴되는 값으로 결과값이 출력된다.

 space자리에는 string 또는 number값을 입력할 수 있는데 이를 입력하면 string으로 이뤄진 개행마크로 이용되고 입력된 숫자만큼 값이 개행될 때 들여쓰기 수준이 된다.

 

 

function replacer(key, value) {
  if (typeof value === "string") {
    return undefined;
  }
  return value;
}
const foo = {
  model: "box",
  week: 12,
  transport: "foot",
  month: 5,
};

// replacer 함수 예시 
JSON.stringify(foo, replacer);
//result :  '{"week":12,"month":5}'

// replacer 배열 예시
JSON.stringify(foo, ["week", "month"]);
// '{"week":12,"month":5}'</code></pre>

 

 

 

JSON.parse(text[, reviver])

: JSON형태의 값을 string으로 표현된 자바스크립트 값이나 객체로 환시켜주는 함수.

 

 reviver는 JSON.stringify()의 replacer와 비슷하다. 값이 리턴되기 전 reviver로 가공한 값을 반환할 수 있다. reviver는 text값이 파싱되고 실행된다.

 

JSON.parse(
  '{"p": 5}',
  (key, value) =>
    typeof value === "number"
      ? value * 2
      : value,
);
// { p: 10 }

 

 

참고
  • MDN
저작자표시 비영리 변경금지

'TIL' 카테고리의 다른 글

git의 원리  (0) 2023.08.17
공부한 git 사용법에 대한 정리  (0) 2023.08.17
github Page로 정적페이지 여러 레포지토리 배포하기  (0) 2023.02.02
프로젝트에 필요한 무료 favicon과 로고를 만들 수 있는 사이트  (0) 2023.01.09
    'TIL' 카테고리의 다른 글
    • git의 원리
    • 공부한 git 사용법에 대한 정리
    • github Page로 정적페이지 여러 레포지토리 배포하기
    • 프로젝트에 필요한 무료 favicon과 로고를 만들 수 있는 사이트
    Alraffe
    Alraffe

    티스토리툴바