javascript通过字典思想操作数据
作为一名前端程序猿,相对于后端操作数据的机会较少。然而,有些时候因为一些特殊的原因(如:需要构造成对应插件需要的数据格式,需要返回特定的数据格式等)而不得不对数据进行筛选、重构。相对于后端语言,我们没有Linq,Dictionary等利器。因此,特此介绍一种根据字典思想操作数据的方法。
1.从一个简单的场景说起:我们分别传入0-6,页面上打印出对应的星期一到星期七,像我这样的菜鸟可能会这样写:
var getWeekDay = function (dayNum) {
var strweekday = "";
switch (dayNum) {
case 0:
strweekday = "今天是星期一";
break;
......
case 6:
strweekday = "今天是星期天";
break;
}
return strweekday;
}
看上去写的有点累赘,而通过字典方式可以这样:
var dayNum = 3,
arrweekDic = ["一", "二", "三", "四", "五", "六", "天"],
strweekday = "今天是星期" + arrweekDic[dayNum];
哈哈~是不是看上去要好一点了?
2.前段时间碰到过这样一个场景:
从页面上很容易便能搜集到这样一个数据(模拟数据):
var list = [ { City: "北京", Province: "北京", KeyID: "1" },
{ City: "三亚", Province: "海南", KeyID: "2" },
{ City: "成都", Province: "四川", KeyID: "3" },
{ City: "绵阳", Province: "四川", KeyID: "4" },
{ City: "杭州", Province: "浙江", KeyID: "5" },
{ City: "绍兴", Province: "浙江", KeyID: "6" } ];
然而真正需要的确是这样一个数据格式:
{[{ City: "北京", Province: "北京", KeyID: "1" }],
[{ City: "三亚", Province: "海南", KeyID: "2" }],
[{ City: "成都", Province: "四川", KeyID: "3" },{ City: "绵阳", Province: "四川", KeyID: "4" },]
[{ City: "杭州", Province: "浙江", KeyID: "5" },{ City: "绍兴", Province: "浙江", KeyID: "6" } ]}
因此必须得将数据的格式重新弄一弄。如果按照我这个菜鸟的方法,估计就直接:
for(var i = 0,len = list.length;i < len;i++){
for(...){
//噼里啪啦各种整的天昏地暗
}
}
//然而通过字典方式却可以这样:
首先构造一个字典类型的数据:
var keyArr = {
"1": "1",
"2": "2",
"3": "3-4",
"4": "3-4",
"5": "5-6-7",
"6": "5-6-7",
"7": "5-6-7"
}
再根据keyArr 操作:
function getKeyIDGroups(list, keyArr) {
var group = {};
for (var index in list) {
var per = list[index],
key = keyArr[per.KeyID];
if (typeof key === "undefined") { continue; };
if (group[key] === undefined) {
group[key] = [per];
} else {
group[key].push(per);
}
}
return group;
};
这样看起来怎么着也感觉好一点吧,特别是以后有KeyID = 8, 9, 10再需要维护的时候,只需要改keyArr 的格式就行啦~
3.还有这么一天,后端给了我这样一个数据:
[{
"puoductLineID": "0",
"puoductLineName": "XXX",
"productVoList": [
{
"productID": "00",
"productName": "XXX",
"productLineID": "0",
"programList": [
{
"programID": "000",
"productID": "00",
"serviceSetList": [
{
"serviceSetID": "0000",
"serviceSetName": "XXX",
"programID": "000",
"serviceList": [
{
"ServiceID": "00000",
"ServiceName": "XXX",
"ip": "127.0.0.1",
"port": "8080",
"serviceSetID": "0000"
}...
]
}...
]
}...
]
}
...
]
}
...
]
天啦,一个嵌套了5层,每一层都可能有可能无,只第一层就有300多条数据啊~而我则需要拿出所有的ServiceSetID和ServiceName。于是我无奈地找到了后端同学,告诉他应该他把数据构造好再给我。而他却一脸不以为然地说,这么简单,随便写两个循环不就搞定了么~我还忙得很,于是就这样吃了闭门羹。算了,自己试着写写吧。于是用字典方式也算是较为轻松地完成吧:
function filterData(data, pCode) {
if (typeof data["serviceSetID"] !== "undefined") {
return true;
} else {
var listColumnName = "",
flag = false;
for (var k = 0; k < listNames.length; k++) {
if (typeof data[listNames[k]] !== "undefined") {
listColumnName = listNames[k];
break;
}
}
for (var i = 0; i < data[listColumnName].length; i++) {
var per = data[listColumnName][i],
code = "",
name = "",
nextPCode = "";
for (var key in per) {
if (per.hasOwnProperty(key)) {
if (typeof filed[key] !== "undefined") {
nextPCode = code = per[key];
name = per[filed[key]];
break;
}
}
}
if (filterData(per, nextPCode)) {
result_jian.push({
code: code,
name: name,
pCode: pCode
});
flag = true;
}
}
return flag;
}
};
javascript通过字典思想操作数据的更多相关文章
- Javascript 解读与思想
Javascript 解读与思想 解读:对底层类库功能的理解 思想:对程序架构的部署思维
- 前端 javascript 数据类型 字典
定义字典 a = {"k1":"v1","k2":"v2",}; Object {k1: "v1", ...
- 聚焦JavaScript面向对象的思想
面向对象是一种软件开发方法,是一种对现实世界理解和抽象的方法,是计算机编程技术发展到一定阶段后的产物.随着时代的发展,计算机被用于解决越来越复杂的问题.一切事物皆对象,通过面向对象的方式,将现实世界的 ...
- 第六章:javascript:字典
字典是一种以键-值对应形式存储的数据结构,就像电话薄里的名字和电话号码一样.只要找一个电话,查找名字,名字找到后,电话号码也就找到了.这里的键值是你用来查找的东西,值就是要查的到的结果. javasc ...
- 浅谈javascript的面向对象思想
面向对象的三大基本特性 封装(把相关的信息(无论数据或方法)存储在对象中的能力) 继承(由另一个类(或多个类)得来类的属性和方法的能力) 多态(一个对象在不同情况下的多种形态) 定义类或对象 第一种: ...
- JavaScript数据结构——字典和散列表的实现
在前一篇文章中,我们介绍了如何在JavaScript中实现集合.字典和集合的主要区别就在于,集合中数据是以[值,值]的形式保存的,我们只关心值本身:而在字典和散列表中数据是以[键,值]的形式保存的,键 ...
- JavaScript结构三层——思想快速介绍
本文版权归博客园和作者吴双本人所有,转载和爬虫请注明原文地址 http://www.cnblogs.com/tdws/,我是博客园蜗牛,我们共同进步. 今天讨论的是什么 如果你的工作中需要写JavaS ...
- JavaScript结构三层——思想快速入门
本文版权归博客园和作者吴双本人所有,转载和爬虫请注明原文地址 http://www.cnblogs.com/tdws/,我是博客园蜗牛,我们共同进步. 今天讨论的是什么 如果你的工作中需要写Jav ...
- [Javascript] 面向对象编程思想
1.创建对象 1.1 new 用new进行创建对象: var user = new Object(); user.age = 12;//同时为对象添加属性 user.name = 'ajun'; 1. ...
随机推荐
- Android如何在一个线性布局里完美显示两个listview啊?
复写一个listView ,在你布局文件中使用此view: <ScrollView android:layout_width="fill_parent" android:la ...
- android Button 颜色的变化(点击,放开,点击不放)
参考: http://endual.iteye.com/blog/1534258 总结: 定义res/drawable/button_style.xml文件 <?xml version=&quo ...
- Flash Vector例子
var s1:Student = new Student(); var s2:Student = new Student(); var s3:Student = new Student(); s1.n ...
- javascript在alert()出现中文乱码
今天在写jquery代码时,alert()总是出现中文乱码 琢磨了好一会儿,在网上查的资料是html页面上设置charset为GB2312 <meta charset="GB2312& ...
- handlebars模板库的资源
web 开发中,js 解析JSON 是经常的事情.非常繁琐.handlebars 使用了模版,只要你定义一个模版,提供一个json对象,handlebars 就能吧json对象放到你定的模版中,非常方 ...
- 浅谈pageobject模式
先来看两段代码 代码1: package com.zlshuo.selenium.nonaming.pageobject; /** * @author leshuo * @version 2014年5 ...
- Android开发必知--使用View.setId的正确姿势
这两天在写一个柱状图的自定义控件,用的直接继承ViewGroup的方式实现的,我们都知道,这是自定义控件里面最简单的一种了,有时间写个总结分享一下.这里我想说的重点是,在写这个自定义控件的时候遇到了个 ...
- UVA 4728 Squares(凸包+旋转卡壳)
题目链接:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=17267 [思路] 凸包+旋转卡壳 求出凸包,用旋转卡壳算出凸包的直 ...
- Dot Net设计模式—MVC模式
1 MVC设计模式简介 MVC结构是为那些需要为同样的数据提供多个视图的应用程序而设计的,它很好的实现了数据层与表示层的分离.MVC作为一种开发模型,通常用于分布式应用系统的设计和分析中,以及用于确定 ...
- RGB Bayer Color分析
RGB Bayer Color分析 Bayer色彩滤波阵列 拜耳色彩滤波阵列(Bayer Color Filter Array,CFA)是非常有名的彩色图片的数字采集格式.色彩滤波器的模式如上图所示, ...