javascript设计模式之Adapter模式【适配器模式】实现方法示例


Posted in Javascript onJanuary 13, 2017

本文实例讲述了javascript设计模式之Adapter模式。分享给大家供大家参考,具体如下:

所谓Adapter模式就是适配器模式,主要是指使两个原本没有关联的类结合一起使用。

JS实现Adapter模式示例如下:

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <script type="text/javascript" src="json.js"></script>
  <script type="text/javascript" language="javascript">
    var DataSource01={};
    DataSource01.Author="Kevin";
    DataSource01.GetName=function(){
      return "Kevin";
    };
    DataSource01.GetAge=function(){
      return 35;
    };
    var DataSource02={};
    DataSource02.Author="Leo";
    DataSource02.MyName=function(){
      return "Leo";
    };
    DataSource02.MyAge=function(){
      return 25;
    };
    var DataSource03={};
    DataSource03.Author="zhihui";
    DataSource03.Name=function(){
      return "zhihui";
    };
    DataSource03.Age=function(){
      return 25;
    };
    //讲所有的放入一个数组中
    //在生成随机数后可以以下标
    var DataSources=[DataSource01,DataSource02,DataSource03];
    var DataAdapter={};
    DataAdapter.DataSource=false;
    DataAdapter.SetDataSource=function(ds){
      DataAdapter.DataSource=ds;
    };
    DataAdapter.ReturnData=function(){
      var Data={};
      Data.Author=false;
      Data.Name=false;
      Data.Age=false;
      //生成随机数
      //用来随机模拟前台的点击
      var rand=Math.random();
      rand=Math.floor(Math.random()*3);
      console.log(rand);
      console.log(DataSources[rand]);
      DataAdapter.SetDataSource(DataSources[rand]);
      if(rand==0){
        Data.Author=DataAdapter.DataSource.Author;
        Data.Name=DataAdapter.DataSource.GetName();
        Data.Age=DataAdapter.DataSource.GetAge();
      }else if(rand==1){
        Data.Author=DataAdapter.DataSource.Author;
        Data.Name=DataAdapter.DataSource.MyName();
        Data.Age=DataAdapter.DataSource.MyAge();
      }else if(rand==2){
        Data.Author=DataAdapter.DataSource.Author;
        Data.Name=DataAdapter.DataSource.Name();
        Data.Age=DataAdapter.DataSource.Age();
      }
      return Data;
    };
    function ShowData(){
      var Data= DataAdapter.ReturnData();
      alert(Data.toJSONString());
    }
    function ChooseDS01(){
      DataAdapter.SetDataSource( DataSource01);
    }
    function ChooseDS02(){
      DataAdapter.SetDataSource( DataSource02);
    }
  </script>
</head>
<body>
<input type="button" value="DataSource01" onclick="ChooseDS01()">
<input type="button" value="DataSource02" onclick="ChooseDS02()">
<input type="button" value="Show Data" onclick="ShowData()">
</body>
</html>

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
js getElementsByTagName的简写方式
Jun 27 Javascript
js location.replace与location.reload的区别
Sep 08 Javascript
浅析JavaScript中的类型和对象
Nov 29 Javascript
jquery超简单实现手风琴效果的方法
Jun 05 Javascript
jquery分割字符串的方法
Jun 24 Javascript
JavaScript中Textarea滚动条不能拖动的解决方法
Dec 15 Javascript
js倒计时简单实现方法
Dec 17 Javascript
微信公众号 摇一摇周边功能开发
Dec 08 Javascript
webpack学习笔记之代码分割和按需加载的实例详解
Jul 20 Javascript
EL表达式截取字符串的函数说明
Sep 22 Javascript
Koa代理Http请求的示例代码
Oct 10 Javascript
JavaScript设计模式之策略模式实现原理详解
May 29 Javascript
微信小程序(三):网络请求
Jan 13 #Javascript
Javascript自定义事件详解
Jan 13 #Javascript
JavaScript简单生成 N~M 之间随机数的方法
Jan 13 #Javascript
微信小程序 增、删、改、查操作实例详解
Jan 13 #Javascript
jQuery动态生成表格及右键菜单功能示例
Jan 13 #Javascript
Vue数据驱动模拟实现5
Jan 13 #Javascript
利用HTML5+Socket.io实现摇一摇控制PC端歌曲切换
Jan 13 #Javascript
You might like
在IIS上安装PHP4.0正式版
2006/10/09 PHP
PHP中使用register_shutdown_function函数截获fatal error示例
2015/04/21 PHP
Zend Framework教程之Zend_Config_Ini用法分析
2016/03/23 PHP
php微信公众号开发之二级菜单
2018/10/20 PHP
Yii实现微信公众号场景二维码的方法实例
2020/08/30 PHP
js实现单行文本向上滚动效果实例代码
2013/11/28 Javascript
js取float型小数点后两位数的方法
2014/01/18 Javascript
webapp框架AngularUI的demo改造之路
2014/12/21 Javascript
《JavaScript函数式编程》读后感
2015/08/07 Javascript
纯JS代码实现气泡效果
2016/05/04 Javascript
BootStrap树状图显示功能
2016/11/24 Javascript
javascript 的变量、作用域和内存问题
2017/04/19 Javascript
JavaScript中如何判断一个值的类型
2017/09/15 Javascript
BetterScroll 在移动端滚动场景的应用
2017/09/18 Javascript
vue-cli开发环境实现跨域请求的方法
2018/04/07 Javascript
JavaScript中set与get方法用法示例
2018/08/15 Javascript
15个顶级开源JavaScript框架和库
2018/10/10 Javascript
KOA+egg.js集成kafka消息队列的示例
2018/11/09 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
2018/12/28 Javascript
NestJs 静态目录配置详解
2019/03/12 Javascript
Vue的属性、方法、生命周期实例代码详解
2019/09/17 Javascript
jQuery实现倒计时功能完整示例
2020/06/01 jQuery
python中执行shell命令的几个方法小结
2014/09/18 Python
剖析Python的Twisted框架的核心特性
2016/05/25 Python
利用Python实现Windows下的鼠标键盘模拟的实例代码
2017/07/13 Python
Python实现七彩蟒蛇绘制实例代码
2018/01/16 Python
Python实现微信翻译机器人的方法
2019/08/13 Python
Python 线性回归分析以及评价指标详解
2020/04/02 Python
通过实例解析python and和or使用方法
2020/11/14 Python
使用Django的JsonResponse返回数据的实现
2021/01/15 Python
详解CSS3中@media的实际使用
2015/08/04 HTML / CSS
英国豪华文具和皮具配件经典老品牌:Smythson(斯迈森)
2018/04/19 全球购物
什么是URL
2015/12/13 面试题
客户接待方案
2014/02/26 职场文书
声乐专业大学生职业生涯规划书:理想的未来需要自己去打造
2014/09/20 职场文书
赡养老人协议书范本
2015/08/06 职场文书