Javascript設計模式 - 原文連結

介面卡模式 （Adapter） :

語言 : JavaScript

以一個遊戲主角為例 , 剛開始主角只有(普通攻擊)和一個技能(重擊) .

//主角
var Character = cc.Class.extend({
    Attack : function(){
        console.log("普通攻擊");
    },

    Skill : function(){
        console.log("重擊");
    }
});
var character = new Character();
character.Attack();   //普通攻擊
character.Skill();    //重擊

當主角到達一定等級 , 轉職成了法師 , 攻擊方法發生改變 , 普通攻擊變成了 (火球) , 技能成了(火雨) . 但是程式碼中主角的攻擊和技能已經寫死了 , 這時候再呼叫 Attack() 和 Skill() 方法肯定會報錯 , 遇到這種情況就需要使用介面卡模式了 .

//主角
var Character = cc.Class.extend({
    FireBall : function(){
        console.log("火球");
    },

    FireRain : function(){
        console.log("火雨");
    }
});
var character = new Character();  
character.Attack();    // 報錯  !!!
character.Skill();     // 報錯  !!!

繼承實現 :

通過繼承的方式 , 可以使得原始碼不改變的情況下可以呼叫新的方法(技能) .

//介面卡
var Adapter = Character.extend({
    Attack : function(){
        this.FireBall();
    },

    Skill : function(){
        this.FireRain();
    }
});

var character = new Adapter();
character.Attack();    //火球
character.Skill();     //火雨

委派實現 :

通過委派的方式 , 可以使得原始碼不改變的情況下可以呼叫新的方法(技能) .

//介面卡
var Adapter = cc.Class.extend({
    character : null,
    //建構函式 ctor  
    ctor : function(character){
        this.character = character;
    },

    Attack : function(){
        this.character.FireBall();
    },

    Skill : function(){
        this.character.FireRain();
    }
});

var character = new Adapter(new Character());
character.Attack();    //火球
character.Skill();     //火雨

介面卡模式通常在多人合作的專案中使用較多 , 在多人合作專案中 , 每個人完成自己的模組 , 通常會出現方法名 呼叫以自己習慣的方式命名 , 從而出現對接問題 , 又因為專案中高頻出現 , 不方便修改 , 所以經常使用介面卡 .