Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
5 views

07. Javascript Object Notation

JSON (JavaScript Object Notation) is a lightweight, text-based format for storing and exchanging data, which is easy to understand and language-independent. It allows for seamless data exchange between a browser and server by converting JavaScript objects to JSON and vice versa. JSON syntax consists of name/value pairs, and it supports various data types, making it a versatile choice for data representation in programming.

Uploaded by

chhungsim.chuo
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
5 views

07. Javascript Object Notation

JSON (JavaScript Object Notation) is a lightweight, text-based format for storing and exchanging data, which is easy to understand and language-independent. It allows for seamless data exchange between a browser and server by converting JavaScript objects to JSON and vice versa. JSON syntax consists of name/value pairs, and it supports various data types, making it a versatile choice for data representation in programming.

Uploaded by

chhungsim.chuo
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 17

JSON - JavaScript

Object Notation

Prepared by: Web


Team
What is JSON?
Selling your idea
- JSON is a Syntax for storing and exchanging
data. It’s a lightweight data-interchange format
- It means JavaScript Object Notation.
- And it’s a text, written with JavaScript Object
Notation.
- JSON is “self-describing” and easy to
understand. Also it’s language independent
since text can be read and used as a data
format by any programming language.
Exchanging Data? How?
Selling your idea
- When exchanging data between a browser and
a server, data can only be text.
- Since JSON is a text, so we can convert any
JavaScript Object into JSON and then send off to
a server.
Exchanging Data? How?
Selling
-
your idea
Not just converting JavaScript Object into JSON,
we also can reverse the converting from JSON
into JavaScript Object.
- By this way, we can work with Data as
JavaScript Object, with no complicated Parsing
and Translating.
Sending data:
Selling your idea
function login(username, pwd) {
var userObject = { "name" : username, "password" : pwd }
$.ajax({
url: "http://api-ams.me/v1/api/authentication",
type: "POST",
data: JSON.stringify(userObject),
success: function(response) {
console.log(“Successfully”);
},
error: function(error) {
console.log(“Error”);
}
})
}
Receiving data:
Selling your idea
function loadUser(id) {
$.ajax({
url: "http://api-ams.me/v1/api/users/"+id,
type: "GET",
success: function(response) {
console.log(response.data);
},
error: function(error) {
console.log(“Error”);
}
})
}
Why use JSON?
Selling
-
your idea
Since the JSON format is text only, it can easily
be sent to and from a server as seen in
example above. Besides, JSON is used as a data
format by any programming language.
- In JavaScript, JSON.parse() is a built-in function
to convert a string - written in JSON format, into
native JavaScript object.
JSON Syntax:
Selling
-
your idea
The JSON syntax is a subset of the JavaScript
syntax.

Rule:
➔ Data is in name/value pairs
➔ Data is separated by commas
➔ Curly braces hold objects
➔ Square brackets hold arrays
JSON Data - A name and a value
Selling
-
your idea
JSON data is written as name/value pairs. A
name/value pairs consists of a field name (in
double quotes), followed by a colon, followed
by a value:

Example: "username" : "Jung"

Note: JSON names required double quotes.


JavaScript names don’t.
JSON - Evaluates to JavaScript Objects
Selling
-
your idea
The JSON format is almost identical to
JavaScript objects.

JSON: JavaScript

{ "username" : "Jung" } { username : "Jung" }


JSON Value/Data Type
Selling your idea
- In JSON, values must be - In JavaScript, values can
one of the following data also be:
types:
➔ Function
➔ String ➔ Date
➔ Number ➔ Undefined
➔ Object (JSON object)
➔ Array
➔ Boolean
➔ Null
JSON Data Types
Selling your idea
JSON Strings: { "username":"Jung" JSON Boolean:
} { "gender":true }

JSON Numbers: { "age":28 } JSON Null: { "children":null }

JSON Objects: { "data":


{ "username":"Jung",
"Age" : 28}
}

JSON Arrays: { "employees":


[ "John", "Anna",
"Peter" ] }
JSON Objects
Selling your idea
Syntax: { "name" : "value" }
- JSON objects are surrounded by curly braces
{ }.
- JSON objects are written in key/value pairs.
- Keys must be strings, and values must be a
valid JSON data type (string, number, object,
array, boolean or null).
- Keys and values are separated by a colon.
- Each key/value pair is separated by a comma.
JSON Objects - Accessing Object Values
Selling
-
your idea
You can access the object values by using dot
(.) notation:

Example: var username = data.name


JSON Objects - Looping an Object
Selling
-
your idea
You can loop thru object properties by using for-
in loop:

Example:
user = { "name":"Jung", "age":28, "house":null };

for (x in user) {
document.getElementById("demo").innerHTML
+= x;
}
JSON Files
Selling
➔
your idea
The file type for JSON files is “.json “
➔ The MIME type of JSON text is “application/json”
➔ MIME - Multipurpose Internet Mail Extensions
➔ Link: https://en.wikipedia.org/wiki/MIME
Good luck!

Thank you!

You might also like