Objektno orijentirano JavaVodič za skriptu (OOJS) s primjerom
U čemu je OOPS koncept JavaSkripta?
Mnogo puta varijable ili nizovi nisu dovoljni za simulaciju situacija iz stvarnog života. JavaSkripta vam omogućuje stvaranje objekata koji se ponašaju kao stvarni objekti. Student ili dom mogu biti objekti koji imaju mnogo vlastitih jedinstvenih karakteristika. Možete kreirati svojstva i metode svojih objekata kako biste programiranje učinili lakšim. Ako je vaš objekt student, imat će svojstva poput imena, prezimena, id-a itd. i metode kao što su calculateRank, changeAddress itd. Ako je vaš objekt dom, imat će svojstva poput broja soba, boje boje, lokacije itd. i metode kao što su izračunajPovršinu, promijeniVlasnika itd.
Kako stvoriti objekt
Možete stvoriti objekt poput ovog:
var objName = new Object(); objName.property1 = value1; objName.property2 = value2; objName.method1 = function() { line of code }
OR
var objName= {property1:value1, property2:value2, method1: function() { lines of code} };
Pristup svojstvima i metodama objekta
Svojstvima objekta možete pristupiti ovako:
objectname.propertyname;
Možete pristupiti metodama objekta ovako:
objectname.methodname();
Isprobajte sami ovaj primjer:
<html> <head> <title>Objects!!!</title> <script type="text/javascript"> var student = new Object(); student.fName = "John"; student.lName = "Smith"; student.id = 5; student.markE = 76; student.markM = 99; student.markS = 87; student.calculateAverage = function() { return (student.markE + student.markM + student.markS)/3; }; student.displayDetails = function() { document.write("Student Id: " + student.id + "<br />"); document.write("Name: " + student.fName + " " + student.lName + "<br />"); var avg = student.calculateAverage(); document.write("Average Marks: " + avg); }; student.displayDetails(); </script> </head> <body> </body> </html>
OOPS konstruktor
Ali stvaranje objekata ove vrste nije toliko korisno jer ćete i ovdje morati kreirati različite objekte za različite učenike. Ovdje se pojavljuje konstruktor objekata. Konstruktor objekata pomaže vam da stvorite tip objekta koji se može ponovno upotrijebiti da zadovolji potrebe pojedinačne instance.
Isprobajte sami ovaj primjer:
<html> <head> <script type="text/javascript"> function Student(first, last, id, english, maths, science) { this.fName = first; this.lName = last; this.id = id; this.markE = english; this.markM = maths; this.markS = science; this.calculateAverage = function() { return (this.markE + this.markM + this.markS)/3; } this.displayDetails = function() { document.write("Student Id: " + this.id + "<br />"); document.write("Name: " + this.fName + " " + this.lName + "<br />"); var avg = this.calculateAverage(); document.write("Average Marks: " + avg + "<br /><br />"); } } var st1 = new Student("John", "Smith", 15, 85, 79, 90); var st2 = new Student("Hannah", "Turner", 23, 75, 80, 82); var st3 = new Student("Kevin", "White", 4, 93, 89, 90); var st4 = new Student("Rose", "Taylor", 11, 55, 63, 45); st1.displayDetails(); st2.displayDetails(); st3.displayDetails(); st4.displayDetails(); </script> </head> <body> </body> </html>
Prođite kroz svojstva objekta
Sintaksa:
for (variablename in objectname) { lines of code to be executed }
Za/u a petlja obično se koristi za prolazak kroz svojstva objekta. Možete dati bilo koje ime za varijabla, ali naziv objekta trebao bi biti isti kao naziv već postojećeg objekta kroz koji trebate proći kroz petlju.
Isprobajte sami ovaj primjer:
<html> <head> <script type="text/javascript"> var employee={first:"John", last:"Doe", department:"Accounts"}; var details = ""; document.write("<b>Using for/in loops </b><br />"); for (var x in employee) { details = x + ": " + employee[x]; document.write(details + "<br />"); } </script> </head> <body> </body> </html>