비동기 브라우저/서버 통신 (AJAX)을 위해, 넓게는 XML(AJAX가 사용)을 대체하는 주요 데이터 포맷이다.
위와 같이 쓰면 무슨 소리인지 모르니 예제를 통해 설명하겠다.
아래는 서버 측에서 실행되는 언어인 PHP이다.
<?php
$number=[1,2,3,4,5];
?>
위의 PHP로 작성된 number 배열을 웹브라우져로 전송하고 싶지만 배열을 전송할 수 있는 방법은 없다.
하지만 JSON을 이용하면 배열도 객체도 전송할 수 있다. 또한 JSON은 C, JAVA, Perl 등 거의 모든 언어에서 사용할 수 있다.
만약 php의 배열을 자바스크립트에 전달하고 싶다면 아래와 같이 php함수인 implode 함수를 통해 문자열로 변경해준 후 자바스크립트에서 문자열을 받아 배열로 변환해 사용하면 된다.
<?php
$number=[1,2,3,4,5];
echo implode(',' ,$number);
// implode 함수를 통해 각각의 배열 요소를 ,(콤마) 형식의 문자열로 저장한다.
?>
<script>
var PhpString = "1,2,3,4,5"; // php에서 받은 문자열
var JsArray = PhpString.split(','); // split 함수를 통해 ,(콤마)를 기준으로 배열 원소에 담는다.
</script>
위와 같이 JSON을 사용하지 않고도 php에서 문자열로 변환하고 js에서 다시 배열로 만들어 사용할 수 있지만 코드가 복잡해지고 객체와 다차원 배열 등을 사용하면 위처럼 간단하게 해결할 수가 없다.
따라서 JSON을 이용해 아래와 같이 php을 배열로 전송해 js에서 배열로 받을 수 있다.
<?php
$number=[1,2,3,4,5];
echo json_encode(',', $number); // 데이터 형식을 JSON 형식 데이터로 변환해준다.
?>
<script>
var PhpString = php에서 받은 문자열
var JsArray = JSON.parse(PhpString); // JSON 객체의 parse 메소드를 통해 배열로 저장한다.
</script>
http://www.json.org/json-ko.html
위의 JSON 홈페이지를 통해 JSON의 문법과 지원하는 Type, 지원하는 언어와 라이브러리를 확인할 수 있다.
'Programming > JavaScript' 카테고리의 다른 글
Open API 가져오기 (0) | 2021.08.08 |
---|---|
Node.js 웹서버 구축 (0) | 2021.08.08 |
Ajax 통신이란? (PHP) (0) | 2021.08.04 |
댓글