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. ...
随机推荐
- 汉企C#面向对象——继承
public class Shengwu { private string _Name; public string Name { get { return _Name; } set { _Name ...
- ThreadPoolExecutor原理及使用
大家先从ThreadPoolExecutor的总体流程入手: 针对ThreadPoolExecutor代码,我们来看下execute方法: public void execute(Runnable c ...
- Android 解决安装Egit时Egit Mylyn和org.eclipse.team.core报错
为了让Aptana支持GitHub,需要安装Egit,但在的时候碰到两个错误,一个是关于缺少EGit Mylyn另一个是缺少org.eclipse.egit.import.feature.group. ...
- Gilde加载网络图片(一)
前两天 一个朋友要在本地加载几M的大图 用于用户滚动查看.按照思路 是压缩后加载显示但是这样会不清晰, 其实gilde用来加载图片 很牛掰 于是了解一下 下面贴上两个工具类: package com. ...
- [SAM4N学习笔记]按键程序(中断方式)
一.准备工作: 将上一节搭建的工程复制一份,命名为"6.key interrupt".这一节主要讲如何使用SAM4N的GPIO中断功能,实现按键的中断输入. 二.程序编写 ...
- 虚拟机之仅主机模式(HostOnly)链接外网设置
我的环境: 虚拟机-VMware 虚拟系统-CentOS 现实主机-win7 具体设置步骤: 一.设置现实主机 (地址等不用额外设置,下面是我电脑正常上网的配置) 将本地链接设置共享(这步很重要) 二 ...
- HW4.21
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
- fetion for linux
- yum puppet
config.gem: Unpacked gem factory_girl-1.3.3 in vendor/gems has no specification file. Run 'rake gems ...
- 云之讯融合通讯开放平台_提供融合语音,短信,VoIP,视频和IM等通讯API及SDK。
云之讯融合通讯开放平台_提供融合语音,短信,VoIP,视频和IM等通讯API及SDK. undefined 全明星之极验证 - SendCloud undefined [转载]国内外几个主流的在线开发 ...