json的用法

JSON(JavaScriptObject Notation) 是一种轻量级的数据交换格式。 简单地说, JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串,然后就可以在函数之间轻松地传递这个字符串,或者在异步应用程序中将字符串从 Web 客户机传递给服务器端程序。这个字符串看起来有点儿古怪,但是 JavaScript 很容易解释它,而且 JSON 可以表示比 " 名称 / 值对 " 更复杂的结构。例如,可以表示数组和复杂的对象,而不仅仅是键和值的简单列表。

      下面举几个简单的实例来介绍 Json ,因为 JSON  javascript 的原生格式,因此不需要任何特殊的 API 包或工具包。

       实例一 

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><metahttp-equiv="Content-Type"content="text/html; charset=ISO-8859-1"><title>Insert title here</title><scripttype="text/javascript">functiontestJson(){var user = 
{
"name":"tom",
"age":11,
"info":{"tel":"lf","cellphone":"1223"},
"address":
[
    	{"city":"lf","postcode":"111"},
    	{"city":"bj","postcode":"222"},
]
}
alert(user.name);
alert(user.info.cellphone);
alert(user.address[1].postcode);		
}
</script></head><body><inputtype="button"value="TestJson"onclick="testJson()"></body></html>

     可直接运行测试。

      实例二 

   下面这个实例是前后台如何交互的实例,首先把环境搭起来,创建一个 Maven 项目 json_test ,具体创建过程不再赘余, pom.xml 文件:

<projectxmlns="http://maven.apache.org/POM/4.0.0"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd"><modelVersion>4.0.0</modelVersion><groupId>com.tgb</groupId><artifactId>json_test</artifactId><packaging>war</packaging><version>0.0.1-SNAPSHOT</version><name>json_test Maven Webapp</name><url>http://maven.apache.org</url><dependencies><dependency><groupId>junit</groupId><artifactId>junit</artifactId><version>4.0</version><scope>test</scope></dependency><dependency><groupId>commons-lang</groupId><artifactId>commons-lang</artifactId><version>2.4</version></dependency><dependency><groupId>commons-beanutils</groupId><artifactId>commons-beanutils</artifactId><version>1.7.0</version></dependency><dependency><groupId>commons-collections</groupId><artifactId>commons-collections</artifactId><version>3.2</version></dependency><dependency><groupId>commons-logging</groupId><artifactId>commons-logging</artifactId><version>1.1.1</version></dependency><dependency><groupId>net.sf.ezmorph</groupId><artifactId>ezmorph</artifactId><version>1.0.6</version></dependency><dependency><groupId>net.sf.json-lib</groupId><artifactId>json-lib</artifactId><version>2.4</version><classifier>jdk15</classifier></dependency><dependency><groupId>org.springframework</groupId><artifactId>spring-webmvc</artifactId><version>3.0.4.RELEASE</version></dependency></dependencies><build><finalName>json_test</finalName></build></project>

      Web.xml 配置如下

<?xml version="1.0" encoding="UTF-8"?><web-appxmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns="http://java.sun.com/xml/ns/javaee"xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"id="WebApp_ID"version="2.5"><display-name>json_test</display-name><welcome-file-list><welcome-file>index.jsp</welcome-file></welcome-file-list><servlet><servlet-name>springMVC</servlet-name><servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class><load-on-startup>1</load-on-startup></servlet><servlet-mapping><servlet-name>springMVC</servlet-name><url-pattern>/</url-pattern></servlet-mapping></web-app>

      SpringMVC 的配置文件和 web.xml 文件在同一个目录下, springMVC-servlet.xml 

