作为一名前端程序猿,相对于后端操作数据的机会较少。然而,有些时候因为一些特殊的原因(如:需要构造成对应插件需要的数据格式,需要返回特定的数据格式等)而不得不对数据进行筛选、重构。相对于后端语言,我们没有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通过字典思想操作数据的更多相关文章

  1. Javascript 解读与思想

    Javascript 解读与思想 解读:对底层类库功能的理解 思想:对程序架构的部署思维

  2. 前端 javascript 数据类型 字典

    定义字典 a = {"k1":"v1","k2":"v2",}; Object {k1: "v1", ...

  3. 聚焦JavaScript面向对象的思想

    面向对象是一种软件开发方法,是一种对现实世界理解和抽象的方法,是计算机编程技术发展到一定阶段后的产物.随着时代的发展,计算机被用于解决越来越复杂的问题.一切事物皆对象,通过面向对象的方式,将现实世界的 ...

  4. 第六章:javascript:字典

    字典是一种以键-值对应形式存储的数据结构,就像电话薄里的名字和电话号码一样.只要找一个电话,查找名字,名字找到后,电话号码也就找到了.这里的键值是你用来查找的东西,值就是要查的到的结果. javasc ...

  5. 浅谈javascript的面向对象思想

    面向对象的三大基本特性 封装(把相关的信息(无论数据或方法)存储在对象中的能力) 继承(由另一个类(或多个类)得来类的属性和方法的能力) 多态(一个对象在不同情况下的多种形态) 定义类或对象 第一种: ...

  6. JavaScript数据结构——字典和散列表的实现

    在前一篇文章中,我们介绍了如何在JavaScript中实现集合.字典和集合的主要区别就在于,集合中数据是以[值,值]的形式保存的,我们只关心值本身:而在字典和散列表中数据是以[键,值]的形式保存的,键 ...

  7. JavaScript结构三层——思想快速介绍

    本文版权归博客园和作者吴双本人所有,转载和爬虫请注明原文地址 http://www.cnblogs.com/tdws/,我是博客园蜗牛,我们共同进步. 今天讨论的是什么 如果你的工作中需要写JavaS ...

  8. JavaScript结构三层——思想快速入门

      本文版权归博客园和作者吴双本人所有,转载和爬虫请注明原文地址 http://www.cnblogs.com/tdws/,我是博客园蜗牛,我们共同进步. 今天讨论的是什么 如果你的工作中需要写Jav ...

  9. [Javascript] 面向对象编程思想

    1.创建对象 1.1 new 用new进行创建对象: var user = new Object(); user.age = 12;//同时为对象添加属性 user.name = 'ajun'; 1. ...

随机推荐

  1. Android 获取SDCard中某个目录下图片

    本文介绍Android开发中如何获取SDCard中某目录下的所有图片并显示出来,下面的我们提供的这个函数是通用的,只要提供路径就可以查询出该目录下所有图片的路径信息,并保存到一个List<Str ...

  2. Minimum Cost(最小费用最大流)

    Description Dearboy, a goods victualer, now comes to a big problem, and he needs your help. In his s ...

  3. 读完了简明Python教程(a bite of Python)

    因为学过C/C++,简明教程里很多共通的地方一看就明白. 明天做书最后的练习. <--! 代码占位 -->

  4. django 项目部署在 Apache 后, 设置二级域名(Apache虚拟主机 、 万网二级域名设置)

    上一篇文章简单说了怎么把django的项目部署到Apache上. 现在想弄个二级域名,也就是我原来有个域名 www.mysite.com,现在我想弄个 bbs.mysite.com ,该怎么做呢. 要 ...

  5. 在 slua 中使用更新的面向对象方案

    上一篇记录了我使用 Slua.Class 来实现面向对象扩展 C# 中得类,但实际使用中,更多地情况是直接在 lua 中定义基类然后扩展,于是触发了我重新思考下是否两种形式应该统一用一种,目前的方案中 ...

  6. [hadoop转载]tearsort

        1TB排序通常用于衡量分布式数据处理框架的数据处理能力.Terasort是Hadoop中的的一个排序作业,在2008年,Hadoop在1TB排序基准评估中赢得第一名,耗时209秒.那么Tera ...

  7. Keepass TAN 记录的使用

    之前一直不知道 Keepass 软件中这个“TAN”是做什么用的,今天看了帮助文档,然后通过维基百科,有了一些大致的了解. 简单来说,一个 TAN 记录用于某些网站增加安全操作使用的.常规下只要用户名 ...

  8. n维立体空间建模

    n维立体空间建模,基于网格技术,将整个地球信息整体封装,初始进行网格化,选取某一个网格,进行迭代,    迭代的子项依然是网格,迭代的次数为k,网格最终大小可以指定,这种指定决定了立体块的细化率,假设 ...

  9. 为虚拟机搭建MacOSX系统

    发现一篇正确的安装文章,转载自:http://blog.imqyc.com/2013/05/29/vritual-MacOS/ 今年新买了一个笔记本电脑,本打算购入心仪已久的Macbook Pro 1 ...

  10. 让你的Ubuntu也能像Windows那样显示网速和CPU温度

    致力于Linux桌面操作系统的平民化,一直强迫自己完全在Ubuntu系统下进行日常的电脑使用,但是用长了时间的Windows,还是有些习惯改不过来,比如只要在下载或者看在线视频的时候就会不自觉关注网速 ...