프로토 타입 및 JSON 튜토리얼
JSON 소개
JSON (JavaScript Object Notation)은 가벼운 데이터 교환 형식입니다.
JSON은 사람이 읽고 쓰기가 쉽습니다.
JSON은 머신이 파싱하고 생성하기 쉽습니다.
JSON은 JavaScript 프로그래밍 언어의 하위 집합을 기반으로합니다.
JSON은 웹 전체의 API에서 특히 사용되며 Ajax 요청에서 XML에 대한 빠른 대안입니다.
JSON은 완전히 언어에 독립적 인 텍스트 형식입니다.
프로토 타입 1.5.1 이상 버전은 JSON 인코딩 및 구문 분석 지원을 제공합니다.
JSON 인코딩
프로토 타입은 다음과 같은 인코딩 방법을 제공합니다.
NOTE − 최소한 prototype.js 버전 1.6이 있는지 확인하십시오.
S. 아니. | 방법 및 설명 |
---|---|
1. | Number.toJSON () 주어진 숫자에 대한 JSON 문자열을 반환합니다. |
2. | String.toJSON () 주어진 문자열에 대한 JSON 문자열을 반환합니다. |
삼. | Array.toJSON () 주어진 배열에 대한 JSON 문자열을 반환합니다. |
4. | Hash.toJSON () 주어진 Hash에 대한 JSON 문자열을 반환합니다. |
5. | Date.toJSON () 날짜를 JSON 문자열로 변환합니다 (JSON에서 사용하는 ISO 형식에 따름). |
6. | Object.toJSON () 주어진 개체에 대한 JSON 문자열을 반환합니다. |
인코딩해야하는 데이터 유형이 확실하지 않은 경우 가장 좋은 방법은 Object.toJSON을 사용하는 것입니다.
var data = {name: 'Violet', occupation: 'character', age: 25 };
Object.toJSON(data);
이것은 다음 결과를 생성합니다-
'{"name": "Violet", "occupation": "character", "age": 25}'
또한 사용자 지정 개체를 사용하는 경우 Object.toJSON에서 사용할 자체 toJSON 메서드를 설정할 수 있습니다 . 예를 들면-
var Person = Class.create();
Person.prototype = {
initialize: function(name, age) {
this.name = name;
this.age = age;
},
toJSON: function() {
return ('My name is ' + this.name +
' and I am ' + this.age + ' years old.').toJSON();
}
};
var john = new Person('John', 49);
Object.toJSON(john);
이것은 다음 결과를 생성합니다-
'"My name is John and I am 49 years old."'
JSON 구문 분석
JavaScript에서 JSON 구문 분석은 일반적으로 JSON 문자열의 내용을 평가하여 수행됩니다. Prototype 은이 를 처리하기 위해 String.evalJSON 을 도입 합니다. 예를 들면-
var d='{ "name":"Violet","occupation":"character" }'.evalJSON();
d.name;
이것은 다음 결과를 생성합니다-
"Violet"
Ajax에서 JSON 사용
Ajax와 함께 JSON을 사용하는 것은 매우 간단합니다. 전송의 responseText 속성에서 String.evalJSON 을 호출하기 만하면 됩니다.
new Ajax.Request('/some_url', {
method:'get',
onSuccess: function(transport) {
var json = transport.responseText.evalJSON();
}
});
데이터가 신뢰할 수없는 출처에서 가져온 경우 데이터를 삭제해야합니다.
new Ajax.Request('/some_url', {
method:'get',
requestHeaders: {Accept: 'application/json'},
onSuccess: function(transport) {
var json = transport.responseText.evalJSON(true);
}
});