struts2(十)之JSON基础

JSON简介

JSON(JavaScript Object Notation),JavaScript对象符号,是一种轻量级的数据交换格式。它是基于ECMAScript的一个子集。 JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C、C++、C#、Java、JavaScript、Perl、Python等)。这些特性使JSON成为理想的数据交换语言。 易于人阅读和编写,同时也易于机器解析和生成(一般用于提升网络传输速率)。

JSON主要基于以下两种数据结构:

>由key-value对组成的数据结构。 在各种语言中有不同的实现,如:在JavaScript中是一个对象,在Java中是一种Map结构,在C语言中是一个struct。在其他语言中,可能是record、dictionary、hash table。

>有序集合。 在不同语言中,可能是list、vector、数组或者序列等实现。

这些是通用的数据结构。 几乎所有的现代编程语言都有相应的实现。所以JSON可以作为程序设计语言中通用的数据交换格式。在JavaScript中主要有两种JSON的语法,一种用于创建对象,一种用于创建数组。

基础结构

json可以简单地理解为javascript中的对象和数组,通过这两种结构可以表示各种复杂的结构。

1、对象:对象在js中表示为“{}”括起来的内容,数据结构为 {key:value,key:value,…}的键值对的结构,在面向对象的语言中,key为对象的属性,value为对应的属性值,所以很容易理解,取值方法为 对象.key获取属性值,这个属性值的类型可以是数字、字符串、数组、对象几种。

2、数组:数组在js中是中括号“[]”括起来的内容,数据结构为 [“java”,”javascript”,”vb”,…],取值方式和所有语言中一样,使用索引获取,字段值的类型可以是 数字、字符串、数组、对象几种。

经过对象、数组2种结构就可以组合成复杂的数据结构了。

简单地说 ,JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串,然后就可以在函数之间轻松地传递这个字符串,或者在异步应用程序中将字符串从 Web 客户机传递给服务器端程序。JavaScript可以很容易解释这个字符串,而且 JSON 可以表示比”名称 / 值对”更复杂的结构。例如,可以表示数组和复杂的对象,而不仅仅是键和值的简单列表。

使用JSON语法创建对象

使用JSON语法创建对象不用写函数,不用new关键字,可以直接获取一个JavaScript对象。下面是这种语法的示意图。

创建对象object时,总以{开始,以}结束,对象每个属性名和属性值之间以英文冒号(:)隔开,多个属性定义之间以英文逗号(,)隔开,语法格式如下:

object =
{
   propertyName1 : propertyValue1,
   propertyName2 : propertyValue2,
   ...
}

要注意的是,并不是每个属性定义后面都有一个英文逗号(,),必须后面还有属性定义时才需要逗号(,),最后一个属性后面是不加逗号(,)的。

用JSON语法创建JavaScript对象时,属性值不仅可以是普通字符串,也可以是任何基本数据类型,或者是函数、数组,甚至是另外一个JSON语法创建对象。

person =
{
   name : ‘Jujiu‘,
   sex : ‘male‘,
   //使用JSON语法为期指定一个属性
   son : {
      name : ‘yoyo‘,
      grade : 1
   },
   //使用JSON语法为person值分配一个方法
   info : function{
      document.writeln("姓名:" + this.name + "性别:" + this.sex);
   }
}

使用JSON语法创建数组

使用JSON语法创建数组的语法示意图。

如图所示,JSON创建数组总是以英文括号([)开始,然后依次放入数组元素,元素与元素之间以逗号(,)隔开,最后一个数组元素后面不加英文逗号,但以英文反方括号(])结束。使用JSON创建数组的语法格式如下:

arr = [value1, value2 ...]

与JSON创建对象相似的是,数组的最后一个元素后面不能有逗号(,)。

由于JSON语法的简单易用,且作为数据传输载体时,数据传输量更小,所以在Ajax交互中,往往不使用XML作为数据交换格式,而是采用JSON作为数据交换格式。假设需要交换一个对象personn,其name属性为Jujiu,gender属性为29,使用JSON语法可以简单地写成:

