Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit c2d508c

Browse files
chapter 1 - 1.10 uploaded
chapter 1 - 1.10 uploaded
1 parent c6c9310 commit c2d508c

File tree

1 file changed

+81
-3
lines changed

1 file changed

+81
-3
lines changed

‎readme.md

Lines changed: 81 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,7 @@ Topics included/covered
7878
- 1.7. [JSON vs XML](#17-json-vs-xml)
7979
- 1.8. [JSON vs XML Trends](#18-json-vs-xml-trends)
8080
- 1.9. [JSON Data Types](#19-json-data-types)
81+
- 1.10. [Access-Modify JSON object data](#110-access-modify-json-object-data)
8182

8283
<!--
8384
2. [JSON Resources](#2-json-resources)
@@ -99,8 +100,8 @@ Topics included/covered
99100
- JSON is a syntax for storing and exchanging data
100101
- JSON is a lightweight data-interchange, Data representation format
101102
- JSON is `self-describing`, an easier to understand, easy to use and alternative format to `XML (eXtensible Markup Language)` also widely used these days
102-
- JSON is language independent (JSON uses JavaScript syntax, with text-only format,
103-
Text can be read and used as a data format by any programming language)
103+
- JSON is often used with `AJAX (Asynchronous JavaScript and XML)`
104+
- JSON is language independent (JSON uses JavaScript syntax, with text-only format, Text can be read and used as a data format by most/any modern programming language)
104105
- JSON is commonly used for APIs and Configurations
105106

106107
```
@@ -355,7 +356,7 @@ Json supports values of the following data types:
355356
| Object | Most complex but widely used Data types <br/> ` { "key": "value" } { "name": "Dinanath", "id": 101 }` |
356357
| Array | JSON value can be array which holds multiple items of various data types <br/> `[1,2,3,4,5] ["Dinanath", "Akash", "Ambar", "Sagar", "Suraj"]` |
357358
| Boolean | true or false <br/> ` { "isDone":true }` |
358-
| null | null (nothing) <br/> `{ "status":null }` |
359+
| null | null (nothing/empty value) <br/> `{ "status":null }` |
359360

360361
```
361362
JSON values cannot be of following data types:
@@ -364,3 +365,80 @@ JSON values cannot be of following data types:
364365
- a date
365366
- undefined
366367
```
368+
369+
370+
1.10. Access-Modify JSON object data
371+
---------------------
372+
373+
JavaScript object or JSON object data can be accessed and modified by two syntax or ways:
374+
- Dot notation syntax
375+
- Square bracket syntax
376+
377+
### 1.10.1. Dot notation
378+
To access, read or modify JSON object data, we simply need to use property name with `. dot notation`, will get all IntelliSense as soon as will use any `jsonObjectName.propertyName` or so.
379+
380+
As soon as we assign JSON format/values to any JavaScript variable, it becomes a JavaScript object to which we can access via `. dot notation`.
381+
382+
```jsonObjectName.propertyName``` or ```TechnologyJSON.technologyName```
383+
384+
### 1.10.2. Square bracket
385+
Second or another way to access, read or modify JSON object data is Square bracket notation
386+
387+
```jsonObjectName.['propertyName']``` or ```TechnologyJSON.['technologyName']```
388+
389+
> **Syntax & Example**: `1.10.1-access-modify-json-data.html`
390+
391+
```
392+
<!DOCTYPE html>
393+
<html lang="en">
394+
395+
<head>
396+
<meta charset="UTF-8">
397+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
398+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
399+
<title>json-access-modify-data</title>
400+
401+
<script type="text/javascript">
402+
403+
// creating JSON object
404+
var TechnologyJSON = {
405+
"technologyName": "JSON (JavaScript Object Notation)",
406+
"inventor": "Douglas Crockford",
407+
"usage": "Data storage and exchange format",
408+
"version": 1.0,
409+
"cost": 0,
410+
"license": "Open Source - MIT"
411+
}
412+
413+
// accessing data from a json object
414+
// JsonObjectName.propertyName
415+
416+
// Dot notation syntax
417+
console.log(TechnologyJSON.inventor);
418+
document.write('<li>' + TechnologyJSON.inventor + '</li>');
419+
document.write('<li>' + TechnologyJSON.usage + '</li>');
420+
421+
// Square bracket syntax
422+
console.log(TechnologyJSON['inventor']);
423+
document.write('<li>' + TechnologyJSON['inventor'] + '</li>');
424+
document.write('<li>' + TechnologyJSON['license'] + '</li>');
425+
426+
// modifying data
427+
var techName1 = TechnologyJSON.technologyName = 'XML';
428+
console.log(techName1);
429+
document.write('<br/><br/><li>' + techName1 + '</li>');
430+
431+
var techName2 = TechnologyJSON['technologyName'] = 'AJAX';
432+
console.log(techName2);
433+
document.write('<br/><br/><li>' + techName2 + '</li>');
434+
435+
</script>
436+
437+
</head>
438+
439+
<body>
440+
441+
</body>
442+
443+
</html>
444+
```

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /