Functions and Objects in JavaScript
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Functions and Objects in JavaScript

on

  • 1,662 views

 

Statistics

Views

Total Views
1,662
Views on SlideShare
1,107
Embed Views
555

Actions

Likes
2
Downloads
58
Comments
0

5 Embeds 555

http://debugmode.net 538
http://cloud.feedly.com 13
http://www.newsblur.com 2
http://www.dhananjaykumar.net 1
http://feedreader.com 1

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Functions and Objects in JavaScript Presentation Transcript

  • 1. JavaScript Objects and Functions Dhananjay Kumar [@debug_mode] Delhi Chapter Lead Microsoft MVP Mindcracker MVP Telerik Evangelist http://debugmode.net FB: Dhananjay.25july@gmail.com
  • 2. JavaScript Objects • There are three ways you can create JavaScript Objects JavaScript Objects Using Literals Using New Operator Using Object.Create()
  • 3. JavaScript Objects Using Literals var student = { name: "dj", grade : "z" }; var studentName = student.name; alert(studentName); Object literal is an expression It creates new object each time it appears in the code A single object literal can create many objects in loop
  • 4. JavaScript Objects Using new operator var student = new Object(); var studentArray = new Array(); new operator creates a new object new operator initialize created object also new operator invokes a function as give in above code snippet. Function invoked after new operator is Constructor
  • 5. JavaScript Objects Using Object.Create() var student = Object.create( { name: "dj", grade: 10 } ); It is a static function It always has two parameters • Prototype • Properties
  • 6. JavaScript Objects • There are three ways you can test Properties of JavaScript Objects JavaScript Objects Properties in operator hasOwnProperty() method propertyIsEnumerable() method
  • 7. JavaScript Objects in operator var student = Object.create( { name: "dj", grade: 10 } ); var studentProperty = "name" in student alert(studentProperty); in operator returns true for own property in operator returns false if there is no property with given name in operator returns true for inherited property
  • 8. JavaScript Objects hasOwnProperty() method var student = { name: "dj", grade: 10 }; var studentProperty = student.hasOwnProperty("name"); alert(studentProperty); hasOwnProperty() method returns true for own property hasOwnProperty() method returns false if there is no property with given name hasOwnProperty() method returns false for inherited property
  • 9. JavaScript Objects propertyIsEnumerable () method var student = { name: "dj", grade: 10 }; var studentProperty = student.hasOwnProperty("name"); alert(studentProperty); propertyIsEnumerable () method returns true for own property which is enumerable propertyIsEnumerable () method returns false if there is no property with given name propertyIsEnumerable () method returns false for inherited property
  • 10. JavaScript Objects • Deleting Properties : using delete operator Delete operator returns true if successfully deleted If there is no effect on operation
  • 11. JavaScript Objects Deleting properties var student = { name: "dj", grade: 10 }; var result = delete student.grade; alert(result); var result1 = delete student["grade"]; alert(result1);  It deletes object’s own property  It does not delete inherited property. For example you cannot delete property of student prototype or object it is inheriting from.
  • 12. Associative Array Associative Array : Java Script Array can be worked with string index var arrayofStudent = []; var student1 = []; student1["rollnumber"] = 19; student1["name"] = "John"; student1["grade"] = "A"; arrayofStudent.push(student1); console.log(arrayofStudent[0]["name"]); Associative Array is that we can not traverse through array elements in a loop.
  • 13. JavaScript object as Associative Array var student = { name: "dj", grade: 10 }; for (i = 0; i < 10; i++) { student["marks" + i] = 100 * i; } alert(student.marks8); In Square bracket you provide property name as string. String is data type so can be manipulated at run time. With dot you provide property name as identifier. Since they are not a data type so cannot be manipulated at run time.
  • 14. For-in loop in JavaScript
  • 15. Functions in JavaScript var display_message = function (age) { alert("you are " + age + "year old "); }; display_message(19); JavaScript Functions Named Function Anonymous Function
  • 16. Functions in JavaScript  You can store it in a variable You can pass it as parameter of other function You can use it in an expression
  • 17. Functions in JavaScript Pass by Value var greetingmessage = "Hey DJ"; function showmessage(greetingmessage) { greetingmessage = "I am changing value"; } showmessage(greetingmessage); alert(greetingmessage); Pass By Reference var arrayofname = ["dj"]; function showmessage(arrayofname) { arrayofname[0] = "dhananjay"; } showmessage(arrayofname); alert(arrayofname[0]);
  • 18. Functions in JavaScript Nested Functions mainfunction(7, 6); function mainfunction(a, b) { alert(a); nestedfunction(88); function nestedfunction(c) { alert(b); }; };  Nested function can access variable of parent function  Parent function cannot access variable of nested function
  • 19. Functions in JavaScript Namespace in JavaScript Global if defined outside any function Local to function and all nested function , if defined in function var MyModule = { //code for module here GetData: function () { var student = { name: "dj", grade: 10 }; var nameisobjectofstudent = "toString" in student; alert(nameisobjectofstudent); } };
  • 20. Functions in JavaScript Namespace in JavaScript Global if defined outside any function Local to function and all nested function , if defined in function var MyModule = { //code for module here GetData: function () { var student = { name: "dj", grade: 10 }; var nameisobjectofstudent = "toString" in student; alert(nameisobjectofstudent); } };
  • 21. Functions in JavaScript Namespace in JavaScript Global if defined outside any function Local to function and all nested function , if defined in function var studentObject = { name: "dj", marks: 89, findgrade: function (marks) { if (marks > 75) { return "Grade A "; } else { return "Grade B "; } } } var grade = studentObject.findgrade(99); alert(grade);
  • 22. Functions in JavaScript  It takes a function as argument  It returns a function as output.
  • 23. Functions in JavaScript JavaScript function Does not do any type checking on argument values Does not do any checking on number of arguments passed JavaScript function can be called 1. With exact number of arguments 2. With more number of arguments than specified 3. With less number of arguments than specified
  • 24. Functions in JavaScript Less Number of Arguments
  • 25. Functions in JavaScript Less Number of Arguments
  • 26. Functions in JavaScript Less Number of Arguments Handling undefined
  • 27. Functions in JavaScript More Number of Arguments