Download
1 / 16
190 likes | 359 Views
M. Taimoor Khan taimoorkhan@ciit-attock.edu.pk. Javascript Objects. Javascript Objects. Every data-type defined in Javascript is an object It has a class definition for it, unlike the basic data types
E N D
M. Taimoor Khan taimoorkhan@ciit-attock.edu.pk Javascript Objects
Javascript Objects • Every data-type defined in Javascript is an object • It has a class definition for it, unlike the basic data types • It allows the variables (objects) to make use of the built-in properties and functions defined for them • For example Number, String, Date, Array etc
User defined objects • Along with the built-in object types, the users can also define their own type of objects. • They are defined with some data members and member functions • Unlike classes in other programming languages, each object has to be re-defined with their own set of attributes and behavior • However, an object can be assigned to another object to get the same structure and values
Example <script type=“text/javascript”> var person=new Object();person.firstname="John";person.lastname="Doe";person.age=50;person.eyecolor="blue"; </script>
Creating objects with constructor <script type=“text/javascript”> function person(firstname, lastname, age, eyecolor) { this.firstname = firstname; this.lastname = lastname; this.age = age; this.eyecolor = eyecolor; } //Creating objects of type person var p1 = new person(“John”, “Doe”, 50, “blue”); var p2 = new person(“Sally”, “Rally”, 48, “green”); </script>
Adding Member Functions <script type=“text/javascript”> function person(firstname,lastname,age,eyecolor){this.firstname=firstname;this.lastname=lastname;this.age=age;this.eyecolor=eyecolor;this.changeName=changeName;function changeName(name){this.lastname=name;} } p1 = new person(“John”, “Doe”, 50, “blue”); //The member function changeName() changes the lastname of the object person p1.changeName(“David”); </script>
Arrays <script type=“text/javascript”> varmyCars=new Array("Saab","Volvo","BMW"); //array data members var total = myCars.length; //member functions to get index of value vary=myCars.indexOf("Volvo"); //if the given value is a number or has alphabets if(isNaN(myCars[1])); //convert array items into a comma separated string varallCars = myCars.join(); document.write(“<p>” + allCars + “</p>”); </script>
<script type=“text/javascript”> varmyCars=new Array("Saab","Volvo","BMW"); //push an item at the end of the array myCars.push(“Toyota”); //Pop an item from the end of an array myCars.pop(); //remove an item from the start of the array myCars.shift(); //convert array items into a comma separated string varallCars = myCars.join(); document.write(“<p>” + allCars + “</p>”); //js use + to concate </script>
<script type=“text/javascript”> varmyCars=new Array("Saab","Volvo","BMW"); varotherCars = new Array(“Toyota”, “Honda”, “Suzuki”); // concate two arrays into one vartotalCars = myCars.concate(otherCars); //reverse the order of the elements in the array myCars.reverse(); //get second and third items from the array varmoreCars = myCars.slice(1,3); //sort the array alphabetically myCars.sort(); </script>
<script type=“text/javascript”> varmyCars=new Array("Saab","Volvo","BMW"); // add more items into the array myCars.splice(2,0,“Ford",“Nissan"); //get a comma separated string of array items var cars = myCars.toString(); </script>
Date object <script type=“text/javascript”> //instantiating date type objects varcurrDate = new Date(); varsomeDate = new Date(milliseconds) //since 1970/01/01 varotherDate = new Date (“2014/02/28”); //date string varanotherDate = new Date(year, month, day, hours, mins, seconds, milliseconds); //Date objects can be compared using relational operators <,>,= etc. </script>
Date member functions <script type=“text/javascript”> VarmyDate = new Date(); document.write(myDate.getFullYear); document.write(myDate.getTime); document.write(myDate.getDay); </script>
Math Object <script type=“text/javascript”> //Math object has data members and member functions for mathematical relations document.write(“<p>”+ Math.PI + “</p>”); //Note: Javascript is case-sensitive math.pi is not the same as Math.PI document.write(“<p>”+Math.round(2.39)+“</p>”); //generates a random number between 0 and 1 document.write(“<p>”+Math.random()+“</p>”); //Get Maximum Value Document.write(“<p>”+Math.max(5,10,15,2,43,16) + “</p>”); //Get Minimum Value document.write(“<p>”+Math.min(5,10,15,2,43,16) + “</p>”); //Get Square root Document.write(“<p>”+Math.sqrt(16) + </p>”); </script>
String Objects <script type=“text/javascript”> var venue = “attock”; //get a character at the given index document.write(“<p>”+venue[3]+”</p>”); //length of string document.write(“<p>”+venue.length+”</p>”); varind = venue.indexOf(“t”); //index of characters match first found var ind2 = venue.lastIndexOf(“t”); //index of characters match last found var word = venue.match(“ock”); //returns the match term if found or null venue.replace(“oc”, “zz”); //replace characters in 1st parameters with 2nd venue.toUpperCase(); //convert string to upper case venue.toLowerCase(); //convert string to lower case </script>
<script type=“text/javascript> //convert the string to array splitting on given term var venues = “attock:wah:islamabad:lahore”; varallVenues = venues.split(“:”); </script> //Other String functions charAt(), concat(), search(), slice(), substr(), substring(), trim(), valueOf()
