对于后台返回json数据处理：总结一些常用的方法 - Web前端

近期在忙于官网的改版，尤其是对于数据优化，自己也记下项目笔记，对于后台返回json数据处理：总结一些常用的方法。今天上午抽时间分享出来，希望能够帮助到大家。

转义和反转义

JS中有很多函数可以用来转义和反转义，如escape()和unescape()、encodeURI()和decodeURI()、encodeURIComponent()和decodeURIComponent()等。

1、escape()和unescape()

escape()函数将参数转换为字符串，并以url编码的格式进行编码。在这种格式中，所有空格、标点、重音符号以及其他非ASCII字符都要%xx十六进制序列码代替。如空格的返回时%20。

escape(param);

参数param是转换为字符串并以URL编码格式进行编码的表达式。

unescape()功能恰好相反，将URL编码格式字符串进行解码返回字符串。

unescape(param);

例如：

escape("Hello{[World]}");
转义结果为：Hello%7B%5BWorld%5D%7D

unescape("Hello%7B%5BWorld%5D%7D")
返回结果：Hello{[World]}

缺点：escape()和unescape()只能处理ASCII字符，不推荐使用这两个方法进行转义、解码。

2、encodeURI()和decodeURI()

encodeURI()函数将文本字符串编码为一个有效的统一资源标识符(URI)。而decodeURI()将URI解码为一般字符串。

encodeURI(param);

param是一个将被编码的字符串。

decodeURI(param);

例如：

encodeURI("Hellow{[World]}")
转义结果为：Hello%7B%5BWorld%5D%7D

decodeURI("Hello%7B%5BWorld%5D%7D")
返回结果：Hello{[World]}。

注意：

encodeURI()函数单靠自身不能形成http get请求或者post请求，因为&、+、=都不会被转码，这几个字符在GET或POST请求中被作为特殊字符对待。

3、encodeURIComponent()和decodeURIComponent()

这两个函数也是用来编码和解码。

decodeURIComponent(URIstring)

URIString为一个已编码的URI组件。

encodeURIComponent(URIString)
var aa='哈哈+呵呵';
encodeURIt(aa)  //'哈哈 呵呵'
encodeURIComponent(aa)  //'哈哈+呵呵'

encodeURIComponent()可以转换除英文字母、数字、-、_、.、!、~、*、'、(、)外的所有字符。

前端处理后端返回带/反斜杠转义符的JSON数据

一般我们常用办法是限eval()方法运行一次，然后在用JSON.parse()进行转换。例如这是我项目的代码片段。

xhr.onreadystatechange = function() {     
        var data = eval('('+xhr.responsetext+')'),
              dataResult = jsON.parse(data.body);
        //console.log(dataResult);
        if(data){             
            if(xhr.readyState && xhr.status == 200) {    
                ...
            }
            else {
                ...
            }
        } 
};

对于结果进行了二次转换，当然有时候只需要执行JSON.parse()，看后台给你的数据格式了。

这里顺便普及下eval()和JSON.parse()的用法。

eval()定义和用法

eval() 函数可计算某个字符串，并执行其中的的 javascript 代码。

eval()语法

eval(string)

eval()返回值

通过计算 string 得到的值（如果有的话）。

eval()说明

该方法只接受原始字符串作为参数，如果 string 参数不是原始字符串，那么该方法将不作任何改变地返回。因此请不要为 eval() 函数传递 String 对象来作为参数。

如果试图覆盖 eval 属性或把 eval() 方法赋予另一个属性，并通过该属性调用它，则 ECMAScript 实现允许抛出一个 Evalerror 异常。

eval()抛出

如果参数中没有合法的表达式和语句，则抛出 SyntaxError 异常。

如果非法调用 eval()，则抛出 EvalError 异常。

如果传递给 eval() 的 Javascript 代码生成了一个异常，eval() 将把该异常传递给调用者。

JSON.parse()

JSON 通常用于与服务端交换数据。

在接收服务器数据时一般是字符串。

我们可以使用 JSON.parse() 方法将数据转换为 javascript 对象。

语法

JSON.parse(text[, reviver])

参数说明：

• text:必需， 一个有效的 JSON 字符串。

• reviver: 可选，一个转换结果的函数， 将为对象的每个成员调用此函数。

JSON 解析实例

例如我们从服务器接收了以下数据：

{ "name":"runoob", "alexa":10000, "site":"www.jiangweishan.com" }

我们使用 JSON.parse() 方法处理以上数据，将其转换为 javaScript 对象：

var obj = JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.jiangweishan.com" }');

注意：这里一定要注释单引号和数组的组合形式，新手很容易会出问题，就会报错。

总结

目前就分享这么多，要干活了，时间有限，后期继续在进行研究。

标签：数据处理后台常用方法Webjson