Zorientowany obiektowo JavaSamouczek skryptu (OOJS) z przykładem
Jamesa Hartmana
W czym jest koncepcja OOPS JavaScenariusz?
W wielu przypadkach zmienne lub tablice nie wystarczą do symulacji rzeczywistych sytuacji. JavaSkrypt pozwala tworzyć obiekty, które działają jak obiekty w prawdziwym życiu. Student lub dom może być obiektem, który ma wiele unikalnych cech. Możesz tworzyć właściwości i metody dla swoich obiektów, aby ułatwić programowanie. Jeśli Twoim obiektem jest student, będzie miał właściwości takie jak imię, nazwisko, identyfikator itp. oraz metody takie jak calculatedRank, changeAddress itp. Jeśli Twoim obiektem jest dom, będzie miał właściwości takie jak liczba pokoi, kolor farby, lokalizacja itp. oraz metody takie jak calculatorArea, changeOwner itp.
Jak utworzyć obiekt
Możesz stworzyć taki obiekt:
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} };
Uzyskaj dostęp do właściwości i metod obiektu
Dostęp do właściwości obiektu można uzyskać w następujący sposób:
objectname.propertyname;
Możesz uzyskać dostęp do metod obiektu takiego jak ten:
objectname.methodname();
Wypróbuj sam ten przykład:
<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>
Konstruktor OOPS
Jednak tworzenie tego rodzaju obiektów nie jest zbyt przydatne, ponieważ tutaj również będziesz musiał tworzyć różne obiekty dla różnych uczniów. Tutaj pojawia się konstruktor obiektów. Konstruktor obiektów pomaga utworzyć typ obiektu, który można ponownie wykorzystać w celu zaspokojenia potrzeb pojedynczej instancji.
Wypróbuj sam ten przykład:
<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>
Pętla przez właściwości obiektu
Składnia:
for (variablename in objectname)
{
lines of code to be executed
}
Dla/w a pętla jest zwykle używany do przeglądania właściwości obiektu. Można nadać dowolną nazwę zmienna, ale nazwa obiektu powinna być taka sama jak nazwa już istniejącego obiektu, przez który należy przejść pętlą.
Wypróbuj sam ten przykład:
<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>
