从一个实例看javascript几种常用格式的转换

浏览数：13 / 时间：2015年06月09日

要对如图一所示的左侧table的数据按照“总量”进行排序

　　1，在前端实现

　　2，数据格式为object，如图二

原创文章，转载请注明：http://www.cnblogs.com/phpgcs

javascript中经常操作就是json/object/array，它们之间也经常需要转换。

json/object没有sort方法，array有；因此先将data转换为array

不只是排序，其他很多操作如获取长度，增加删除元素，取最大最小值都需要转换为Array

var 
proarray = [];
for(x in 
data[‘province‘]) {
    proarray.push([x, data[‘province‘][x]]);
}
proarray.sort(function(b,a){
    //因为是对总量进行排序，所以要对正面、中性、负面的总和进行比较
    return 
a[1][‘zm‘]-b[1][‘zm‘]+a[1][‘zx‘]-b[1][‘zx‘]+a[1][‘fm‘]-b[1][‘fm‘];
});

再打印以下排序之后的 proarray变量（array）

原创文章，转载请注明：http://www.cnblogs.com/phpgcs

完整的源码如下：

console.log(data[‘province‘]);
console.log(typeof(data[‘province‘]));
 
var 
counter = 1;
var 
tbody = ‘‘;
tbody +=‘ <table class="table table-striped table-bordered table-hover" id="weiboprovince_table"> <thead> <tr> <th style="width:8px;">#</th> <th>省份</t    h> <th>总量</th> <th>正面</th> <th>负面</th> </tr> </thead> <tbody>‘;
var 
proarray = [];
for(x in 
data[‘province‘]) {
    proarray.push([x, data[‘province‘][x]]);
}
proarray.sort(function(b,a){
    return 
a[1][‘zm‘]-b[1][‘zm‘]+a[1][‘zx‘]-b[1][‘zx‘]+a[1][‘fm‘]-b[1][‘fm‘];
});
for(x in 
proarray) {
    tbody += ‘<tr>‘;
    tbody += ‘<td>‘;
    tbody += ‘<div class="label label-success" style="color:white;">‘+(counter++)+‘</div>‘;
    tbody += ‘</td>‘;
    tbody += ‘<td>‘;
    tbody += proarray[x][0];
    tbody += ‘</td>‘;
    tbody += ‘<td>‘;
    tbody += parseInt(proarray[x][1][‘zm‘]+ proarray[x][1][‘zx‘] + proarray[x][1][‘fm‘]);
    tbody += ‘</td>‘;
    tbody += ‘<td>‘;
    tbody += proarray[x][1][‘zm‘];
    tbody += ‘</td>‘;
    tbody += ‘<td>‘;
    tbody += proarray[x][1][‘fm‘];
    tbody += ‘</td>‘;
    tbody += ‘</tr>‘;
}
tbody += ‘</tbody>‘;
tbody += ‘</table>‘;
$(‘#map_list‘).html(tbody);

延伸：

javascript中常用数据格式的转换

json->array

function 
json2array(json){
    var 
result = [];
    var 
keys = Object.keys(json);
    keys.forEach(function(key){
        result.push(json[key]);
    });
    return 
result;
}
//example
json2array({a:1,b:2});
[1, 2]
//more complex example
json2array({20131013: 66, 20131014: 198, 20131015: 253, 20131016: 352, 20131017: 293, 20131018: 277, 20131019: 111, 20131020: 91, 20131021: 255, 20131022: 256, 20131023: 293, 20131024: 390, 20131025: 401, 20131026: 117, 20131027: 45, 20131028: 54, 20131029: 59, 20131030: 66, 20131031: 109, 20131101: 32});
[66, 198, 253, 352, 293, 277, 111, 91, 255, 256, 293, 390, 401, 117, 45, 54, 59, 66, 109, 32]

array->string

var 
a = [{"obj1":"phpgcs"}, {"obj2":"ganiks"}]
console.log(a);
//[Object, Object]
JSON.stringify(a)
//"[{"obj1":"phpgcs"},{"obj2":"ganiks"}]"

string->array

"1,2".split(",").map(Number);
[1, 2]
"1,2".split(",");
["1", "2"]
JSON.parse("["+"1,2"+"]");
[1, 2]

object->json

//php print_r($response);
 
.post(url, params, function(data){
    console.log(data);//data并不是规范的JSON格式的
    data = $.parseJSON(data);
    console.log(data);
});<br>//这里如果直接用.getJSON方法获取ajax数据则直接就是规范的JSON数据