JSON

JavaScript Object Notation

Samuel Chen

Agenda

• Introduction• Benefits• Gramma• Native JSON• Security• Limitation• References• Example• Q & A

Introduction     What's JSON

JSON isa lightweight text format for data-interchange

• Easy for human to read and write.• Easy for machine to parse and generate.• Completely language independent.• Easy to uses in most programming languages.• Based on a subset of the

JavaScript Programming Language, Standard ECMA-262 3rd Edition December 1999.

JSON is a lightweight text format for data-interchange

• A collection of name/value pairs.• An ordered list of values.• Often used for serialization and transmitting

structured data over a network connection• One of the major technologies in AJAX web

application programming.• An alternative to the XML format.

Comparison The fat-free alternative to XML

JSON 

{     "firstName": "John",     "lastName": "Smith",     "address": {         "streetAddress": "21 2nd Street",         "city": "New York",         "state": "NY",         "postalCode": "10021"     },     "phoneNumbers": [         { "type": "home", "number": "212 555-1234" },         { "type": "fax", "number": "646 555-4567" }     ] }

XML 

<?xml version="1.0" encoding="utf-8"?><Person firstName="John" lastName="Smith">  <Address>    <streetAddress>21 2nd Street</streetAddress>    <city>New York</city>    <state>NY</state>    <postalCode>10021</postalCode>  </Address>  <phoneNumber type="home">      212 555-1234  </phoneNumber>  <phoneNumber type="fax">      646 555-4567  </phoneNumber></Person>

BothJSON & XML

JSON XML

Text based * *

Position independent * *

Simplicity ** *

Interoperability * **

AdvantageJSON vs. XML

• Simple• Small (228)• Built into language• Data Oriented

JSON XML• Complex• Large (310)• External parser• Document Oriented

DisadvantageJSON vs. XML

• No Binary • None Extensible• None Display

Capability

JSON XML• <[CDATA[]]>• Good Extensibility• Many views for one

data

* Actually all these disadvantages are the design purposes.* Link - "JSON: The Fat-Free Alternative to XML"

Gramma Data types and syntax

Data typesValue

• Number (integer, real, or floating point)• String (double-quoted Unicode with backslash escaping)• Boolean (true and false)• Array (an ordered sequence of values, comma-separated and

enclosed in square brackets)• Object (collection of key:value pairs, comma-separated and

enclosed in curly braces)• null

String 

• Unicode• Wrapped in double quotes• Backslash escapes• Without double quotes• Char is string

Number 

• Int: 123, -456, 0• Real: 123.456, -3.14, 0.0• Float: 1.434E+1, 0.234e-1• Without double quotes: "123" is not number• *Octal or Hex leading, zero leading are not allowed

Literal true, false & null

• Lowercase• Only "true", "false" and "null"• *Boolean concept

o excalmatory mark "!"o true = !falseo !null

Object 

• Wrapped in curly brackets "{" and "}"• Zero or more name/value pairs or members• Single colon after name to separate name from value.• Single comma after value to separate a following name.• The name within the object should be unique.• * Double quotes surroundding a name is not required.

{"name":"Sam"} and {name:"Sam"} both work.• * {"123":123}, {"#%$!":"correct?"}• * No operations. Compare to object in OO.

Array 

• Surrounded with square brackets "[" and "]"• Zero or more values separated by comma• *Array items are able to be different types.

Security Javascript Tag Injection

Code Injection

• JSON-formated text is also syntactically legal javascript code

• Built-in eval() is easy to use• eval("javascript:alert('Hello, World');")• Validate before eval

Native JSON IE8, Firefox3.1, WebKits-based Browsers

Native JSON 

• Safe• Much Faster• Object to JSON string• JSON.Parse(string)• JSON.stringify(object)

Limitation No sementics associated

References 

• JSON Home Page• RFC 4627 (fomal JSON spec)• The limitation of JSON• Native JSON in Firefox 3.1• Native JSON in IE8• JSON on Wiki

Example To update a Web DataWindow

Q & A

Thanks

samuel.net@gmail.com