Ajax JSON

							window.onload = function () {
								var request = createRequest();

								request.onreadystatechange = function () {
									// 출력합니다.
									//alert(request.readyState);
									if (request.readyState == 4) {
										if (request.status == 200) {
											var json = eval('(' + request.responseText + ')'); //받아온 문자열을 자바스크립트 객체로 변환
											var willIn = '';

											for (var i in json) { 
												willIn += '
'+i+' : '+json[i]+'
'; } document.body.innerHTML = willIn; } } } request.open('GET', '/Home/MyFirstJsonAction', true); request.send(); }

Ajax를 사용해 JSON을 가져와 다루는 방법은 매우 간단합니다. 지금까지 배운 XMLHttpRequest 객체를 사용해 Ajax 요청을 수행하고 응답받는 JSON을 자바스크립트 객체로 변환하면 됩니다.

JSON이 이미 자바스크립트 형태의 문자열이므로 상기의 예제처럼 eval() 함수를 사용해 자바스크립트 객체로 변환할 수 있습니다.

XMLHttpRequest 객체의 responseText 속성을 eval() 함수의 매개 변수에 직접 넣지 않고, 괄호로 감싸 넣었습니다. 배열 형태의 JSON을 eval() 함수의 매개 변수로 넣을 때 가끔 문제가 발생하는데요. 이를 막기 위함입니다.