使用 Javascript 编程, 组合使用 JSON 数据格式,Mapping 和回调技术, 可以产生很强的表达效果。 在实际工作中, 总会有数据汇总的需求。 比如说, 取得了多个 device 的性能数据, 现在希望能够对其中的若干字段进行不同的汇总(有的求和,有的求平均值,有的求最大值),得到所有Device 的总的性能状况。
具体怎么实现呢? 显然, 对于指定的不同字段, 需要不同的数据汇总函数, 可以使用一个 Mapping 来管理字段与数据汇总函数之间的映射关系,并采用回调方式来计算归总值; 通常返回数据都会采用对象数组的结构, javascript 对 JSON 格式的数据操作非常方便。
具体实现代码如下( 可以直接复制到 JS 控制台执行):
/** * 对多个chart数据的指定字段使用指定函数进行汇总 * @param chartDataArray chart 数据数组, 结构: [[{'timestamp': 'xxx1', 'field1': 'xxx1', 'field2': 'yyy1'}], [{'timestamp': 'xxx1', 'field1': 'xxx2', 'field2': 'yyy2'}]] * 这些 chart 的长度应该是相同的 * @param fieldFuncMapping字段与聚合函数的映射, 结构: {'field1': func1, 'field2':func2 } * @return 单个 chart 数据, 结构 [{'timestamp': 'xxx1', 'field1': func1('xxx1', 'xxx2'), 'field2': func2('yyy1', 'yyy2')}] */ var summary = function(chartDataArray, fieldFuncMapping) { var i=0, k=0; var chartNum = (chartDataArray == null ? 0 : chartDataArray.length); var chartLength = (chartDataArray[0] == null ? 0 : chartDataArray[0].length); var result = []; var dataArrayForSinglePoint = []; var dataSummaryForSinglePoint = 0; var dataSummaryObjForSinglePoint = {}; var singleData = 0; var dataItem = {}; var dataItemProperty = {}; var fieldSummaryFunc = null; if (chartNum == 0 || chartLength == 0) { return []; } dataItemProperty = chartDataArray[0][0]; for (k=0; k < chartLength; k++) { dataSummaryObjForSinglePoint = {}; for (var field in dataItemProperty) { dataArrayForSinglePoint = []; for (i=0; i<chartNum;i++) { dataItem = chartDataArray[i][k]; singleData = dataItem[field]; dataArrayForSinglePoint.push(singleData); } fieldSummaryFunc = fieldFuncMapping[field]; if (fieldSummaryFunc == null) { fieldSummaryFunc = obtainFirstFunc; } dataSummaryForSinglePoint = fieldSummaryFunc(dataArrayForSinglePoint); dataSummaryObjForSinglePoint[field] = dataSummaryForSinglePoint; } result.push(dataSummaryObjForSinglePoint); } return result; } var obtainFirstFunc = function(array) { return array[0]; } var sumFunc = function(array) { var i=0, sum = 0; var len = (array == null ? 0 : array.length); if (len == 0) { return 0; } for(i=0; i<len; i++) { sum += array[i]; } return sum; } var averageFunc = function(array) { var i=0, sum = 0; var len = (array == null ? 0 : array.length); if (len == 0) { return 0; } sum = sumFunc(array); return sum / len; } var testFunc = function() { var chart1 = [{'time': 'time1', 'num': 13, 'grade': 95}, {'time': 'time2', 'num': 15, 'grade': 99}, {'time': 'time3', 'num': 16, 'grade': 94}]; var chart2 = [{'time': 'time1', 'num': 16, 'grade': 93}, {'time': 'time2', 'num': 14, 'grade': 95}, {'time': 'time3', 'num': 18, 'grade': 97}]; var fieldFuncMapping = {'num': sumFunc, 'grade': averageFunc}; var chart = summary([chart1, chart2], fieldFuncMapping); console.log(chart); } testFunc();
附上一个 javascript 的陷阱: