0% found this document useful (0 votes)
59 views28 pages

JSON: The Basics: Electronic

This document provides an overview of JSON (JavaScript Object Notation), including what it is, comparisons with XML, syntax, data types, usage, and examples. JSON is a lightweight text-based data interchange format that is easy to understand, manipulate, and generate. It uses JavaScript syntax but is not a programming language.

Uploaded by

Salman chaudhary
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
Download as pptx, pdf, or txt
0% found this document useful (0 votes)
59 views28 pages

JSON: The Basics: Electronic

This document provides an overview of JSON (JavaScript Object Notation), including what it is, comparisons with XML, syntax, data types, usage, and examples. JSON is a lightweight text-based data interchange format that is easy to understand, manipulate, and generate. It uses JavaScript syntax but is not a programming language.

Uploaded by

Salman chaudhary
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
Download as pptx, pdf, or txt
Download as pptx, pdf, or txt
You are on page 1/ 28

ELEVENTH EDITION

ELECTRONIC
COMMERCE
GARY P. SCHNEIDER

JSON: The Basics


Overview

• What is JSON?

• Comparisons with XML

• Syntax

• Data Types

• Usage

• Live Examples
What is JSON?
JSON is…

• A lightweight text based data-interchange format

• Completely language independent

• Based on a subset of the JavaScript Programming


Language

• Easy to understand, manipulate and generate


JSON is NOT…

• Overly Complex

• A “document” format

• A markup language

• A programming language
Why use JSON?

• Straightforward syntax

• Easy to create and manipulate

• Can be natively parsed in JavaScript using eval()

• Supported by all major JavaScript frameworks

• Supported by most backend technologies


JSON vs. XML
Much Like XML

• Plain text formats

• “Self-describing“ (human readable)

• Hierarchical (Values can contain lists of objects or


values)
Not Like XML

• Lighter and faster than XML

• JSON uses typed objects. All XML values are type-


less strings and must be parsed at runtime.

• Less syntax, no semantics

• Properties are immediately accessible to JavaScript


code
Knocks against JSON

• Lack of namespaces

• No inherit validation (XML has DTD and templates,


but there is JSONlint)

• Not extensible

• It’s basically just not XML


Syntax
JSON Object Syntax

• Unordered sets of name/value pairs

• Begins with { (left brace)

• Ends with } (right brace)

• Each name is followed by : (colon)

• Name/value pairs are separated by , (comma)


JSON Example

var employeeData = {
"employee_id": 1234567,
"name": "Jeff Fox",
"hire_date": "1/1/2013",
"location": "Norwalk, CT",
"consultant": false
};
Arrays in JSON

• An ordered collection of values

• Begins with [ (left bracket)

• Ends with ] (right bracket)

• Name/value pairs are separated by , (comma)


JSON Array Example

var employeeData = {
"employee_id": 1236937,
"name": "Jeff Fox",
"hire_date": "1/1/2013",
"location": "Norwalk, CT",
"consultant": false,
"random_nums": [ 24,65,12,94 ]
};
Data Types
Data Types: Strings

• Sequence of 0 or more Unicode characters

• Wrapped in "double quotes“

• Backslash escapement
Data Types: Numbers

• Integer

• Real

• Scientific

• No octal or hex

• No NaN or Infinity – Use null instead.


Data Types: Booleans & Null

• Booleans: true or false

• Null: A value that specifies nothing or no value.


Data Types: Objects & Arrays

• Objects: Unordered key/value pairs wrapped in { }

• Arrays: Ordered key/value pairs wrapped in [ ]


JSON Usage
How & When to use JSON

• Transfer data to and from a server

• Perform asynchronous data calls without requiring a


page refresh

• Working with data stores

• Compile and save form or user data for local


storage
Where is JSON used today?

• Anywhere and everywhere!

And many,
many more!
Simple Example
Simple Demo

• Build a JSON data object in code

• Display raw output

• Display formatted output

• Manipulate via form input


Questions?
Resources

• Simple Demo on Github:


https://github.com/jfox015/BIFC-Simple-JSON-Demo

• Another JSON Tutorial:


http://iviewsource.com/codingtutorials/getting-started-
with-javascript-object-notation-json-for-absolute-begin
ners/

• JSON.org: http://www.json.org/

You might also like