💾 CS

JSON과 XML

별이⭐ 2024. 3. 18. 16:40

JSON

💡 JavaScript Object Notation
JSON은 자바스크립트 객체 문법으로 구조화된 데이터 형식이며 단순 배열, 문자열 표현도 가능하다.

표현

💡 JSON 표현하기

[
    /* 0번째 요소 */
    {
        "name" : {
                "firstname" : "kim",
                "lastname" : "gildong",
                "lastname" : "hyeju" /* lastname : hyeju 가 된다 */
    },
        "age" : 10
    },
    /* 1번째 요소 */
    {
        "name" : "park",
        "age" : 20
    }
]
  • { key : value } 형태
    • key가 중복되면 아래에 적힌 value로 적용된다.
  • JSON의 타입
    • Number, String, Boolean, Array, Object, null → 가능
    • undefined, 메서드 → 불가능
  • JSON Array로 여러개 표현하기
    • 여러 개 표현하는 자료형 ? 배열! [ ] → JSON도 똑같이 적용 → JSON Array
  • JSON은 위 코드와 같이 재귀적으로도 구현할 수 있다.
  • JSON.parse()로 역직렬화한 뒤 Object로 요소 꺼내기
    • 만약 a라는 객체에 JSON 파일을 parse해서 넣었다면..
      • 0번째 요소의 name 뽑을래 → a[0].name 또는 a[0][”name”]
      • kim 뽑을래 → a[0].name.firstname

💡 단순 배열, 문자열 표현, 숫자 사용, 프로퍼티로 만들기

  • 단순 배열, 문자열
    • 보통 이렇게 쓰진 않고 key-value 형태로 쓴다. 
      [1, 2, 3, 4]
"kim is king"
  • 숫자 사용
    • 하지만 스키마 구축에는 String이면 String으로 동일하게 맞추는 것이 좋음! 
      {
"지브리OST리스트": 
[
{
    "name" : "마녀 배달부 키키",
    "song" : "따스함에 둘러쌓인다면"
},
{
    "name" : "하울의 움직이는 성",
    "song" : "세계의 약속"
    // "song" : 12314214 -> 느슨한 타입이라 이렇게 써도 되지만 비추천
}
]
}
  • 프로퍼티로 만들기 
    {
"name" : "kim",
"like" : {
    "아령" : {
        "weight" : "10kg",
        "feature" : "육각형"
    },
    "바나나" : {
        "color" : "초록색"
    }
}
}

특징과 활용

💡 직렬화와 역직렬화

  • JSON 파일을 기반으로 로직을 만드려면 해당 언어 오브젝트로 변환이 필요하다!
    • JSON.parse()
    • 만약 JavaScript에서 쓴다면 JSON 파일을 JavaScript Object로 변환 해주어야 함
    • 이렇게 JSON 파일 → 오브젝트로 변환하는 것이 역직렬화
  • 만약 JSON 파일을 오브젝트로 변환해서 로직 짠걸 파이썬으로 옮기려면?
    • JSON 파일로 다시 변환해서 파이썬으로 옮겨야 함
    • JSON.stringify()
    • 오브젝트 → JSON 파일로 변환하는 것이 직렬화
      • 외부 시스템에서도 사용할 수 있도록 byte 형태로 데이터를 변환하는 것

💡 여러 언어에서 쓰이는 독립적인 JSON

  • JSON은 여러 언어 플랫폼에 대해 독립적이다.
  • 언어가 버전 업그레이드를 많이 해도 JSON은 상관 없다!
  • 객체, 해시테이블, 딕셔너리 등으로 변환되어서 쓰인다

💡 효율적인 데이터 교환

  • 언어, 프레임워크에 독립적 → 서로 다른 시스템 간에 데이터 교환할 때 good
  • API 반환 형태, 시스템 구성 설정파일에 사용한다.
    • 어떤 요청 보내면 그 요청에 대한 값을 JSON으로 반환

XML

💡 Extensible Markup Language

마크업 형태를 쓰는 데이터 교환 형식.

표현

💡 마크업 ?

<?xml version="1.0" encoding="UTF-8"?>
<OSTList>
    <OST>
        <name>마녀 배달부 키키</name> <song>따스함에 둘러쌓인다면</song>
    </OST>
    <OST>
        ...
    </OST>
</OSTList>
  • 태그 등을 이용해 문서나 데이터 구조를 나타내는 방법. 속성 부여도 가능하다.
  • 마크업의 구성
    1. 프롤로그 : 버전, 인코딩 <?xml version="1.0" encoding="UTF-8"?>
    2. 루트요소(단 하나만) <OSTList>
    3. 하위 요소들 <OST>

특징과 활용

💡 HTML과 XML의 차이

  HTML XML
용도 데이터를 표시 데이터를 저장 및 전송
태그 미리 정의된 태그가 있음 고유한 태그를 만들고 정의 가능
대/소문자 구분 구분 X 구분 O

💡 sitemap.xml

  • 사이트맵이 뭐지?
    • 구글에 우리 서비스 홈페이지 상위 노출 시키고 싶어!
      • 상위 노출 시키려면 SEO(Search Engine Optimization, 검색엔진 최적화)가 필요해
    • 노출을 시키려면 어쨌든 구글 DB에 우리 서비스 페이지들이 많이 들어가 있어야겠지
      • 홈페이지에 종속적인 페이지(유저 페이지, 이벤트 페이지..)들은 크롤링 봇이 긁어서 쉽게 구글 DB에 저장 됨
      • 근데 종속적인 페이지말고 독립적인 페이지(장바구니..)들은 크롤링 봇이 잘 모름 → DB에 잘 저장이 안 됨
    • 독립적인 페이지도 노출 시키기 위해서 사이트맵을 제작해서 구글에 제출 함!

JSON vs XML

💡 JSON과 XML의 차이

  JSON XML
표현 key, value 태그
크기 닫힌 태그가 없어서 더 가벼움 JSON에 비해 닫힌 태그가 계속 들어가서 더 무거움
오브젝트로 변환 JSON.parse() 하면 끝 라이브러리 불러오고, .. JSON보다 더 복잡한 방법 사용
활용 API 반환 형태, 시스템 구성 설정파일 sitemap.xml
저작자표시 비영리 (새창열림)