 |
HTML頁面：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Object-Oriented JavaScript</title>
<script src="Person.js"></script>
<script src="Student.js"></script>
<script>
function main() {
Person.showCount();
var person1 = new Person("Alice", "Green");
person1.age = 45;
person1.sayHello();
person1.walk();
Person.showCount();
var person2 = new Person("Bob", "Green");
person2.age = 32;
person2.sayHello();
person2.walk();
Person.showCount();
var student1 = new Student("Janet", "Green", "Applied Physics");
student1.age = 17;
student1.sayHello();
student1.walk();
student1.sayGoodBye();
Person.showCount();
}
</script>
</head>
<body onload="main()">
</body>
</html>
|
|
|
Person.js:
/* Constructor */
/* 構造函數 */
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
Person.count++;
}
/* Properties */
/* 屬性 */
Person.prototype.firstName = "";
Person.prototype.lastName = "";
Person.prototype.age = 0;
/* Methods */
/* 方法 */
Person.prototype.getFullName = function() {
var fullName = this.firstName;
if (this.lastName != "") {
fullName += " " + this.lastName;
}
return fullName;
}
Person.prototype.sayHello = function() {
var ageStr = this.age + " year";
if (this.age > 1) {
ageStr += "s";
}
console.log("Hello, I'm " + this.getFullName() + ".\nI'm " + ageStr + " old now.");
}
Person.prototype.walk = function() {
console.log(this.getFullName() + " is walking!");
}
/* Static Properties */
/* 靜態屬性 */
Person.count = 0;
/* Static Methods */
/* 靜態方法 */
Person.showCount = function() {
if (this.count == 1) {
console.log("There is 1 person.");
} else if (this.count == 0) {
console.log("There are no people.");
} else {
console.log("There are " + this.count + " people now.");
}
}
|
|
|
Student.js:
function Student(firstName, lastName, subject) {
Person.call(this, firstName, lastName); // call the parent constructor
this.subject = subject;
}
Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;
/* Properties */
Student.prototype.subject = "";
/* Methods */
Student.prototype.sayHello = function() {
Person.prototype.sayHello.call(this); // call the parent sayHello()
console.log("I'm studying " + this.subject + ".");
}
Student.prototype.sayGoodBye = function() {
console.log("Goodbye!");
}
|
|
|
類的結構相當於：
<?php
abstract class Person {
public static $count;
public $firstName;
public $lastName;
public $age;
abstract public static function showCount();
abstract public function getFullName();
abstract public function sayHello();
abstract public function walk();
}
abstract class Student extends Person {
public $subject;
public function sayHello() { // Override
}
abstract public function sayGoodBye();
}
?>
（以上所有的abstract都是我加上的，否則這個PHP文件就是錯誤的）
|
|
|
輸出內容：
There are no people.
Person.js (line 47)
Hello, I'm Alice Green.
I'm 45 years old now.
Person.js (line 30)
Alice Green is walking!
Person.js (line 34)
There is 1 person.
Person.js (line 45)
Hello, I'm Bob Green.
I'm 32 years old now.
Person.js (line 30)
Bob Green is walking!
Person.js (line 34)
There are 2 people now.
Person.js (line 49)
Hello, I'm Janet Green.
I'm 17 years old now.
Person.js (line 30)
I'm studying Applied Physics.
Student.js (line 15)
Janet Green is walking!
Person.js (line 34)
Goodbye!
Student.js (line 19)
There are 3 people now.
Person.js (line 49)
|
|
|
|
|
|
|