person =
{
   name : ‘Jujiu‘,
   gender : ‘male‘,
   age : 29
}

用XML数据交换格式,则要写成:

<person>
   <name>Jujiu</name>
   <gender>male</gender>
   <age>29</age>
</person>

可见,使用JSON语法要简单一些。

当服务器返回一个满足JSON格式的字符串后,接下来可以利用json扩展的方法将该字符串转换成一个JavaScript对象。登录http:www.json.org/json2.js站点,下载jsonn2.js文件,该文件提供了一个全局的JSON对象,该对象包含两个方法:stringify和parse,其中前者负责把一个JSON对象转换成JSON格式的字符串,后者负责把JSON格式字符串转换成JSON对象。

实现Action逻辑

先来看一段代码。

package com.afy.app.action;

import java.util.HashMap;
import java.util.Map;

import com.opensymphony.xwork2.Action;
import org.apache.struts2.json.annotations.JSON;

public class JSONExample{
    // 模拟处理结果的成员变量
    private int[] ints = {10, 20};
    private Map<String , String> map
        = new HashMap<String , String>();
    private String customName = "顾客";
    // 封装请求参数的三个成员变量
    private String field1;
    // ‘transient‘修饰的成员变量不会被序列化
    private transient String field2;
    // 没有setter和getter方法的成员变量不会被序列化
    private String field3;

    public String execute(){
        map.put("name", "疯狂Java讲义");
        return Action.SUCCESS;
    }

    // 使用注解来改变该成员变量序列化后的名字
    @JSON(name="newName")
    public Map getMap(){
        return this.map;
    }

    // customName的setter和getter方法
    public void setCustomName(String customName){
        this.customName = customName;
    }
    public String getCustomName(){
        return this.customName;
    }

    // field1的setter和getter方法
    public void setField1(String field1){
        this.field1 = field1;
    }
    public String getField1(){
        return this.field1;
    }

    // field2的setter和getter方法
    public void setField2(String field2){
        this.field2 = field2;
    }
    public String getField2(){
        return this.field2;
    }

    // field3的setter和getter方法
    public void setField3(String field3){
        this.field3 = field3;
    }
    public String getField3(){
        return this.field3;
    }
}

这里是处理一个页面请求的Action类代码,该页面中包含三个表单域,这三个表单域对应于三个请求参数,因此应该使用Action来封装三个请求参数。三个表单域的name分别是field1、field2、field3。

上面代码中,使用了@JSON注解,使用该注解时指定了name属性,name属性用于改变JSON对象的属性名字。另外,@JSON还支持如下几个属性。

>serialize : 设置是否序列号该属性。

> deserialize: 设置是否反序列化该属性。

>format: 设置用于格式化输出、解析日期表单域的格式。如“yyyy-MM-dd’T’HH:mm:ss”。

JSON插件与json类型的Result

JSON插件提供了一种json类型的Result,一旦为某个Action指定一个类型为json的Result,则该该Result不用映射到任何视图资源。因为JSON插件会负责将Action里的状态信息序列化成JSON格式的字符串,并将该字符串返回给客户端浏览器。

JSON插件允许在客户端页面的JavaScript中异步调用Action,而且Action不再需要使用视图资源来显示该Action里的状态,而是由JSON插件将Action里的状态信息返回给调用页面,通过这种方式,就可以完成Ajax交互。

将struts2解压缩目录的lib子目录下的struts2-json-plugin-2.3.16.3.jar文件复制到Web应用的WEB-INF\lib目录下,就可以为该struts2应用增加JSON插件了。

接下来配置提供返回JSON字符串的Action,要为Action配置类型为json的Result,而这个Result无需配置任何视图资源。配置Action的struts.xml文件如下。

<?xml version="1.0" encoding="GBK"?>
<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
    "http://struts.apache.org/dtds/struts-2.3.dtd">
