Skip to content

Commit d013f29

Browse files
dinanathsj29dinanathsj29
authored
Chapter 2 uploaded
Chapter 2 uploaded
1 parent bfd1525 commit d013f29

File tree

1 file changed

+84
-57
lines changed

1 file changed

+84
-57
lines changed

‎readme.md

Lines changed: 84 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -84,9 +84,8 @@ Topics included/covered
8484
- 1.13. [JSON Arrays](#113-json-arrays)
8585
- 1.14. [Nested JSON Objects](#114-nested-json-objects)
8686
- 1.15. [Looping through JSON Array-Objects](#115-looping-through-json-array-objects)
87-
<!--
87+
8888
2. [JSON Resources](#2-json-resources)
89-
-->
9089

9190
1 Introduction to JSON
9291
=====================
@@ -497,7 +496,7 @@ Second or another way to access, read or modify JSON object data is Square brack
497496
```
498497

499498

500-
1.12. JSON Stringify
499+
12 JSON Stringify
501500
---------------------
502501

503502
1.12. Converting a JSON object or JSON array into a string
@@ -527,9 +526,16 @@ Second or another way to access, read or modify JSON object data is Square brack
527526
console.log(TechnologyJSON);
528527
console.log(TechnologyJSON.technologyName);
529528
529+
// by default json object are not printed in html view - it shows `[object Object]`
530+
document.write('initial TechnologyJSON object:', TechnologyJSON);
531+
530532
// parse a json object to string
531533
var TechnologyJSONStringify = JSON.stringify(TechnologyJSON);
532-
console.log(TechnologyJSONStringify);
534+
535+
// once json object converted to string - it can be available/placed for view
536+
document.write('<br/> <br/> <strong>JSON.stringify</strong> :', TechnologyJSONStringify);
537+
538+
console.log('JSON.stringify TechnologyJSONStringify: ', TechnologyJSONStringify);
533539
console.log(TechnologyJSONStringify.technologyName); //undefined
534540
535541
// parse a string object to json
@@ -823,67 +829,88 @@ Second or another way to access, read or modify JSON object data is Square brack
823829
<!DOCTYPE html>
824830
<html lang="en">
825831

826-
<head>
827-
<meta charset="UTF-8">
828-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
829-
<meta http-equiv="X-UA-Compatible" content="ie=edge">
830-
<title>looping-json-array</title>
831-
832-
<script type="text/javascript">
833-
834-
// creating JSON object
835-
var ColorsJSON = {
836-
"colors": ["Cyan", "Magenta", "Yellow", "Black", "Red", "Green", "Blue"],
837-
"colorDetails": [
838-
{ "colorName": "Red", "colorHexCode": "#ff0000" },
839-
{ "colorName": "Green", "colorHexCode": "#00ff00" },
840-
{ "colorName": "Blue", "colorHexCode": "#0000ff" },
841-
]
842-
};
843-
844-
console.log(ColorsJSON);
845-
846-
// accessing data from a json object
847-
// jsonMainObject.jsonSubObjectName.propertyName;
848-
console.log(ColorsJSON.colors);
849-
console.log(ColorsJSON.colors[0]);
850-
console.log('----------------------------------------------------');
851-
852-
// for loop
853-
document.write('<h1> Color Index & Color values - For loop </h1>');
854-
let totalColors = ColorsJSON.colors.length;
855-
for (let colorIndex = 0; colorIndex < totalColors; colorIndex++) {
856-
document.write('<li>' + colorIndex + " : " + ColorsJSON.colors[colorIndex] + '</li>');
857-
}
858-
859-
// for in loop
860-
document.write('----------------------------------------------------');
861-
document.write('<h1> Color Index & Color values - For in loop </h1>');
862-
863-
for(let _key in ColorsJSON.colors) {
864-
document.write('<li>' + ColorsJSON.colors[_key] + '</li>');
865-
}
866-
867-
document.write('----------------------------------------------------');
868-
document.write('<h1> Inner Color Index & Color values - For in loop </h1>');
869-
870-
for (let mainKey in ColorsJSON.colorDetails) {
871-
872-
for(let innerKey in ColorsJSON.colorDetails[mainKey]) {
832+
<head>
833+
<meta charset="UTF-8">
834+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
835+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
836+
<title>looping-json-array</title>
837+
838+
<script type="text/javascript">
839+
840+
// creating JSON object
841+
var ColorsJSON = {
842+
"colors": ["Cyan", "Magenta", "Yellow", "Black", "Red", "Green", "Blue"],
843+
"colorDetails": [
844+
{ "colorName": "Red", "colorHexCode": "#ff0000" },
845+
{ "colorName": "Green", "colorHexCode": "#00ff00" },
846+
{ "colorName": "Blue", "colorHexCode": "#0000ff" },
847+
]
848+
};
849+
850+
console.log(ColorsJSON);
851+
852+
// accessing data from a json object
853+
// jsonMainObject.jsonSubObjectName.propertyName;
854+
console.log(ColorsJSON.colors);
855+
console.log(ColorsJSON.colors[0]);
856+
console.log('----------------------------------------------------');
857+
858+
// for loop
859+
document.write('<h1> Color Index & Color values - For loop </h1>');
860+
let totalColors = ColorsJSON.colors.length;
861+
for (let colorIndex = 0; colorIndex < totalColors; colorIndex++) {
862+
document.write('<li>' + colorIndex + " : " + ColorsJSON.colors[colorIndex] + '</li>');
863+
}
873864
874-
document.write('<li>' + ColorsJSON.colorDetails[mainKey][innerKey] + '</li>');
865+
// for in loop
866+
document.write('----------------------------------------------------');
867+
document.write('<h1> Color Index & Color values - For in loop </h1>');
875868
869+
for(let _key in ColorsJSON.colors) {
870+
document.write('<li>' + ColorsJSON.colors[_key] + '</li>');
876871
}
877872
878-
}
873+
document.write('----------------------------------------------------');
874+
document.write('<h1> Inner Color Index & Color values - For in loop </h1>');
879875
880-
</script>
876+
for (let mainKey in ColorsJSON.colorDetails) {
877+
878+
for(let innerKey in ColorsJSON.colorDetails[mainKey]) {
881879
882-
</head>
880+
document.write('<li>' + ColorsJSON.colorDetails[mainKey][innerKey] + '</li>');
883881
884-
<body>
882+
}
885883
886-
</body>
884+
}
885+
886+
</script>
887+
888+
</head>
889+
890+
<body>
891+
892+
</body>
887893

888894
</html>
889895
```
896+
897+
2 JSON Resources
898+
=====================
899+
900+
> ### JSON Editor Online - view, edit and format JSON online
901+
- https://jsoneditoronline.org
902+
903+
> ### JSON Formatter & Validator
904+
- https://jsonformatter.curiousconcept.com
905+
- https://jsonlint.com/
906+
- https://zaa.ch/jsonlint/
907+
908+
> ### Online free JSON data store
909+
- Create and use a simple JSON data store for your web or mobile app: http://myjson.com
910+
911+
> ### Fake Online REST API for Testing and Prototyping
912+
- JSONPlaceholder: https://jsonplaceholder.typicode.com/
913+
914+
> ### xml validator
915+
- https://www.xmlvalidation.com/
916+
- https://www.w3schools.com/xml/xml_validator.asp

0 commit comments

Comments
 (0)