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. ...
随机推荐
- 【Xamarin挖墙脚系列:Xamarin的核心】
原文:[Xamarin挖墙脚系列:Xamarin的核心] Xamarin 包含两个商业产品 :Xamarin.IOS, Xamarin.Android.他们都是通过开源的基于.Net的Mono项目构建 ...
- 第一回写的用arraylist模拟栈操作
package hashMap; import java.util.ArrayList; import d.Student; /** * 用ArrayList模拟栈操作 * @author zhuji ...
- Github上更新自己Fork的代码
一.前提本文的前提是你已经在github上fork了别人的分支,并且弄好了跟github的ssh连接.相关配置详情参考:https://help.github.com二.详细操作 检出自己在githu ...
- Win7资源管理器已停止工作——StackHash_6c37,R6205错误
2013-9-20 此问题由来已久,截图及"问题签名"如下: 问题签名: 问题事件名称: BEX64 应用程序名: Explorer.EXE 应用程序版本: 6.1.7601. ...
- php获取html checkbox的值。
一个小错误,搞了好久: <label><input class="short" type="checkbox" id="is_onl ...
- linux 复制文件时,报cp: omitting directory `XXX'
今天在用linux命令进行文件复制时omitting cp -i BBS /opt/workspace/apache-tomcat-6,参数用的是 -i),所以也不太熟悉,原来,还有子目录文件,而是必 ...
- android学习——activity的生命周期
Android中主要组件之Activity的生命周期,基本都是翻译Android API和个人的理解. 首先看一下Android api中所提供的Activity生命周期图: Activity其实是继 ...
- EF多表查询方式
5, 连接 可以的连接有Join 和 GroupJoin 方法.GroupJoin组联接等效于左外部联接,它返回第一个(左侧)数据源的每个元素(即使其他数据源中没有关联元素). using (var ...
- Ubuntu下安装PAC Manager
在Windows下习惯使用XShell.PAC Manager其实就是一个在Linux系统类似XShell的工具. 下载地址: https://sourceforge.net/projects/pac ...
- JavaScript高级程序设计29.pdf
insertAdjacentHTML方法 插入标记最后一个新增的方式是insertAdjacentHTML()方法,它接收两个参数:插入位置和要插入的HTML文本,第一个参数必须是下列值之一: &qu ...