<struts>
    <constant name="struts.i18n.encoding" value="UTF-8"/>
    <package name="example" extends="json-default">
        <action name="JSONExample" class="org.crazyit.app.action.JSONExample">
            <!-- 配置类型的json的Result -->
            <result type="json">
                <!-- 为该Result指定参数 -->
                <param name="noCache">true</param>
                <param name="contentType">text/html</param>
                <!-- 设置只序列Action的map属性 -->
                <!--  param name="root">map</param -->
            </result>
        </action>
        <action name="*">
            <result>/WEB-INF/content/{1}.jsp</result>
        </action>
    </package>
</struts>

要注意的两个地方是:

①. 配置struts.i18n.encoding常量时,不使用GBK编码,而用UTF-8,因为Ajax的POST请求都是以UTF-8的方式进行编码的。

②. 自己的包要继承json-default包,而不再继承默认的default包,因为只有这个包下才有json类型的Result。

将视图名配置为json类型的Result时无需指定任何视图资源,JSON插件会将该Action序列化后发送给客户端。

实现JSP页面

为了方便地实现Ajax交互,本页面将使用jQuery,通过使用该框架,可以简单地访问页面中的DOM节点,包括更好地实现Ajax交互,这样避免了创建XMLHttpRequest对象、发送异步请求这些繁琐步骤。下面看JSP页面代码。

<%@ page contentType="text/html; charset=GBK" language="java" errorPage="" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>使用JSON插件</title>
    <script src="${pageContext.request.contextPath}/jquery-1.11.1.js"
    type="text/javascript">
    </script>
    <script type="text/javascript">
        function gotClick(){
            $("#show").hide();
            // 指定向JSONExample发送请求,将id为form1的表单所包含的表单控件转换为请求参数
            $.post("JSONExample" , $("#form1").serializeArray() ,
                // 指定回调函数
                function(data , statusText){
                    $("#show").height(80)
                        .width(240)
                        .css("border" , "1px solid black")
                        .css("border-radius" , "15px")
                        .css("background-color" , "#efef99")
                        .css("color" , "#ff0000")
                        .css("padding" , "20px")
                        .empty();
                    // 遍历JavaScript对象的各属性
                    for(var propName in data){
                        $("#show").append(propName + "-->"
                            + data[propName] + "<br />");
                    }
                    $("#show").show(600);
                },
                // 指定服务器响应为JSON数据
                "json");
        }
    </script>
</head>
<body>
<s:form id="form1">
    <s:textfield name="field1" label="Field 1"/>
    <s:textfield name="field2" label="Field 2"/>
    <s:textfield name="field3" label="Field 3"/>
    <tr><td colspan="2">
    <input type="button" value="提交" onclick="gotClick();"/>
    </td></tr>
</s:form>
<div id="show">
</div>
</body>
</html>

为了使用jQuery库,要导入jQuery的代码库到该页面。页面可以取得整个Action实例的状态信息,包括Action实例里每个属性名,以及对应的属性值,这样就能完全获得struts2对该请求的处理结果,剩下的就是,通过DOM操作把这些处理结果显示出来。

时间: 2024-08-04 12:07:32

struts2(十)之JSON基础的相关文章

Struts2(十六)Json

