js 中面向对象的多态

Posted 2020-09-07 希望是附丽于存在的，有存在便有希望，有希望便是光明!

什么是多态：

　　实际上是不同对象作用与同一操作产生不同的效果。多态的思想实际上是把“想做什么”和“谁去做“分开，多态的好处是什么呢？为什么要多态？我们来看看

Martin Fowler 在《重构:改善既有代码的设计》里写到: 

　 多态的最根本好处在于，你不必再向对象询问“你是什么类型”而后根据得到的答 案调用对象的某个行为——你只管调用该行为就是了，其他的一切多态机制都会为你安 排妥当。 换句话说，多态最根本的作用就是通过把过程化的条件分支语句转化为对象的多态性，从而 消除这些条件分支语句 。、

假设我们要编写一个地图应用，现在有两家可选的地图 API 提供商供我们接入自己的应用。 就像我们介入一个地图APi的调用

var googleMap = {
    show: function () {
        console.log(‘开始渲染谷歌地图‘);
    }
};

var renderMap = function () {
    googleMap.show();

};
renderMap(); // 输出:开始渲染谷歌地图 
由于某些原因，我们要换一下其他的API接口，为了让 renderMap 函数保持一定的弹性， 我们用一些条件分支来让 renderMap 函数同时支持两种地图的接口:

var googleMap = {
    show: function () {
        console.log(‘开始渲染谷歌地图‘);
    }
};
var bdMap = {
    show: function () {
        console.log(‘开始渲染百度地图‘);
    }
};
var renderMap = function (type) {
    if (type === ‘google‘) {
        googleMap.show();
    } else if (type === ‘bd‘) {
        dbMap.show();
    }
};
renderMap(‘google‘); // 输出:开始渲染谷歌地图 renderMap( ‘baidu‘ ); // 输出:开始渲染百度地图

可以看到，虽然 renderMap 函数目前保持了一定的弹性，但这种弹性是很脆弱的，一旦需要 替换成其他的地图接口，那无疑必须得改动 renderMap 函数，继续往里面堆砌条件分支语句。  我们还是先把程序中相同的部分抽象出来，那就是显示某个地图:

var renderMap = function( map ){
    if ( map.show instanceof Function ){
        map.show(); }
};
renderMap( googleMap ); // 输出:开始渲染谷歌地图 
renderMap( bdMap ); // 输出:开始渲染百度地图

现在来找找这段代码中的多态性。当我们向两种地图对象分别发出“展示地 图”的消息时，会分别调用它们的 show 方法，就会产生各自不同的执行结果。对象的多态性提示我们，“做什么”和“怎么去做”是可以分开的，即使以后增加了其他地图，renderMap 函数仍 然不需要做任何改变，如下所示: 

var sosoMap = {
    show: function(){
        console.log( ‘开始渲染搜搜地图‘ );
    }
renderMap( sosoMap ); // 输出:开始渲染搜搜地图