版權聲明：本文為部落客原創文章，未經部落客允許不得轉載。更多學習資料請通路我愛科技論壇:www.52tech.tech https://blog.csdn.net/m0_37981569/article/details/79547464
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript面向對象知識複習</title>
</head>
<body>
<h2></h2>
<script type="text/javascript">
/************************************************類，成員屬性，成員方法******************************************************/
/**
* 定義一個類
* @param name
* @param age
* @constructor
*/
function MyClass(name, age) {
this.name = name;
this.age = age;
// 成員方法
this.toString = function () {
alert(cls1.name+":"+cls1.age);
};
};
/**
* 執行個體化一個cls1對象
* @type {MyClass}
*/
var cls1 = new MyClass("xiugang", 15);
//alert(cls1.name+":"+cls1.age);
cls1.toString();
// 再給這個類的一個對象cls2添加一個方法
var cls2 = new MyClass("zhangsan", 25);
cls2.ShowName = function () {
alert(this.name+":"+this.age);
};
cls2.ShowName();
// 使用Prototype對象來給函數添加方法
function Animal(name, age) {
this.name = name;
this.age = age;
}
Animal.prototype.toString = function () {
alert(this.name+":"+this.age);
};
// 執行個體化兩個對象
var dog = new Animal("dog", 15);
dog.toString();
var cat = new Animal("cat", 16);
cat.toString();
// 利用prototype屬性給一個類添加多個方法
function Person(name, age) {
this.name = name;
this.age = age;
};
Person.prototype = {
toString : function () {
alert(this.name+":"+this.age);
},
sayHello : function () {
alert("say Hello!");
}
};
var student = new Person("小明", 25);
student.sayHello();
student.toString();
/************************************************靜态類******************************************************/
var StaticClass = function () {
}
StaticClass.name = "StaticClass";
StaticClass.Sum = function (value1, value2) {
return value1 + value2;
};
alert(StaticClass.name+", "+StaticClass.Sum(10, 20));
/************************************************繼承******************************************************/
function PeopleClass() {
this.type = "People";
};
PeopleClass.prototype = {
getType : function () {
alert("This is a Person");
}
};
function StudentClass(name, sex) {
// 使用apply方法将父類對象的構造函數綁定到子類對象上
PeopleClass.apply(this, arguments);
this.name = name;
this.sex = sex;
}
var stu = new StudentClass("小紅", "女");
alert(stu.type); // 實作了屬性的繼承
/**
* 實作方法的繼承
*/
function Sophermore(name, sex) {
PeopleClass.apply(this, arguments);
// 實作父類方法的繼承
/**
* 實作思路： 需要循環将父類對象的prototype進行指派， 即可達到繼承的目的
*/
var prop;
for (prop in PeopleClass.prototype){
var proto = this.constructor.prototype;
if (!proto[prop]){
proto[prop] = PeopleClass.prototype[prop];
}
proto[prop]["super"] = PeopleClass.prototype;
}
this.name = name;
this.sex = sex;
}
var stu2 = new Sophermore("xiuxiu", 22);
alert(stu2.type);
stu2.getType()
/**
* 方法二：實作繼承的第二種方法， 使用對象冒充的方法
*/
function AnimalNew(name, age) {
this.name = name;
this.age = age;
this.Sum = function () {
alert(this.name+","+this.age);
}
}
// 成員方法
/*AnimalNew.prototype = {
sayhello : function () {
alert(this.name+"is saying Hello!");
},
sayAge : function () {
alert(this.name+"'s age is "+this.age);
}
}*/
AnimalNew.prototype.sayHello = function () {
alert(this.name+" is saying Haha!");
}
// 子類開始實作繼承
function Duck(name, age) {
this.animal = AnimalNew;
this.animal(name, age);
}
var duck = new Duck("鴨子", 12);
//duck.sayHello(); //error!
//duck.sayAge(); //error!
//duck.sayHello(); //error!
duck.Sum(); //ok的！
/************************************************JavaScript繼承知識加強******************************************************/
function Animal(name) {
// 屬性
this.name = name;
//執行個體方法
this.sleep = function () {
console.log(this.name+"正在睡覺！");
}
}
// 原型方法
Animal.prototype.eat = function (food) {
console.log(this.name+"正在吃"+food);
}
/**
* 方法一： 将父類的執行個體作為子類的原型, 可以同時實作父類的屬性和方法的繼承
*/
function Cat() {
}
Cat.prototype = new Animal();
Cat.prototype.name = "cat";
// test
var cat =new Cat();
console.log(cat.name);
cat.sleep()
cat.eat("fish");
console.log(cat instanceof Animal);
console.log(cat instanceof Cat);
/**
* 方法二： 組合繼承
* 通過調用父類構造，繼承父類的屬性并保留傳參的優點，然後通過将父類執行個體作為子類原型，實作函數複用
*/
function Cow(name) {
Animal.call(this);
this.name = name;
}
Cow.prototype = new Animal();
Cow.prototype.constructor = Cat;
var cow = new Cow("小牛部落格");
console.log(cow.name);
console.log(cow.sleep());
console.log(cat instanceof Animal);
console.log(cat instanceof Cat);
// 利用方法二：組合繼承實作繼承的綜合案例
function Family(name, age) {
// 屬性
this.name = name;
this.age = age;
// 執行個體方法
this.Member = function () {
alert("This family is having 5 memnbers now!");
}
};
// 原型方法
Family.prototype = {
sayHello : function () {
alert(this.name +" is saying hello!");
},
sayAge : function () {
alert(this.name +" is saying age:"+this.age);
}
};
// 開始實作繼承
function Son(name, age) {
Family.call(this);
this.name = name;
this.age = age;
}
Son.prototype = new Family();
Son.prototype.constructor = Family;
// 開始測試
var son = new Son("王老大", 15);
alert(son.age+", "+son.age);
son.sayAge();
son.sayHello();
alert(son instanceof Family);
alert(son instanceof Son);
</script>
</body>
</html> ![27. Remove Element(清單)題目代碼[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)