JS中的多態(tài)實例詳解
多態(tài)在面向對象編程語言中是十分重要的。在JAVA中是通過繼承來得到多態(tài)的效果。如下：
public abstract class Animal {
abstract void makeSound(); // 抽象方法
}
public class Chicken extends Animal{
public void makeSound(){
System.out.println( "咯咯咯" );
}
}
public class Duck extends Animal{
public void makeSound(){
System.out.println( "嘎嘎嘎" );
}
}
Animal duck = new Duck(); // (1)
Animal chicken = new Chicken(); // (2)
多態(tài)的思想實際上是把“做什么”和“誰去做”分離開來，要實現(xiàn)這一點，歸根結底先要消除類型之間的耦合關系。
在Java中，可以通過向上轉型來實現(xiàn)多態(tài)。而javascript的變量在運行期是可變的，一個js對象既可以表示既可以表示Duck類型的對象，又可以表示Chicken類型的對象，這意味著JavaScript對象的多態(tài)性是與生俱來的。
多態(tài)最根本的作用就是通過把過程化的條件分支語句轉化為對象的多態(tài)性， 從而消除這些條件分支語句。
假設我們要編寫一個地圖應用，現(xiàn)在有兩家可選的地圖API提供商供我們接入自己的應 用。目前我們選擇的是谷歌地圖，谷歌地圖的API中提供了show方法，負責在頁面上展 示整個地圖。示例代碼如下：
var googleMap = {
show: function(){
console.log( '開始渲染谷歌地圖' );
}
};
var renderMap = function(){
googleMap.show();
};
renderMap(); // 輸出：開始渲染谷歌地圖
var googleMap = {
show: function(){
console.log( '開始渲染谷歌地圖' );
}
};
var baiduMap = {
show: function(){
console.log( '開始渲染百度地圖' );
}
};
var renderMap = function( type ){
if ( type === 'google' ){
googleMap.show();
}else if ( type === 'baidu' ){
baiduMap.show();
}
};
renderMap( 'google' ); // 輸出：開始渲染谷歌地圖
renderMap( 'baidu' ); // 輸出：開始渲染百度地圖
可以看到，雖然renderMap函數(shù)目前保持了一定的彈性，但這種彈性是很脆弱的，一旦需要替換成搜搜地圖，那無疑必須得改動renderMap函數(shù)，繼續(xù)往里面堆砌條件分支語句。
我們還是先把程序中相同的部分抽象出來，那就是顯示某個地圖：
var renderMap = function( map ){
if ( map.show instanceof Function ){
map.show();
}
};
renderMap( googleMap ); // 輸出：開始渲染谷歌地圖
renderMap( baiduMap ); // 輸出：開始渲染百度地圖
之后我們又新增了騰訊地圖的支持，那我們很快變可以實現(xiàn)這個功能，而且不必修改原代碼：
var TencentMap = {
show: function(){
console.log( '開始渲染騰訊地圖' );
}
}
renderMap( sosoMap ); // 輸出：開始渲染騰訊地圖
多態(tài)技術至關重要，很多設計模式都是巧妙利用多態(tài)來實現(xiàn)。
總結
以上所述是小編給大家介紹的JS中的多態(tài)實例，希望對大家有所幫助！
相關文章
Javascript實現(xiàn)hashcode函數(shù)實現(xiàn)對象比較與原理說明
在JavaScript中，數(shù)值的比較是比較簡單的，使用相等（==）和全等（===）符號基本上可以解決大多數(shù)非對象的比較。但是相等（==）和全等（===）符號在對象 object 的比較上，就不能滿足所有的要求了2023-06-06
分包指的是把一個完整的小程序項目,按照需求劃分為不同的子包, 在構建時打包成不同的分包,用戶在使用時按需進行加載,下面這篇文章主要給大家介紹了關于微信小程序分包操作的相關資料,需要的朋友可以參考下2022-10-10
這篇文章主要介紹了JS簡單添加元素新節(jié)點的方法,結合實例形式分析了javascript針對頁面元素節(jié)點的創(chuàng)建、添加、克隆等相關操作技巧,需要的朋友可以參考下2018-02-02
今天小編就為大家分享一篇對layui初始化列表的CheckBox屬性詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
這篇文章主要介紹了JS變量提升,結合實例形式分析了JS變量提升基本概念、功能、原理、用法及相關注意事項,需要的朋友可以參考下2020-05-05
js實現(xiàn)省市區(qū)三級聯(lián)動非select下拉框版
這篇文章主要為大家詳細介紹了js實現(xiàn)省市區(qū)三級聯(lián)動非select下拉框版，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
JavaScript中的公有、私有、特權和靜態(tài)成員用法分析
這篇文章主要介紹了JavaScript中的公有、私有、特權和靜態(tài)成員用法,以實例形式分析了其使用方法,簡單易懂,對于初學javascript的朋友具有不錯的學習與借鑒價值,需要的朋友可以參考下2014-11-11
Javascript - HTML的request類...2006-07-07
JS不同地圖坐標系經緯度轉換方法(天地圖、高德地圖、百度地圖、騰訊地圖)
這篇文章主要給大家介紹了關于JS不同地圖坐標系經緯度轉換的相關資料,分別包括天地圖、高德地圖、百度地圖、騰訊地圖,需要的朋友可以參考下2024-07-07
下面小編就為大家?guī)硪黄獰o縫滾動的簡單實現(xiàn)代碼(推薦)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-06-06