JavaScript面向对象之多态

多态(polymorphism = poly(复数) + morph(形态) + ism)的定义：同一操作作用于不同的对象上面，可以产生不同的解释和执行结果。

文字含义很容易理解，但往往在需要使用时却想不起它。真正的想要灵活使用一个设计思想，结合一些通俗易懂的例子或者编码过程中遇见的问题是一个不错的使用方案。

举个例子：
        在电影拍摄现场，当导演喊出action时，猪脚开始背台词，照明师开始打灯光，群众演员躺倒在地，在得到同一个消息时，不同的人拥有不同的行为，每个人都知道自己该干什么，转化到代码中，就是一种多态，如果不使用多态，那么导演就需要走到每个人面前，告诉他们该干什么，代码中就是多个条件语句，这其实是很多朋友平时的编码状态，写很多个条件语句，遇到新需求时就需要修改已有的代码，这自然是不好的，且容易改出问题。

再来一个平时开发中的案例，假设一个网页需要集成地图应用，地图的选择有很多，一开始我们选择了google地图：

// 这是google map的api
const googleMap = { 
    show: function () {
        console.log('google地图渲染')
    }
}

// 我们自己编写的渲染地图函数
const renderMap = function () {
    googleMap.show()
}

现在，新需求来了，有的网页想要使用baidu地图，第一想法就是改改renderMap函数：

const googleMap = { 
    show: function () {
        console.log('google地图渲染')
    }
}
const baiduMap = {
    show: function () {
        console.log('baidu地图渲染')
    }
}

// 我们自己编写的渲染地图函数
const renderMap = function (type) {
    if (type === 'baidu') {
        baiduMap.show()
    } else if (type === 'google') {
        googleMap.show()
    }
}
renderMap('google')
renderMap('baidu')

解决新需求了，那假如又要加搜索地图啊，高德地图啊，是不是又需要改代码，改的过程中也可能手残不小心删掉一个字母，回过头来debug(我其实也经常这么干)。但是了解多态后，自然不能这么干了：

const googleMap = { 
    show: function () {
        console.log('google地图渲染')
    }
}
const baiduMap = {
    show: function () {
        console.log('baidu地图渲染')
    }
}

// 我们自己编写的渲染地图函数
const renderMap = function (mapApi) {
    if (typeof mapApi.show === 'function') {
        mapApi.show()
    }
}
renderMap('google')
renderMap('baidu')

// 后面想要加入高德地图也是ok的
const amap = {
    show: function () {
        console.log('渲染高德地图')
    }
}
renderMap(amap)

值得注意的是目前这几个地图api都拥有一个show方法，实际编码可能不是这样的，这就需要自己再对地图的api简单封装一下了~~~见仁见智，可自由发挥。书中案例来自JavaScript设计模式与开发实践，初步阅读，感觉是本好书，对js设计模式感兴趣的同学，不妨一看。

感慨

其实平时开发中，为了效率，往往都是简单了解下需求就动手撸代码，后面遇见新问题又来改旧代码，当需求飙升，代码慢慢就被改成了一坨xx，越到后期，效率越低下，维护成本越大。现在想想，谋而后动真的很有必要，一切条理思考清楚了，该用的设计模式都用上，开发过程会相当愉快~~