Scribd
Upload
47 views

4 Es6 Js Object Json

Uploaded by

tanmay902333
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
47 views

4 Es6 Js Object Json

Uploaded by

tanmay902333
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 40

ECMA Script 2015

Object

#JavaScript Notes
Index
 Object
 JSON Stringify
 JSON Parse
 Destructuring Assignment

Akash Technolabs www.akashsir.com


Javascript Object

Akash Technolabs www.akashsir.com


Javascript Object
 In JavaScript, an object is an unordered collection of key-value pairs. Each
key-value pair is called a property.

objectname = {
Key: "Value",
Key: 0,
Key: "String",
}

Akash Technolabs www.akashsir.com


How to Create Object?
 We can create object using {}.
 To create an object with properties, you use the key:value within the curly
braces
 The key of a property can be a string. And the value of a property can be any
value, e.g., a string, a number, an array, and even a function.

objectname = {
Key: "Value",
Key: 0,
Key: "String",
}

Akash Technolabs www.akashsir.com


Create Javascript Object
 The person object has two properties firstName and lastName with the
corresponding values Akash' and Padhiyar'.

Akash Technolabs www.akashsir.com


Accessing properties
 Use the dot notation ( .) or array-like notation ([]) to access a property of an
object.
 To access a property of an object, you use one of two notations:
1. the dot notation
2. array-like notation.

Akash Technolabs www.akashsir.com


The dot notation (.)
 The following illustrates how to use the dot notation to access a property of
an object:
 objectName.propertyName

Akash Technolabs www.akashsir.com


Array-like notation
 The following illustrates how to use the dot notation to access a property of
an object:
 objectName['propertyName']

Akash Technolabs www.akashsir.com


Html Based Example

Akash Technolabs www.akashsir.com


Checking if a property exists
 To check if a property exists in an object, you use the in operator:

Akash Technolabs www.akashsir.com


Adding a new property to an object
 you can add a property to an object after object creation.

Akash Technolabs www.akashsir.com


Modifying the value of a property
 To change the value of a property, you use the assignment operator (=).

Akash Technolabs www.akashsir.com


Deleting a property of an object
 To delete a property of an object, you use the delete operator:

Akash Technolabs www.akashsir.com


Nested Object

Akash Technolabs www.akashsir.com


Object with Array

Akash Technolabs www.akashsir.com


Object with Array

Akash Technolabs www.akashsir.com


Print Using Loop

Akash Technolabs www.akashsir.com


JSON.stringify()

Akash Technolabs www.akashsir.com


JSON
 JavaScript Object Notation (JSON) is a standard text-based format for
representing structured data based on JavaScript object syntax.
 It is commonly used for transmitting data in web applications (e.g., sending
some data from the server to the client, so it can be displayed on a web page,
or vice versa).

Akash Technolabs www.akashsir.com


About JSON
 key:value is the building block.
 { } contains an element.
 [ ] contains an array of elements.
 An element can have multiple key:value pairs.
 Value can be a simple value like number or string etc., or an element or an
array.
 Elements in an Array could be accessed using index
 Multiplekey:value pairs or elements are separated by comma

Akash Technolabs www.akashsir.com


JSON Stringify
 The JSON.stringify() method converts a JavaScript object or value to a JSON string

Akash Technolabs www.akashsir.com


Without JSON Convert Print

Akash Technolabs www.akashsir.com


With JSON Stringify Print Data

Akash Technolabs www.akashsir.com


JSON.parse()
 JSON Parse will convert JSON Data into Javascript Object.

Akash Technolabs www.akashsir.com


JSON Parse

Akash Technolabs www.akashsir.com


JS to JSON & JSON to JS Object

Akash Technolabs www.akashsir.com


Destructuting Assignment

Akash Technolabs www.akashsir.com


Destructuring Assignment
 Destructuring Assignment is a JavaScript expression that allows to unpack
values from arrays, or properties from objects, into distinct variables data
can be extracted from arrays, objects, nested objects and assigning to
variables

Akash Technolabs www.akashsir.com


Example 1 : Without ES6

Akash Technolabs www.akashsir.com


Example 1 : With ES6 ( Object Destructuring)

Akash Technolabs www.akashsir.com


Example 2 : With ES6 ( Array Destructuring)

Akash Technolabs www.akashsir.com


Array destructuring and Rest operator

var colors = ["Red","Green","Yellow","Violet","Indigo","Blue"];

//Destructuring Assignment
var [a,b,...args] = colors;

console.log(a); // Red
console.log(b); // Green
console.log(args); // [ 'Yellow', 'Violet', 'Indigo', 'Blue']

Akash Technolabs www.akashsir.com


JavaScript Default
Parameters

Akash Technolabs www.akashsir.com


JavaScript Default Parameters
 The concept of default parameters is a new feature introduced in the ES6
version of JavaScript. This allows us to give default values to function
parameters.

Akash Technolabs www.akashsir.com


Example 1: Passing Parameter as Default Values

function sum(x = 1, y = x, z = x + y) {
console.log( x + y + z );
}
sum(); // 4

Akash Technolabs www.akashsir.com


Get Exclusive
Video Tutorials

www.aptutorials.com
https://www.youtube.com/user/Akashtips
www.akashsir.com
Rating Us Now

Just Dial
https://www.justdial.com/Ahmedabad/Akash-Technolabs-
Navrangpura-Bus-Stop-Navrangpura/079PXX79-XX79-
170615221520-S5C4_BZDET

Sulekha
https://www.sulekha.com/akash-technolabs-navrangpura-
ahmedabad-contact-address/ahmedabad
Connect With Me
# Social Info

Akash.padhiyar
Akashpadhiyar
Akash Padhiyar
#AkashSir Akash_padhiyar

+91 99786-21654

www.akashsir.com
www.akashtechnolabs.com #Akashpadhiyar
www.akashpadhiyar.com #aptutorials
www.aptutorials.com

You might also like