[이론 정리] 처음 접하면 헷갈리는 j삼형제 jquery, json, ajax에 대하여

jquery

 

jQuery(제이쿼리)는 HTML의 클라이언트 사이드 조작을 단순화 하도록 설계된 크로스 플랫폼의 자바스크립트 라이브러리다. jQuery의 문법은 코드 보기, 문서 객체 모델(DOM)찾기, 애니메이션 만들기, 이벤트 제어, Ajax 개발을 쉽게 할 수 있도록 디자인되었다. JQuery는 한 개의 자바스크립트 파일로 존재한다.

 

DOM접근 방법을 쉽게 해주고 노드를 엑세스하고 관리하기 쉽다.' $ '를 붙여서 jqeury객체로 만들어줘야 한다. 붙이지 않으면 단순한 문자열에 불과하다.

 

기능

• DOM 요소 선택 기의 파생 프로젝트이다.
• DOM 탐색 및 수정 (CSS 1-3 지원)
• CSS 셀렉터에 기반한 DOM 조작
• 이벤트
• 특수효과 및 애니메이션
• AJAX
• JSON 파싱
• 플러그인을 통한 확장성
• 유틸리티
• 호환성 메소드 (inArray(), each() 함수 등)
• 멀티브라우저 지원 (크로스브라우저와는 다름)

 

 

 

 

json

 

JSON(JavaScript Object Notation)은 Javascript 객체 문법으로 구조화된 데이터를 표현하기 위한 문자 기반의 표준 포맷이다. 웹 어플리케이션에서 데이터를 전송할 때 일반적으로 사용한다(서버에서 클라이언트로 데이터를 전송하여 표현하려거나 반대의 경우).

=> 어떤 언어에서든 데이터 구조와 실제 데이터를 다른 언어 및 플랫폼에서 해석 가능한 형식으로 전송할 수 있어야 하는데, 이를 가능케 하는 데이터 교환 포맷이다.

 

쉽게 말해서 자바스크립트에서 접근할 수 있는 객체로 만들어 주는 것이다. 단순히 문자열에 그치지 않게 데이터로 인식될 수 있도록 형변환해주는 것이라 생각하면 된다.

 

 

* json유효성 검사 사이트

https://jsonlint.com/

 

 

 

 

 

Ajax

 

AJAX란 비동기 자바스크립트와 XML (Asynchronous JavaScript And XML)을 뜻한다. 간단히 말하면, 서버와 통신하기 위해 XMLHttpRequest객체를 사용하는 것을 말한다. JSON, XML, HTML 그리고 일반 텍스트 형식 등을 포함한 다양한 포맷을 주고 받을 수 있다. AJAX의 강력한 특징은 페이지 전체를 리프레쉬 하지 않고서도 수행 되는 "비동기성"이다. 이러한 비동기성을 통해 사용자의 Event가 있으면 전체 페이지가 아닌 일부분만을 업데이트 할 수 있다.

 

AJAX의 주요 두가지 특징은 아래의 작업을 할 수 있게 해준다.

• 페이지 새로고침 없이 서버에 요청
• 서버로부터 데이터를 받고 작업을 수행

 

* XMLHttpRequest

: 서버와 상호작용할 때 사용한다. XHR을 사용하면 페이지의 새로고침 없이도 URL에서 데이터를 가져올 수 있고, 이를 활용하면 사용자의 작업을 방해하지 않고 페이지의 일부를 업데이트할 수 있다.

- Ajax 프로그래밍에 많이 사용된다.

- 이름에 XML이 들어가긴 하지만, XMLHttpRequest은 XML 뿐만 아니라 모든 종류의 데이터를 가져올 수 있다.

 

 

 

 

 

 

참고 및 출처

https://developer.mozilla.org/ko/docs/Web/Guide/AJAX/Getting_Started#ajax%EB%9E%80

https://ko.wikipedia.org/wiki/JQuery

https://www.oracle.com/kr/database/what-is-json/#json-defined