Prototype 和 JSON 教程

JSON 簡介

JSON（JavaScript 物件表示法）是一種輕量級的資料交換格式。

• JSON 易於人類閱讀和編寫。

• JSON 易於機器解析和生成。

• JSON 基於 JavaScript 程式語言的一個子集。

• JSON 尤其被網路上的 API 廣泛使用，並且是 Ajax 請求中 XML 的快速替代方案。

• JSON 是一種完全獨立於語言的文字格式。

Prototype 1.5.1 及更高版本具有 JSON 編碼和解析支援。

JSON 編碼

Prototype 提供以下編碼方法：

注意 - 請確保至少擁有 prototype.js 1.6 版本。

如果您不確定需要編碼的資料型別，最佳選擇是使用 Object.toJSON，例如：

var data = {name: 'Violet', occupation: 'character', age: 25 };
Object.toJSON(data);

這將產生以下結果：

'{"name": "Violet", "occupation": "character", "age": 25}'

此外，如果您使用自定義物件，您可以設定自己的 toJSON 方法，該方法將由 Object.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"

將 JSON 與 Ajax 結合使用

將 JSON 與 Ajax 結合使用非常簡單。只需在傳輸的 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);
   }
});