官术网_书友最值得收藏!

  • Ext JS 3.0 Cookbook
  • Jorge Ramon
  • 455字
  • 2021-04-01 13:43:44

Encoding and decoding JSON

Converting JavaScript and Ext JS objects to JSON, and converting JSON data back to JavaScript objects is easily achievable with Ext JS. For example, here's how to JSON-encode an array and how to rebuild the array from its JSON representation:

Note

JavaScript Object Notation (JSON) is a lightweight text format where an object is represented with an unordered set of name/value pairs and an array with an ordered collection of values.

JSON is completely language independent, easy for humans to read and write, and easy for machines to parse and generate. These properties make JSON an ideal data-interchange format.

Find out more about JSON at www.json.org.

How to do it...

Let's encode an array of colors using the following steps:

  1. Create an array called colorsArray:
    var colorsArray = new Array();
    
  2. Put some values in the array:
    colorsArray[0] = 'Blue';
    colorsArray[1] = 'Red';
    colorsArray[2] = 'White';
    
  3. Now, convert to JSON:
    var colorsJson = Ext.encode(colorsArray);
    

    The value of the colorsJson variable should be the string ["Blue","Red","White"] string

  4. Let's re-create the array based on its JSON string. Take the JSON representation of colorsArray:
    var colorsJson = '["Blue","Red","White"]';
    
  5. Parse the JSON and rebuild the array:
    var colorsArray = Ext.decode(colorsJson);
    

After this, colorsArray contains the colors data: colorsArray[0] is 'Blue', colorsArray[1] is 'Red', and colorsArray[2] is 'White'.

How it works...

To obtain a JSON representation of an array, object, or other value, pass the value to Ext.util.JSON.encode(object). You can also use the shorthand, Ext.encode(object).

You can parse a JSON string by using Ext.util.JSON.decode(json), or its shorthand Ext.decode(json).

While decoding JSON involves simply calling the JavaScript eval(String) function, the encoding process is more complicated and requires different implementations depending on the data type being encoded. Internally, the encode(object) function calls specialized encoding functions for arrays, dates, Boolean values, strings, and other types.

You can also set the Ext.USE_NATIVE_JSON property to true, which will cause calls to encode(object) and decode(json) to use the browser's native JSON handling features. This option is turned off by default. If you turn it on, beware that native JSON methods will not work on objects that have functions, and that property names should be quoted in order for the data to be correctly decoded.

There's more...

JSON encoding and decoding is a pillar of modern web development, given the role of JSON—a language-independent, data-interchange format—in facilitating communications between the client-side and server-side of web applications. For instance, you can expect to find JSON manipulation when your application needs to send data to the server, as well as when the application needs to dynamically create objects from server-supplied data.

See also...

  • The next recipe, Encoding and decoding URL data, shows how to do two-way conversion between objects and URL data.
主站蜘蛛池模板: 甘肃省| 德钦县| 邵武市| 定日县| 南城县| 连云港市| 英德市| 伊川县| 卢氏县| 深州市| 博罗县| 田东县| 鄯善县| 同心县| 尚志市| 屏南县| 罗江县| 西华县| 舒城县| 峨眉山市| 新绛县| 永兴县| 昭通市| 永济市| 赞皇县| 虹口区| 大同县| 巢湖市| 普兰县| 崇州市| 长岛县| 天柱县| 通许县| 临汾市| 高碑店市| 平遥县| 筠连县| 松溪县| 南川市| 共和县| 泗洪县|