Search
Duplicate

JSON 오브젝트

1. JSON 오브젝트 개요, JS타입을 JSON타입으로 변환

JSON오브젝트 개요

Javascript Object Notation
빌트인 오브젝트
new 연산자로 인스턴스 생성 불가 → parse와 stringify 두개의 함수만있어 굳이 인스턴스를 만들 필요X
JSON 주요 기능
데이터 송수신의 변환 기준
텍스트이므로 전송 속도가 빠름
파일 확장자: json, txt도 사용 가능
JS 데이터 타입 지원
다른 언어도 사용하지만, 완전하게 같지 않을수도 있습니다.
⇒ 어떤 언어의 특정 버전은 지원을 안할수도 있기 때문에 변환 기준에 따라 확인이 필요합니다.

stringify()

JSON.stringify(value[, replacer[, space]])
매개변수
value : JSON문자열로 변환할 값
console.log(JSON.stringify({book:'책', price: 1000}));//{"book":"책","price":1000} console.log(JSON.stringify([123,"책", "Java"]));//[123,"책","Java"] console.log(JSON.stringify([undefined, NaN, null, Infinity]));//[null,null,null,null] console.log(JSON.stringify([true, false]));[true, false]));//[true, false] console.log(JSON.stringify(undefined));//undefined console.log(JSON.stringify([undefined]));//[null] console.log(JSON.stringify({value:undefined}));//{}
JavaScript
복사
replacer(optional): 문자열화 동작 방식을 변경하는 함수 함수일 때 문자열화 될 key와 value 매개변수를 받습니다. 그리고 해당 객체가 replacer의 this 매개변수로 제공됩니다.
var obj = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7}; function replacer(key, value){ if(key === "model")return "openedBox" return value; } var jsonString = JSON.stringify(obj, replacer); //"{"foundation":"Mozilla","model":"openedBox","week":45,"transport":"car","month":7}"
JavaScript
복사
space(optional) : 가독성을 목적으로 JSON문자열 출력에 공백을 삽입하는데 사용되는 String or Number객체
var obj = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7}; function replacer(key, value){ if(key === "model")return "openedBox" return value; } var jsonString = JSON.stringify(obj, replacer, "\n"); /* { "foundation": "Mozilla", "model": "openedBox", "week": 45, "transport": "car", "month": 7 } */
JavaScript
복사

2. JSON타입 파싱

parse()

JSON.parse(text[, reviver])
매개변수
text : JSON으로 변환할 문자열
reviver(optional): 함수라면, 변환 결과를 반환하기 전에 이 인수에 전달해 변형합니다.
JSON타입을 JS타입으로 변환합니다.
작성 주의
"123."을 "123.0"으로 작성
"0123"처럼 첫 자리에 0 사용불가
대문자 "NULL"사용 불가, "null" 사용
10진수 사용
var value ="123"; try{ var result = JSON.parse(value); } catch(e){ console.log("JSON 파싱 에러"); } console.log(result);//123 console.log(typeof result);//number var value = "true" var result = JSON.parse(value); console.log(result);//true console.log(typeof result);//boolean ---(1) var value = '["ABC", "가나", "123"]'; var result = JSON.parse(value); console.log(result);//["ABC", "가나", "12"] ---(2)
JavaScript
복사
⇒(1): "true"라는 문자는 JSON.parse로 boolean 타입으로 변환되고, 실제로 타입도 boolean타입이 됩니다.
⇒(2): 배열안의 타입은 걸맞는 타입으로 바꿔주진 않습니다.
두 번째 파라미터 'reviver' 를 사용한 코드
var obj = '{"foundation": "Mozilla", "model": "box", "week": 45, "transport": "car", "month": 7}'; var reviver = function(key, value){ return key === "transport" ? "ship":value; } var result = JSON.parse(obj, reviver); console.log(result);//{foundation: "Mozilla", model: "box", week: 45, transport: "ship", month: 7}
JavaScript
복사
값을 반환하지 않거나 undefined를 반환하면 프로퍼티가 제외되므로 반환해야 합니다.