국비지원/프로젝트

230419 프로젝트 중 생긴 궁금증 - 직렬화, JSON, getElementById()와 querySelector()의 차이

선SEON 2023. 4. 19. 16:01

직렬화

  • 직렬화(Serialization)란 자바 시스템 내에서 사용하는 객체 또는 데이터를 자바시스템 외에서도 사용할 수 있도록 Byte 형태로 데이터를 변환하는 기술이다.(파일로 만든다고 보면된다.)
  • Byte로 변환된 데이터를 다시 자바의 객체로 변환하는 기술을 역직렬화(Deserialization)라고 한다.

객체를 바이트 스트림으로 바꾸는 것, 즉 객체에 저장된 데이터를 스트림에 쓰기write 위해 연속적인serial 데이터로 변환하는 것이다.

직렬화의 주된 목적은 객체를 상태 그대로 저장하고 필요할 때 다시 생성하여 사용하는 것


JSON 데이터 유형 및 예시

JSON은 파싱 또는 직렬화 없이도 JavaScript 프로그램에서 사용할 수 있습니다. JSON은 JavaScript 객체 리터럴, 배열, 스칼라 데이터를 표현하는 텍스트 기반의 방식입니다.

JSON은 상대적으로 쉽게 읽고 작성할 수 있고, 소프트웨어에서 파싱 및 생성하기도 쉽습니다. 종종 구조화된 데이터를 직렬화해 이를 네트워크에서 교환할 때(보통 서버와 웹 애플리케이션 간) 사용됩니다.

JSON은 여러 데이터 유형으로 세분화할 수 있습니다.

  1. 문자열
  2. 숫자
  3. 부울
  4. Null
  5. 객체
  6. 배열

문자열

JSON의 문자열은 유니코드 문자로 구성되며, 백슬래시(\) 이스케이프 문자를 사용합니다.

예시
{ "name" : "Jones" }

 Javascript 객체 문법을 따르는 문자 기반의 데이터 포맷(프로퍼티만 담을 수 있음, 메소드 X)

 

문자열 형태로 존재, 데이터 계층을 구축 가능

 


getElementById()와 querySelector()의 차이

 

 

getElementById()와 querySelector()는 모두 JavaScript에서 HTML 요소를 선택하는 방법입니다.

getElementById()는 id 속성을 사용하여 요소를 찾는 데 사용되며, 단일 요소만 선택합니다. 이 메서드는 문서 전체에서 id가 고유한 요소를 찾기 때문에 성능이 좋습니다.

querySelector()는 CSS 선택자를 사용하여 요소를 찾는 데 사용됩니다. 이 메서드는 복수의 요소를 선택할 수 있으며, 선택자를 작성하는 데 CSS의 모든 규칙을 사용할 수 있습니다. 따라서 더 유연한 선택 기능을 제공하지만, getElementById()보다 성능이 좋지 않을 수 있습니다.

즉, getElementById()는 단일 요소에 특화되어 있으며, querySelector()는 복수의 요소에 대한 선택 기능을 제공합니다.