코드스테이츠 6주차 / StringifyJSON

JSON.stringify()

JSON.stringify는 객체를 JSON으로 변환하는 메소드 이다
이 메소드를 재귀를 이용해서 함수의 형태로 직접 구현하는 스프린트였다

JSON의 작동 방법

  • undefined와 function은 JSON으로 생략되거나 null로 변환

  • Boolean이 input으로 주어졌을 경우
    stringifyJSON(true); // 'true'

  • String이 input으로 주어졌을 경우
    stringifyJSON('foo'); // '"foo"'

  • Array가 input으로 주어졌을 경우
    stringifyJSON([1, 'false', false]); // '[1,"false",false]'

  • Object가 input으로 주어졌을 경우
    stringifyJSON({ x: 5 }); // '{"x":5}'

  • undefined, function이 주어졌을 경우
    stringifyJSON(undefined) // undefined
    stringifyJSON(function(){}) // undefined
    stringifyJSON({ x: undefined, y: function(){} }) // '{}'

위의 값이 obj로 다른 값들이 들어왔을 때 나와야 하는 리턴값을 설정해 주면 된다

처음 이 스프린트를 보면 어떻게 하라는건지 막막할 수 있다
이때는 테스트 케이스를 보면 조금 도움이 된다

  obj => return9, => "9"
  null, => "null"
  true, => "true" 
  "Hello world", => ""Hello world""
  [], => "[]"
  [8, "hi"], => "[8, "hi"]"
  [8, [[], 3, 4]], "[8, [[], 3, 4]]"
  {}, => "{}"
  { a: "apple" }, => "{"a":"apple"}"
  { foo: true, bar: false, baz: null }, => "{"foo":true,"bar":false,"baz":null}"
  // basic nesting
  { a: { b: "c" } }, => "{"a":{"b":"c"}}"
  { a: ["b", "c"] }, => "{"a":["b","c"]}"
  [{ a: "b" }, { c: "d" }], => "[{"a":"b"},{"c":"d"}]"
  { a: [], c: {}, b: true }, => "{"a":[],"c":{},"b":true}"

테스트 케이스로 들어오는 목록 중 일부다

3가지로 나눠볼 수 있다

  1. 객체나 배열이 아닌 경우
    1) number, null, boolean 문자열로 리턴
    2) string 일때는 앞뒤로 "" 추가로 넣어줘야 한다

  2. 배열인 경우
    Array.isArray로 배열인지 확인한 뒤 stringifyJSON(재귀함수)을 사용해서 새배열에 넣어준뒤 리턴해주면 된다

  3. 객체인 경우
    객체의 키에 undefined or 값에 함수, undefined 가 들어왔을 경우 {}리턴
    나머지 경우에 속성 : 값 형태의 문자열로 저장한 뒤 리턴

function stringifyJSON(obj) {
  if(typeof obj === 'number' || obj === null || typeof obj === 'boolean' ){
    return `${obj}`;
  }
  // typeof obj === null 으로 작성하면 object 이다 
  if(typeof obj === 'string'){
    return `"${obj}"`;
  }
  if(Array.isArray(obj)){
    let newArr = []
    for(let el of obj){
      let arrEl = stringifyJSON(el)
      newArr.push(arrEl)
    }
    return `[${newArr}]`
  }
  // newArr은 배열이기 때문에 ``를 사용해 문자열로 변환시켜 준 뒤 배열을 감싸준다 
  // 그냥 리턴하게 되면 배열이 벗겨진 상태로 리턴된다 
  
  // typeof obj 에는 객체와 배열 둘 다 포함되지만
  // 배열인 경우를 위에 적어줬기 때문에 배열을 제외시킬 수 있다 
  if(typeof obj === 'object'){
    let newObj = '';
    for(let key in obj){
      let objKey = stringifyJSON(key)
      let objVal = stringifyJSON(obj[key])
      if(objKey === undefined ||typeof objVal =='function' || objVal === undefined){
        newObj = ''
        // 함수와 undefined는 stringify되지 않는다 
      }else{
        newObj += `${objKey}:${objVal},`
        // 속성 : 값 형태의 문자열로 저장
      }
    }
    return `{${newObj.slice(0, newObj.length-1)}}`
  }
  // 문자열 마지막에 포함된 , 를 제거 후 반환 
};

좋은 웹페이지 즐겨찾기