<?xml version="1.0" encoding="UTF-8"?><beansxmlns="http://www.springframework.org/schema/beans"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns:context="http://www.springframework.org/schema/context"xmlns:mvc="http://www.springframework.org/schema/mvc"xsi:schemaLocation="http://www.springframework.org/schema/beans 
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-3.0.xsd
http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd"><context:component-scanbase-package="com.tgb.json" /><mvc:annotation-driven /><mvc:resourceslocation="/js/"mapping="/js/**"/></beans>

上面关于 SpringMVC 的东西也不多讲,因为这不是要讲的重点。项目中还会用到 Jquery ,因此大家自行下载 jquery 包,放到 webapp/js 包下。

      下面开始编写后台的代码,首先创建一个 POJO  User 

package com.tgb.json;

publicclassUser {private String username;
privateint age;

public String getUsername() {
return username;
}

publicvoid setUsername(String username) {
this.username = username;
}

publicint getAge() {
return age;
}

publicvoid setAge(int age) {
this.age = age;
}
}

      然后创建 TestJson 类,在这个类中,我写了三个方法,是分别测试传递 User对象、 List 集合和 Map 的。

package com.tgb.json;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray;
import net.sf.json.JSONObject;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@ControllerpublicclassTestJson {@RequestMapping("logon.do")
public String logon(HttpServletRequest request,HttpServletResponse response){
return"/test/addUser";
}
//返回User对象@RequestMapping("/test/json1")
publicvoid returnUser(HttpServletRequest request,HttpServletResponse response) throws Exception{
response.setContentType("text/html");
PrintWriter out = response.getWriter();
User u1 = new User();
u1.setUsername("tom1");
u1.setAge(11);
//Json返回实体JSONObject jsonObject = JSONObject.fromObject(u1);
//返给ajax请求out.print(jsonObject);
}
//返回List@RequestMapping("/test/json2")
publicvoid returnList(HttpServletRequest request,HttpServletResponse response) throws Exception{
response.setContentType("text/html");
PrintWriter out = response.getWriter();
//传递ListList<User> list = new ArrayList<User>();
User u1 = new User();
u1.setUsername("tom1");
u1.setAge(11);
User u2 = new User();
u2.setUsername("jack");
u2.setAge(22);
list.add(u1);
list.add(u2);
//Json返回listJSONArray jsonArray = JSONArray.fromObject(list);
//返给ajax请求out.print(jsonArray);
}
//返回Map@RequestMapping("/test/json3")
publicvoid returnMap(HttpServletRequest request,HttpServletResponse response) throws Exception{
response.setContentType("text/html");
PrintWriter out = response.getWriter();
Map<String,User> map = new HashMap<String,User>();
User u1 = new User();
u1.setUsername("tom1");
u1.setAge(11);
User u2 = new User();
u2.setUsername("jack");
u2.setAge(22);
map.put("u1", u1);
map.put("u2", u2);
//Json返回mapJSONObject jsonObject = JSONObject.fromObject(map);
//返给ajax请求out.print(jsonObject);
}	
}

      完成了后台代码的编写,页面上就需要获取后台传过来的 Json 数据,并将它显示出来,创建页面 testJson.jsp 

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><metahttp-equiv="Content-Type"content="text/html; charset=utf-8"><scripttype="text/javascript"src="json_test/../js/jquery-1.7.1.js"></script><title>Insert title here</title><scripttype="text/javascript">//获取User对象functiongetJsonObject(){$.ajax({
type:"POST",
url:"/json_test/test/json1",
dataType:"json",
success:function(json){
alert(json.username);
alert(json.age);
},
error:function(){
alert("网络错误!");
}
});
}
//获取List对象functiongetJsonList(){$.ajax({
type:"POST",
url:"/json_test/test/json2",
dataType:"json",
success:function(json){
alert(json[0].username);
alert(json[1].age);
},
error:function(){
alert("网络错误!");
}
});
}	
//获取Map对象functiongetJsonMap(){$.ajax({
type:"POST",
url:"/json_test/test/json3",
dataType:"json",
success:function(json){
alert(json.u1.username);
alert(json.u2.age);
},
error:function(){
alert("网络错误!");
}
});
}	
</script></head><body><inputtype="button"value="获取User对象"onclick="getJsonObject()"><br/><inputtype="button"value="获取List"onclick="getJsonList()"><br/><inputtype="button"value="获取Map"onclick="getJsonMap()"></body></html>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值