JSON - 页面与后台数据交互

这里分析后台传user对象到页面，页面在js里面使用EL取值。

【1】后台返回user的json对象，页面直接取值

request.setAttribute("loginUser",JSON.toJSON(loginUser));
//放入json对象
var loginUser = ${loginUser};

页面使用EL取值获取为json对象,即 typeof loginUser == object。

-- 以下效果相同
request.setAttribute("loginUser",JSON.toJSONString(loginUser));

---

【2】后台返回user的json对象，页面用双引号包括取值

request.setAttribute("loginUser",JSON.toJSON(loginUser));
//放入json对象
var loginUser = "${loginUser}";//注意，使用了双引号包括

页面使用EL取值，出错！！！因为json内部使用的是双引号！！！

Uncaught SyntaxError: Unexpected identifier

页面使用EL取值，出错！！！因为json内部使用的是双引号！！！

---

【3】后台返回user的json对象，页面用单引号包括取值

request.setAttribute("loginUser",JSON.toJSONString(loginUser));
//放入json对象
var loginUser = '${loginUser}';//注意，使用了单引号包括

页面使用EL取值，获取的为json-string需要解析为json-object。

if (typeof loginUser != 'object' && loginUser != '' ) {
    loginUser = eval("("+loginUser+")");
    alert(loginUser.userCode+','+1);

}else if(loginUser != null && loginUser!= ''){
    alert(typeof loginUser +','+ loginUser.userCode+','+2);
}

即使后台传参为null，页面也只是会拿到一个 ''不会抛异常。

---

【4】后台返回null对象，页面直接取值

request.setAttribute("loginUser",null);
//放入null

var loginUser = ${loginUser};

页面报错！！！

所以了，警惕属性值为空的情况，最好用第三种方式。

---

【5】后台返回user对象，页面直接取值

request.setAttribute("loginUser",loginUser);
//放入user对象

var loginUser = ${loginUser};

页面报错！！！可能会提示Unexpected token :或Unexpected token ;

但是可以在html中直接取值，如下：

"userCode" name="userCode" value="${loginUser.userCode}" type="text"/>

---

综上，如果需要在js中获取域对象属性值，推荐使用第三种方式！！！

即，后台返回jsonString，页面js用EL取值并用单引号包裹。如果是在html中使用，可直接返回user对象，页面直接用EL取值。