三、繼承
1、繼承是面向對象(OO)語言中的一個概念塘砸,許多面向對象語言都支持兩種繼承方式:接口繼承和實現(xiàn)
繼承。而ECMAScript中只支持實現(xiàn)繼承巢块,而且其現(xiàn)實繼承主要依靠原型鏈來實現(xiàn)的礁阁。
2、調(diào)用call和apply函數(shù)來實現(xiàn)繼承
<script type="text/javascript">
//函數(shù)的調(diào)用方法:既可以使用函數(shù)名+小括號的形式調(diào)用也可以使用函數(shù)名+call()的形式調(diào)用
function hello(a,b,c){
console.log(this);
console.log(a);
console.log(b);
console.log(c);
}
//hello();
//hello.call ();
//兩種調(diào)用方式的區(qū)別:
// 小括號調(diào)用:如果向小括號中傳參數(shù)族奢,則該參數(shù)一定是函數(shù)所需的參數(shù)
//call()調(diào)用:如果向call的小括號中傳參姥闭, 則參數(shù)一定是一個對象,call會把所調(diào)函數(shù)中的this指針指
到該參數(shù)上越走;
var per={
name:'xiaoXuan',
age:24
}
hello(per,'12',34);
hello.call(per,per,'12',34);
hello.apply(per,[per,'12',34]);
</script>
3棚品、原型實現(xiàn)繼承
<script type="text/javascript">
function CreateAnimal(name,age){
this.name=name;
this.age=age;
}
function CreatePerson(name,age,gender){
this.gender=gender;
}
CreatePerson.prototype=new CreateAnimal('zhangsan',100);
CreatePerson.prototype.constructor=CreatePerson;
var per=new CreatePerson('zhangsan',100,'man');
console.log(per);
</script>
4、組合繼承
<script type="text/javascript">
// 使用call/apply實現(xiàn)對實例屬性的繼承
// 使用原型實現(xiàn)對原型方法的繼承
function CreateAnimal(name, age) {
this.name = name;
this.age = age;
}
CreateAnimal.prototype.sayHi = function () {
alert('hello');
}
function CreatePerson(name, age, gender) {
CreateAnimal.call(this, name, age);
this.gender = gender;
}
CreatePerson.prototype = new CreateAnimal();
CreatePerson.prototype.constructor = CreatePerson;
CreatePerson.prototype.eatFood = function () {
alert('吃飯了');
}
var per = new CreatePerson('xiaoQuan', 18, 'man');
// console.log(per.gender);
per.eatFood();
</script>
5廊敌、冒充繼承
<script type="text/javascript">
function CreateAnimal(name, age) {
this.name = name;
this.age = age;
}
CreateAnimal.prototype.sayHi = function () {
alert('hello');
}
function CreatePerson(name, age, gender) {
// 1铜跑、讓父級構造函數(shù)作為自己對象的方法
this.newFn = CreateAnimal;
// 2、使用this調(diào)用該方法:需要讓方法中的指針指向per對象
this.newFn(name, age);
// 3骡澈、把臨時添加的方法刪掉
delete this.newFn;
this.gender = gender;
}
var per = new CreatePerson('xiaoQuan', 18, 'man');
console.log(per);
per.sayHi();
</script>