javascript设计模式之Adapter模式【适配器模式】实现方法示例
更新时间：2017年01月13日 10:16:58 作者：lx_3278@126
这篇文章主要介绍了javascript设计模式之Adapter模式,结合实例形式分析了JS适配器模式的原理与具体实现方法,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了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适配器模式详解
- JavaScript设计模式之适配器模式介绍
- 深入理解JavaScript系列（39）：设计模式之适配器模式详解
- 详解JavaScript实现设计模式中的适配器模式的方法
- javascript设计模式 – 适配器模式原理与应用实例分析
- JavaScript设计模式学习之适配器模式
- JavaScript 设计模式之组合模式解析
- JavaScript组合模式学习要点
- 设计模式中的组合模式在JavaScript程序构建中的使用
- javascript设计模式 – 组合模式原理与应用实例分析
- JavaScript设计模式开发中组合模式的使用教程
- javascript适配器模式和组合模式原理与实现方法详解
相关文章
javascript mouseover、mouseout停止事件冒泡的解决方案
停止事件冒泡在各浏览器中已经有相应的解决方案，但是对于mouseover和mouseout却显得力不从心。2009-04-04
这篇文章主要介绍了JavaScript学习笔记之DOM操作,结合实例形式分析了javascript针对dom元素的获取、设置相关操作常用函数使用技巧,需要的朋友可以参考下2019-01-01
这篇文章主要为大家详细介绍了bootstrap与pagehelper实现分页效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-12-12
详解微信小程序scroll-view横向滚动的实践踩坑及隐藏其滚动条的实现
这篇文章主要介绍了详解微信小程序scroll-view横向滚动的实践踩坑及隐藏其滚动条的实现，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-03-03
JavaScript数组去重这个问题,经常出现在面试题中,下面这篇文章主要给大家介绍了关于JavaScript数组去重的五种方法及其他细节和拓展的相关资料,文中通过实例代码以及图文介绍的非常详细,需要的朋友可以参考下2022-12-12
这篇文章主要为大家详细介绍了关于Bootstrap基本模板的使用和理解的学习记录，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-12-12
这篇文章主要介绍了JavaScript操作Oracle数据库示例,本文使用ActiveXObject实现访问Oracle数据库,需要的朋友可以参考下2015-03-03
这篇文章主要给大家介绍了关于Javascript 、Vue禁止鼠标右键点击事件的相关资料,禁止右键的原理是通过JavaScript阻止浏览器右键事件的默认行为,从而达到禁止右键的效果,文中通过代码介绍的非常详细,需要的朋友可以参考下2023-11-11
在当今的互联网时代,数据已成为企业最宝贵的资产之一,无论是社交媒体分析、市场趋势预测还是用户行为研究,高效地获取和处理网页数据都是至关重要的,本文将通过访问抖音平台的案例,介绍如何在TypeScript中使用axios库进行高效的网页数据抓取2024-08-08
这篇文章主要为大家详细介绍了js实现选项卡效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-03-03
最新评论