ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

以【联动列表框】来看单一职责!

2021-04-25 12:57:05  阅读:170  来源: 互联网

标签:选项 控件 列表框 职责 js 联动


   

   以【联动列表框】来看单一职责!    

2013-06-21 21:53 金色海洋(jyk)  阅读(1409)  评论(1) 编辑 收藏    

标题有点短,估计悬。

 

联动列表框,简简单单的五个字,仅仅从字面上看,就可以分出来两个职责:

职责一:列表框

职责二:联动

 

我们先来看这两个职责,然后再说引申出来的另外两个职责。

职责一,列表框。列表框分为很多种,比如下拉列表框(DropDownList)、列表框(ListBox),还有为了美观用div模拟的,以及RadioBoxList,CheckBoxList等。首先一个问题就是,用哪种列表框,然后是其ID、name等属性的命名规范。然后是列表框是怎么出来的?是写死在body里,还是用js动态创建出来,还是其他的什么方式?

这些都属于列表框的职责。这些都和联动没有任何关系。不联动,他们也都存在。

 

再来看职责二,联动。联动指的是两个或者多个列表框直接的关联关系,比如常见的省市区县联动。省份的下拉列表框change之后,城市的下拉列表框要显示选择的省份里的城市,城市改变了之后,区县下拉列表框的选项也有随之变化,这就是他们的联动关系。

联动就是说,谁和谁有关系,谁change了,哪个要跟着变化。

 

接下来看看引申出来的两个职责:页面布局和数据获取

职责三:页面布局。多个列表框如何摆放?是紧挨在一起,还是在各自的td里,还是在div里?还是离着很远(中间有其他字段)?这是页面布局的事情,就是如何办法控件,而一个表单里不仅仅只有联动列表框,还会有文本框、其他列表框等。这些控件如何摆放?

 

职责四:数据获取。这里特指获取列表框的选项(option、item),因为有的时候一次性全部加载的话,数据量太大,比如省市级联,几百多条数据;省市区县级联,数千条数据;如果是省市区县街道级联,呵呵,一般好像没有这个需求(城市、区县、街道的话,是可以滴)。正因为数据量比较大,所以大多数采用ajax的方式获取,选择辽宁省,就加载辽宁的城市,其他的不加载。

但是如果联动的数据量很小的话,也这么做就有点折腾了,一次性加载也没多少压力,可以避免多次访问,给IIS带来的压力。

那么到底如何获取数据?还有要不要做缓存?都属于这一职责,当然,如果又需要,还可以细分为多个职责。一切看需求、环境,没有固定不变的。

 

好了,四个职责都说我了,我们来做个假设。假设我做了一个联动列表框,他可以自己动态创建列表框,你输入3,就动态创建三个列表框,你输入10,就创建10个列表框。而且这些列表框可以出现在任意指定的位置,出现在哪里随你指定,还可以自己去获取需要的选项。当然了,联动功能就不必说了。如果我弄出来了个这样的东东,肯定会有人站出来说:这个耦合性太高了,一点都不灵活,不符合某某,违反了某某,blablabla。不信的话可以看我以前发的博文。

 

把这些职责和在一起,做成一个控件的缺点是啥呢?牵一发而动全身。比如我一开始用的是下拉列表框,后来客户说,面积太小看这不方便,换成列表框吧,这个面积的,一次可以看到多个选项,不想下拉列表框,用鼠标点一下才能看到其他的选项。那么怎么办呢?我要改联动列表框。但是这个需求变化,和“联动”有啥关系?

再比如,我一开始是把所有选项都一次性加载到页面,然后change的时候,筛选出来需要的数据作为选项。在局域网里面没啥问题,但是到了外网,速度就很慢,客户不干了要改。咋办呢?改成ajax的吧。我又的去改联动列表框,但是这个和联动有啥关系呢?

再比如,我一开始是把几个联动列表框挨在一起,一个挨一个,省市联动是没啥事了。但是后来遇到个需求,两个列表框离着挺远,中间隔着几个控件,咋办呢?我还得改联动列表框,但是同上的问题。

 

这就是让一个控件负责多个职责的缺点。

 

那么分开来有啥好处呢?

我可以写一个js,专门负责动态创建各种列表框,比如下拉列表框等等。

在写一个js,专门负责数据提取。

再来一个js,专门负责表单里的控件的布局。

最后一个js,就是负责联动。

这样分开来之后呢,职责就明确多了,联动部分做好了之后就不用去改了(前提是接口设计的合理、健壮)。而且还很容易分工,我可以找四个人,一人负责一部分,四人一起开发,提供开发速度。

 

就着联动列表框,说了说单一职责,也顺带提了几嘴开闭和低耦合。其实这几个都是相辅相成的。一个做好了,其他的也就自然而然了。

 

 ps:写了两个多小时,才写了这么点字,速度太慢了。

 

 

 

 

 

 

标签:选项,控件,列表框,职责,js,联动
来源: https://blog.51cto.com/u_15179455/2730990

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有