一.JSON Json就是浏览器和服务器之间交换数据的一种轻量级对象 javaSctipt中类似的对象操作 $(function() { var person = { "name" : "张三", "age" : 21, "wife" : "李四" }; $("#msg").append("姓名:" + person.name+"<br/>&qu

Struts2之—集成Json插件实现Ajax

   上篇博客介绍了Struts2中自定义结果集实现Ajax,也分析了它的缺点:这样自定义的结果集,写死了,不能做到客户端需要什么数据就传什么数据:Struts2之-自定义结果集实现ajax 本篇博客提出Struts2的集成Json插件,很好的解决了自定义结果集带来的问题. 一,引题 1,Json数据格式简介 因为JSON是脱离语言的理想的数据交换格式,所以它被频繁的应用在客户端与服务器的通信过程中,这一点是毋庸置疑的.而在客户端与服务器的通信过程中,JSON数据的传递又被分为服务器向客户端传送

【struts2】拦截器基础

1)拦截器是什么? 拦截器(Interceptor)是Struts2最强大的特性之一,它是一种可以让你在Action执行之前和Result执行之后进行一些功能处理的机制.来回顾一下官方给出的Struts2系统架构图中关于拦截器的部分,如下图所示: 这个图清晰的描述出了拦截器的运行地位,就是用来负责在Action执行之前和Result执行之后处理一些功能的类.也就是说,上图示意了有3个拦截器的类,分别是Interceptor1.Interceptor2和Interceptor3,它们分别执行不同的

JSON 基础解释.

JSON.(JavaScript Object Notation) JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) JSON 是轻量级的文本数据交换格式 JSON 独立于语言 * JSON 具有自我描述性,更易理解 JSON 是存储和交换文本信息的一种语法. 类似XML, 但比XML更小, 更快, 更易解析. JSOM 语法规则 JSON 语法是 JavaScript 对象表示法语法的子集. 数据在名称/值对中 数据由逗号分隔 花括号保

【转】struts2如何返回json和处理json

以下是小弟的一点研究成果,拿来和大家分享,我用了3到4中struts2操作json找了一种我认识最合理和最简单的,最下面有引用网上的资料,因为都一样就没有必要赘述了,上面都是我自己的实例,如有错误请大家指正. 需要的jar包是struts2.1.8,json插件就是2.1.8的struts2-json-plugin-2.1.8.1,因为json的第三方插件有很多,例如json-lib-2.4-jdk15和json虽然说可以实现json的处理,但是相对来说可能是有点麻烦,而S2自带的插件为简单一点

【Java EE 学习第31天】【JavaScript基础增强】【Ajax基础】【Json基础】

一.JavaScript基础增强 1.弹窗 (1)使用window对象的showModelDialog方法和showModelessDialog方法分别可以弹出模式窗口和非模式窗口,但是只能在IE中使用,所以不推荐使用,最好使用open方法弹窗. (2)open方法. (3)open方法弹窗实例. Base.html文档: <!DOCTYPE html> <html> <head> <title>Base.html</title> <met

java痛苦学习之路[十二]JSON+ajax+Servlet JSON数据转换和传递

1.首先客户端需要引入 jquery-1.11.1.js 2.其次javaweb工程里面需要引入jar包  [commons-beanutils-1.8.0.jar.commons-collections-3.1.jar.commons-lang-2.4.jar.commons-logging-1.1.3.jar.ezmorph-1.0.6.jar.json-lib-2.3-jdk15.jar] 3.客户端js端代码 4.servlet 服务器,映射的路径CardColl 以上就是整个过程,如果

json基础教程|理解Json

一. 在异步应用程序中发送和接收信息时,可以选择以纯文本和 XML 作为数据格式.这一期讨论一种有用的数据格式 JavaScript Object Notation(JSON),以及如何使用它更轻松地在应用程序中移动数据和对象.如果您阅读了本系列前面的文章,那么应已对数据格式有了相当的认识.前面的文章解释了在许多异步应用程序中如何恰当地使用纯文本和简单的名称/值对.可以将数据组合成下面这样的形式: firstName=Brett&lastName=McLaughlin&[email pro

Tensorflow深度学习之十二:基础图像处理之二

Tensorflow深度学习之十二:基础图像处理之二 from:https://blog.csdn.net/davincil/article/details/76598474 首先放出原始图像: 1.图像的翻转 import tensorflow as tf import cv2 # 这里定义一个tensorflow读取的图片格式转换为opencv读取的图片格式的函数 # 请注意: # 在tensorflow中,一个像素点的颜色顺序是R,G,B. # 在opencv中,一个像素点的颜色顺序是B,