과제를 풀기전 JSON에 대하여 간단히 알아보자.
JSON은 JavaScript Object Notation의 줄임말로,
데이터 교환을 위해 만들어진 객체 형태의 포맷이다.
네트워크를 통해 어떤 객체내용을 다른 프로그램에 전송한다고 가정했을때,
이 객체 내용을 일종의 메신저 혹은 채팅 프로그램에서 쓰는 하나의 메세지라고 한다면, 아래의 객체를 어떻게 전송할까??
const obj = {
sender: 'hyo',
receiver: 'woo',
message: '안녕'
}
메세지 객체가 전송 가능하려면, 메세지를 보내는 발신자와 메시지를 받는 수신자가 같은 프로그램을 사용하거나, 문자열처럼 범용적으로 읽을수 있는 형태여야 한다.
->
위 문제를 해결하는 방법은 객체를 JSON의 형태로 변환하거나 JSON을 객체의 형태로 변환하는 방법이다.
->
JSON.stringyfy() : 객체를 JSON으로 변환
JSON.parse() : JSON을 객체로 변환
stringyfyJSON() 함수에 인자가 들어가면 문자열로 바꿔주는 로직을 만들어본다.
JSON.stringyfy()메서드를 쓰면 바로 해결되지만 이 함수를 만들어본다.
// 숫자, 불린, 문자가 들어가면 ""로 감싸주고 리턴
// null은 "null"로 리턴
// 인자가 배열일 경우 배열안의 요소도 문자열로, 배열자체도 문자열로 ""씌워주고 리턴
// 인자가 객체일 경우 키와값 둘다 제각각 "" 씌워주고 객체 전체에 ""로 씌워 문자열로 리턴
// 키가 'functions'또는 undefined 이거나 값이 undefined이면 그냥 빈객체 리턴 -> {}
function stringyfyJSON() {
if(typeof obj === 'number' || typeof obj === 'boolean'){
return obj.toString();
}
if(obj === null){
return "null"; // null은 typeof로 판별 불가라서 따로 뽑아서 써줬다.
}
if(typeof obj === 'string'){
return `"${obj}"`; // 문자열에 ""를 씌워줘야하므로 따로 빼서 리턴
}
if(Array.isArray(obj)){ // obj가 배열일 경우
let arr = [];
for(let el of obj){ // obj = ["hi"]
arr.push(stringifyJSON(el)); // arr.push(stringifyJSON("hi")) -> '"hi"' -> arr = ['"hi"']
}
return `[${arr}]`; // `${arr}` 을 해줄 경우 배열이 벗겨지고 출력된다. 그러므로 [] 한번더 감싸주고 리턴!
}
if(typeof obj === 'object'){
let result = ''; // 빈객체를 선언하고 빈객체에 줄줄이 넣어주는 식으로 해보았지만 마지막에 어쨋든 객체에 따옴표를 입혀주는 식이라 [object Object]가 출력돼서 아예 빈문자열에 넣어주는 식으로 로직을 썻다.
for(let key in obj){
if(key === 'functions' || key === undefined){
return '{}'
}
result = result + `${stringifyJSON(key)}:${stringifyJSON(obj[key])}` + ',';
}
return `{${result.slice(0, result.length - 1)}}`;
}
}