JS200 Study - stringify

유니·2022년 1월 15일
0

JSON을 문자열로 변환하기

stringify 메소드는 대입한 값을 JSON 문자열로 변환한다.

JSON.stringify(값, 리플레이서, 공백 개수)

stringify의 첫 번째 인자는 JSON문자열로 변환할 대상의 값이다.

두 번째 인자는 리플레이서 라고 하는데 JSON문자열로 변환하기 전에 값을 변경하는 인자이다.
콜백함수를 넣거나, 특정 key 정보를 담은 배열을 넣어 값을 변경한다.

세번째 인자는 공백 개수를 나타낸다. JSON문자열의 들여쓰기 시 공백 개수를 의미한다. 1~10까지 지정할 수 있으며, null이나 0 또는 음수인 경우 공백을 사용하지 않는 것으로 간주한다.

stringify를 이용해 JSON 문자열로 변환시켰기 때문에 typeof로 type을 확인할 경우 string으로 나옵니다.

어떤 값을 넣어도 type이 string으로 변환되나 undefined나 함수를 넣을경우 undefined값을 가지게됩니다. NaN을 넣을경우 null을 string값으로 가지게됩니다.
함수의 경우 return값을 가지고 있어도 undefined로 출력됩니다.

JSON.stringify('a'); // '"a"'
typeof(JSON.stringify('a')); // string
JSON.stringify(1); // '1'
typeof(JSON.stringify(1)); // string
JSON.stringify('true'); // '"true"'
typeof(JSON.stringify('true')); // string
JSON.stringify([1,2,3,4]); // '[1,2,3,4]'
typeof(JSON.stringify([1,2,3,4])); // string
JSON.stringify({x: 10, y : {z : 10}}); //'{"x": 10, "y": {"z" : 10}}'
typeof(JSON.stringify({x: 10, y : {z : 10}})); // string
JSON.stringify(null); // 'null'
typeof(JSON.stringify(null)); // string
JSON.stringify(undefined); // undefined
typeof(JSON.stringify(undefined)); // undefined
JSON.stringify(NaN); // 'null'
typeof(JSON.stringify(NaN)); // string
JSON.stringify(()=>{}); // undefined
JSON.stringify(function() {}); // undefined
typeof(JSON.stringify(function() {})); // 'undefined'


문자열로 변환된 만큼 문자열에 관련된 메소드체이닝도 가능합니다.

그리고 undefined값을 갖는 값들은 당연히 위와같은 메소드체이닝이 불가능합니다.

undefined, function, NaN은 왜 다른지 저도 모르겠습니다.

리플레이서

리플레이서는 JSON문자열로 변환하기전의 값을 변경한다 했는데 아래의 예시를 보면 좀 더 쉽게 이해할 수 있다.

function stringCheck(key, value) {
    if (typeof value === "string") {
        return undefined;
    }
    return value;
}

let obj = { name : "Seongyoon", age : 28, gender : "man", birth : 1026 }

JSON.stringify(obj, stringCheck)
// '{"age": 28, "birth": 1026}'

obj객체를 JSON문자열로 변환하였는데 stringCheck함수를 이용해 변환전의 값을 수정하였다. 그 결과 string값을 가지고있던 name, gender은 undefined가 되었고, number값을 가지고 있던 age와 birth는 JSON문자열로써 출력된것을 확인할 수 있다.

리플레이서는 undefined, 함수, 심볼의 경우 JSON문자열로 변환될때 객체안에있을경우 생략이되고, 배열안에있을경우 null값으로 변환된다.

공백개수

공백 개수는 가독성을 위해 JSON문자열에 공백을 추가해준다.

profile
Prospective Junior Front-end Developer

0개의 댓글