Js objects

525 views

Published on

OOPs implementation in Javascript by Victor on 7 Jan 2012

Published in: Education, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
525
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Js objects

  1. 1. Javascript Object Oriented ProgrammingTopics to cover JavaScript’s primitive data types What an object is in JavaScript How to create custom objects Object with constructor What an object’s prototype property is  ­ The prototype property allows you to add properties and methods to an  object.    
  2. 2.  Primitive data types Undefined, Null, Boolean, Number, and String.    
  3. 3. An Object An object is a collection of properties Properties can either be primitive data types, other  objects, or functionsSome built­in objects Array Image Date    
  4. 4. Sample usage of in­built objects var Image1 = new Image(); Image1.src = "myDog.gif"; function myFunc(){ } var myObject = new myFunc(); <br> alert(typeof myObject); // displays "object"    
  5. 5. Some more sample usage of  objects function myFunc(){ this.StringValue = "This is a String"; } var myObject = new myFunc(); myObject.StringValue = "This is myObjects string"; var myObject2 = new myFunc(); alert(myObject.StringValue); // displays "This is myObjects string" alert(myObject2.StringValue); // displays "This is a String"    
  6. 6. Sample for constructor function myFunc(StringValue){ this.StringValue = StringValue; } var myObject = new myFunc("This is myObjects string"); var myObject2 = new myFunc("This is a String"); alert(myObject.StringValue); // displays "This is myObjects string" alert(myObject2.StringValue); // displays "This is a String"    
  7. 7. A Simple custom object function Circle(radius){ this.radius = radius; this.getArea = function(){ return (this.radius*this.radius*3.14); } this.getCircumference = function(){ var diameter = this.radius*2; var circumference = diameter*3.14; return circumference; } } var bigCircle = new Circle(100); var smallCircle = new Circle(2); alert(bigCircle.getArea()); // displays 31400 alert(smallCircle.getCircumference()); // displays 12.56    
  8. 8. Creating objects using Literal Notation timObject = { property1 : "Hello", property2 : "MmmMMm", property3 : ["mmm", 2, 3, 6, "kkk"], method1 : function(){alert("Method had been called" + this.property1)} }; timObject.method1(); alert(timObject.property3[2]) // will yield 3 var circle = { x : 0, y : 0, radius: 2 } // another example // nesting is no problem. var rectangle = { upperLeft : { x : 2, y : 2 }, lowerRight : { x : 4, y : 4} } alert(rectangle.upperLeft.x) // will yield 2    
  9. 9. Subclasses and Superclasses function superClass() { this.supertest = superTest; //attach method superTest } function subClass() { this.inheritFrom = superClass; this.inheritFrom(); this.subtest = subTest; //attach method subTest } function superTest() { return "superTest"; } function subTest() { return "subTest"; } var newClass = new subClass(); alert(newClass.subtest()); // yields "subTes alert(newClass.supertest()); // yields "superTest"    

×