码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript设计模式与开发实践随笔(二)

时间:2019-08-07 17:28:40      阅读:105      评论:0      收藏:0      [点我收藏+]

标签:缺点   color   ==   col   随笔   发送   font   ima   new   

多态

 

多态的实际含义是:同一操作作用于不同的对象上面,可以产生不同的解释和不同的执行结果。换句话说,给不同的对象发送同一个消息的时候,这些对象会根据这个消息分别给出不同的反馈

      

 var makeSound = function( animal ){

if ( animal instanceof Duck ){

console.log( ‘嘎嘎嘎‘ );

}else if ( animal instanceof Chicken ){

console.log( ‘咯咯咯‘ );

}

};

var Duck = function(){};

var Chicken = function(){};

makeSound( new Duck() ); // 嘎嘎嘎

makeSound( new Chicken() ); // 咯咯咯

 

 

以上代码的缺点就是每添加一种动物都必须改动makesound函数,修改代码的风险比较大,而多态的思想是将不变的事物和可能改变的事物分离开来。

var makeSound = function( animal ){

animal.sound();

};

 

然后把可变的部分各自封装起来,我们刚才谈到的多态性实际上指的是对象的多态性:

var Duck = function(){}

Duck.prototype.sound = function(){

console.log( ‘嘎嘎嘎‘ );

};

var Chicken = function(){}

Chicken.prototype.sound = function(){

console.log( ‘咯咯咯‘ );

};

makeSound( new Duck() ); // 嘎嘎嘎

makeSound( new Chicken() ); // 咯咯咯

 

以后再添加动物的时候就直接在后边追加构造函数和添加原型就可以了

 

多态最根本的作用就是通过把过程化的条件分支语句转化为对象的多态性,从而

消除这些条件分支语句

 

 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‘ ); // 输出:开始渲染百度地图

 

修改后

var renderMap = function( map ){

if ( map.show instanceof Function ){

map.show();

}

};

renderMap( googleMap ); // 输出:开始渲染谷歌地图

renderMap( baiduMap ); // 输出:开始渲染百度地图

 

JavaScript设计模式与开发实践随笔(二)

标签:缺点   color   ==   col   随笔   发送   font   ima   new   

原文地址:https://www.cnblogs.com/wyongz/p/11316523.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!