13_User_Defined_Objects.pptx objects in javascript

Objects in javascript

1. USER DEFINED OBJECTS IN JAVASCRIPT

2. Objects In JavaScript Before learning about objects , we must first understand a very important statement which is very commonly used for JavaScript Javascript is not a class based language but a prototype based language .

3. What Is Class Based Language? A class-based language is based on two fundamental entities : “ classes ” and “ instances ”. Class: A class is a user-defined data type . It describes a family of objects that have the same set of methods and properties . For example , the Employee class could represent the set of all employees . Languages like Java , C++,Python etc are all class based languages

4. What Is Class Based Language? Instance: An instance , is the instantiation of a class . For example , Sachin could be an instance of the Employee class, representing a particular individual as an employee An instance has exactly the same properties as its class (no more, no less).

5. What Is Prototype Based Language? A prototype-based language , such as JavaScript , does not make this distinction : it simply has objects . In simple words we can say that creating a class is not required in prototype based languages before creating an object . A prototype-based language has the notion of a prototypical object

6. What Is Prototype Based Language? A prototypical object is used as a template from which we get the initial properties for a new object . And in JavaScript this prototypical object is called Object which provides all the basic properties and methods like toString () , valueOf () to new objects Then these new objects can further specify their own properties , either when we create them or at run time .

7. Objects In JavaScript In JavaScript an object is a non-primitive data type . It is like any other variable , the only difference is that an object holds data in terms of properties and actions in terms of methods .

8. An Important Point ! In other programming languages like Java or C# , we need a class to create an object of it. In JavaScript , an object is a standalone entity because designing class is not compulsory to create objects in JavaScript . However from ES6 onwards we can create a class if we want that.

9. Creating Objects In JavaScript , an object can be created in two ways: Using Object Literal Using Object Constructor

10. Object Constructor The first way to create an object is with Object Constructor using the new  keyword. Syntax: let < obj_name >=new Object(); Example: let myCar =new Object() ;

11. Adding Properties Properties are data members of an object used to hold values . We can attach properties to an object in 2 ways : Using the dot notation . Using [ ] brackets and specifying property name as string .

12. Adding Properties Using Dot Operator Using the dot notation. Syntax: < obj_name >.< property_name >=value; Example: myCar . name =“ Baleno ”; myCar . year =2018;

13. Adding Properties Using [ ] Operator Using the [ ] operator. Syntax: < obj_name >[“< property_name >”]=value; Example: myCar [“name”] =“ Baleno ”; myCar [“year”] =2018;

14. Which To Prefer When ? As a beginner we might get confused between when to use dot notation and when to use [ ] . The answer is very simple : Always use dot notation as its is the best and recommended way But there are 2 cases when we will have to use [ ] and they are: When property name contains spaces . When property name is stored in a variable .

15. Special Point ! When a property name contains spaces , we need to create it using [ ] and to access it also we have to use [ ] . For example: myCar [“ reg no”] =“MP04CB2314”; console.log( myCar [“ reg no”] ); If we use dot operator it will be an error

16. Special Point ! When a property name is stored in a variable , we need to create as well as access it we need use [ ] For example: var str=“company”; console.log( myCar [str] ); // will show Maruti console.log( myCar.str ); // will show undefined

17. Special Point ! Reading from a property that does not exist will result in an  undefined . For example: console.log( myCar . price ); // undefined

18. Changing Property Value To change the value of a property , we simply use the assignment operator Example: myCar [“name”] =“ Baleno ”; myCar [“year”] =2018; myCar [“name”] =“ Ciaz ”; console.log( myCar . name ); // Ciaz console.log( myCar . year ); // 2018

19. Deleting A Property To delete a property from an object , we use the  delete  operator: Example: myCar [“name”] =“ Baleno ”; myCar [“year”] =2018; delete myCar . year ; console.log( myCar . name ); // Baleno console.log( myCar . year ); // undefined

20. Checking Whether A Property Exists Or Not To check if a property does exists in an object , we use a special operator called the in operator: Example: myCar [“name”] =“ Baleno ”; myCar [“year”] =2018; delete myCar . year ; console.log( ‘name’ in myCar ); // true console.log(‘ year’ in myCar ); // false

21. Iterating Over Properties To iterate over all properties of an object without knowing property names , we use the  for...in  loop: Syntax: for (key in object) { // executes the body for each key among object properties } Example: myCar [“name”] =“ Baleno ”; myCar [“year”] =2018; for (let key in myCar ) console.log( myCar [key] );

22. Adding Methods Methods can also be added to the object A method is nothing but a function that will access / manipulate object’s properties . Methods can be part of object during creation or can be added later like properties

23. Adding Methods Syntax: < obj_name >[“< func_name >”]=function(){ // body }; Example: myCar [“start”] = function() { console.log(“starting the car”); }; myCar . start () ; // starting the car

24. Adding Methods Syntax: < obj_name >. func_name >=function(){ // body }; Example: myCar . start = function() { console.log(“starting the car”); }; myCar . start () ; // starting the car

25. Nested Objects We can assign another object as a property of an object . Syntax: < obj_name >.< obj_name >=new Object(); < obj_name >.< obj_name >.< property_name >=<value>; Example: myCar . stereo =new Object() ; myCar . stereo . name =“Sony";

26. PROGRAM Write a JavaScript code to access all the properties of myCar objects and it’s nested object using for in loop

27. Creating Object Using Object Literal The object literal is a simple way of creating an object and it is done using { } brackets. We can include key-value pair in { } , where key would be property or method name and value will be value of property or definition of the method. We use comma (,) to separate multiple key-value pairs.

28. Creating Object Using Object Literal Syntax: let < obj_name > ={ < prop_name >:< value >, < prop_name >:< value > }; Example: let myCar ={ company : ”Maruti ” , year : 2014 };

29. Adding Method Using Object Literal Syntax: let < obj_name > ={ < func_name >: function(){ // body } }; Example: let myCar ={ start : function (){ console.log(“starting the car”); } };

30. PROGRAM Given the following object , write a for in loop to calculate and print total marks let  student  = {  name : " Sumit“, age : 15,  phy : 45, chem : 50,              maths : 65         };