???<script type="text/javascript">
????????????//父級函數(shù)Box
????????????function Box(name,age,home){
????????????????//實(shí)例屬性
????????????????this.name=name;
????????????????this.age=age;
????????????????this.home=home;
????????????????//實(shí)例方法
????????????????this.say = function(){
????????????????????return this.home+" "+"繼承調(diào)用Box中的實(shí)例方法";
????????????????}
????????????}
????????????//Box的原型對象方法
????????????Box.prototype.run = function(){
????????????????console.log(this.name + "回家了");
????????????????//return this.name + "回家了";
????????????}
????????????//實(shí)例對象
????????????var b = new Box("tom",17,"北京");
????????????console.log(b);//box?{name: "tom", age: 17, home: "北京"}
????????????console.log(b.say());//繼承調(diào)用Box中的實(shí)例方法
????????????b.run();//tom回家了
????????????//console.log(b.run());//tom回家了
//-----------------繼承方式一:通過改變父類的執(zhí)行環(huán)境-------------------------------------------------------------
????????????//子集函數(shù)
????????????function Pox(name,age,home){
????????????????this.parent = Box;//將父級Box的代碼賦予子集中的一個(gè)屬性this.parent抠藕,相當(dāng)于Pox有了Box里的屬性和方法
????????????????this.parent("tom",17,"北京");//將實(shí)參傳遞到Box里面似舵,然后執(zhí)行其功能
????????????????delete this.parent;//在Pox函數(shù)中,刪除this.parent,保留Box的代碼
????????????}
????????????var p = new Pox();
????????????//p.run();//p.run is not a function 不能繼承父級原型對象下的方法,
????????????console.log(p);//Pox?{name: "tom", age: 17, home: "北京"}
????????????console.log(p.name);//tom
????????????console.log(p.home);//北京
????????????console.log(p.say());//繼承調(diào)用Box中的實(shí)例方法
//-----------------繼承方式二横辆,通過call繼承---缺點(diǎn):不能繼承調(diào)用父類原型對象方法--------------------------------------------------------------------------
????????????//子集函數(shù)
????????????function Cox(name,age,home,adress){
????????????????Box.call(this,name,age,home,adress);//this是為了改變父級中實(shí)例屬性的指向,讓其指向子集
????????????????this.adress = adress;
????????????}
????????????var c = new Cox("tom",17,"北京","十八路二巷");
????????????console.log(c);//Cox?{name: "tom", age: 17, home: "北京", adress: "十八路二巷"}
????????????console.log(c.age);//17
????????????console.log(c.say());//繼承調(diào)用Box中的實(shí)例方法
????????????//c.run();//c.run is not a function? 不能繼承調(diào)用父類原型對象的方法
//-----------------繼承方式三咖摹,通過apply繼承---缺點(diǎn):不能繼承調(diào)用父類原型對象方法--------------------
????????????//子集函數(shù)
????????????function Fox(name,age,home,email){
????????????????this.email = email;
????????????????//this是為了改變父級中實(shí)例屬性的指向糠悯,讓其指向子集
????????????????Box.apply(this,[name,age,home,email]);//apply傳遞參數(shù)以數(shù)組的形式傳遞
????????????}
????????????var f = new Fox("tom",17,"北京","123@.com");
????????????console.log(f);//Fox?{email: "123@.com", name: "tom", age: 17, home: "北京"}
????????????console.log(f.name)//tom
????????????console.log(f.say());//繼承調(diào)用Box中的實(shí)例方法
????????????//f.run();//f.run is not a function 不能繼承調(diào)用父類原型對象方法
//-----------------繼承方式四--原型鏈繼承----------------------------------------------------------------------------?-???????????
????????????//原理:讓子類的原型對象指向父類的實(shí)例化對象
????????????function Tox(name,age,home){};
????????????Tox.prototype = new Box();//讓子類的原型對象指向父類的實(shí)例化對象
????????????var t = new Tox("tom",17,"北京");//子類傳參無法改變父類的屬性值
????????????console.log(t);//Tox?{}
????????????console.log(t.home);//undefined
????????????console.log(t.age);//undefind
????????????console.log(t.say());//繼承調(diào)用Box中的實(shí)例方法
????????????//原型鏈繼承 缺點(diǎn):
????????????//1.對象父類中通過傳參的實(shí)例屬性,在利用原型鏈方式繼承時(shí)盏道,子類無法通過傳參的方式改變父類的屬性值稍浆。
????????????//2.如果在父類中有引用類型的屬性,會被共享猜嘱,一個(gè)改動衅枫,全部改動。
//-----------------.繼承方式五--混合(組合)繼承(解決以上缺點(diǎn)問題)----------------------------------------
????????????//call或apply繼承方法+原型鏈繼承方法綜合
????????????function Mox(name,age,home){//call或apply繼承方法
????????????????Box.call(this,name,age,home);
????????????}
????????????Mox.prototype = new Box();//原型鏈繼承
????????????var m = new Mox("tom",17,"北京");
????????????console.log(m);//Mox?{name: "tom", age: 17, home: "北京", say: ?}
????????????console.log(m.home);//北京
????????????console.log(m.say());//繼承調(diào)用Box中的實(shí)例方法
????????????m.run();//tom回家了? 可以繼承調(diào)用父類原型對象方法
????????????//問題:
????????????//父類執(zhí)行了兩次
????????????//子類原型下多了一些多余的屬性和方法(原父類的實(shí)例屬性和方法)
//-----------------寄生組合繼承(解決混合繼承的問題)---------------------------------------------------------------
????????????//原理
????????????function Nox(name,age,home){
????????????????Box.apply(this,[name,age,home]);//this改變指向朗伶,使父類中的實(shí)例屬性和方法指向子類
????????????}
????????????//封裝一個(gè)函數(shù)
????????????//supType表示父類
????????????//subType表示子類
????????????function fn(supType,subType){
????????????????var proto = Object.create(supType.prototype);
????????????????//proto下有一個(gè)constructor弦撩,這個(gè)constructor原來指向父類supType
????????????????proto.constructor = subType;//將constructor的指向修改為supType
????????????????subType.prototype = proto;//將修改后的對象全部賦值給子類
????????????}
????????????//調(diào)用函數(shù)
????????????fn(Box,Nox);
????????????var n = new Nox("tom",17,"北京");
????????????console.log(n);//Nox?{name: "tom", age: 17, home: "北京", say: ?}
????????????console.log(n.age);//17
//-------------------ES6繼承--關(guān)鍵字:extends和super---------------------------------------------------------------
????????????class Father{
????????????????constructor(name,age,adress){//實(shí)例屬性寫在constructor里面
????????????????????this.name = name;
????????????????????this.age = age;
????????????????????this.adress = adress;
????????????????}
????????????????eat(){
????????????????????return this.adress + "在中國";
????????????????}
????????????}
????????????//Son繼承Father
????????????class Son extends Father{
????????????????constructor(name,age,adress,phone){//實(shí)例屬性寫在constructor里面
????????????????????super(name,age,adress);//繼承Father中constructor的屬性,繼承的屬性寫在super的括號內(nèi)
????????????????????//super(name,age);
????????????????????this.phone = phone;
????????????????}
????????????????fn(){
????????????????????return this.phone + "是我的電話號碼";
????????????????}
????????????}
????????????var sun = new Son("張三",50,"深圳","15727656869");
????????????console.log(sun);
????????????console.log(sun.name);//張三
????????????console.log(sun.fn());//15727656869是我的電話號碼
????????????console.log(sun.eat());//深圳在中國
????????</script>