JSON入门

最新推荐文章于 2020-09-26 18:56:11 发布

Switchvov

最新推荐文章于 2020-09-26 18:56:11 发布

阅读量2.2k

点赞数

分类专栏： JSON Javascript 文章标签： json javascript java

如需转载，请联系本人获取许可且必须注明出处，详见联系方式。

本文链接：https://blog.csdn.net/q547550831/article/details/52933203

版权

Javascript 同时被 2 个专栏收录

18 篇文章 0 订阅

订阅专栏

JSON

1 篇文章 0 订阅

订阅专栏

JSON入门

基本介绍

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

——参考《百度百科》

PS：JSON工具网站：json.cn，sojson

JSON基本格式

JSON对象格式

{"key":"value","key":"value",....}

键和值使用冒号分隔。

标准规范要求key必须使用双引号，value如果没有使用双引号表示变量。

// json对象
var user = {
    "username":"Switch",
    "password":"123456"
};
// 输出：Switch
alert(user.username); 
// 修改username
user.username = "Kity";

JSON数组

[ obj1 , obj2 , obj3 , ....]

表示一组值，多个值使用逗号分隔

// json数组
var names = ['Switch','Kity','Tom'];
// 输出：Kity
alert(names[1]);

值（value）可以是双引号括起来的字符串（string）、数值(number)、true、false、 null、对象（object）或者数组（array）。这些结构可以嵌套。

嵌套结构

案例1

// 综合案例
var data = [
    {"id":"b001","title":"json","price":"998"},      
    {"id":"b002","title":"java","price":"2510"},      
    {"id":"b003","title":"javascript","price":"888"},      
];
// 输出：java
alert(data[1].title);
// 输出：888
alert(data[2].price)

案例2

var data = {
    "programmers": [{
        "firstName": "Brett",
        "lastName": "McLaughlin",
        "email": "aaaa"
    }, {
        "firstName": "Jason",
        "lastName": "Hunter",
        "email": "bbbb"
    }, {
        "firstName": "Elliotte",
        "lastName": "Harold",
        "email": "cccc"
    }],
    "authors": [{
        "firstName": "Isaac",
        "lastName": "Asimov",
        "genre": "sciencefiction"
    }, {
        "firstName": "Tad",
        "lastName": "Williams",
        "genre": "fantasy"
    }, {
        "firstName": "Frank",
        "lastName": "Peretti",
        "genre": "christianfiction"
    }],
    "musicians": [{
        "firstName": "Eric",
        "lastName": "Clapton",
        "instrument": "guitar"
    }, {
        "firstName": "Sergei",
        "lastName": "Rachmaninoff",
        "instrument": "piano"
    }]
};
// 输出：Hunter
alert(data.programmers[1].lastName);

JSON-Lib

json-lib是将java对象与json数据相互转换的工具。

下载地址：Json-Lib

常用对象

JSONObject， java对象（JavaBean、Map）与JSON数据转换工具类
JSONArray，java集合（List、Array）与JSON数据转换工具类

常用方法

static fromObject(…)，静态方法，用于将java对象或集合转换成jsonlib对象。
toString()，将jsonlib对象转换成 json字符串。

案例

// 对象或map————>JSON
User user = new User();
user.setUid("u01");
user.setUsername("switch");
String jsonObject = JSONObject.fromObject(user).toString();

// 输出结果：{"uid":"u01","username":"switch"}
System.out.println(jsonObject);

Map<String, String> maps = new LinkedHashMap<>();
maps.put("username", "switch");
maps.put("password", "123456");
String jsonMap = JSONObject.fromObject(maps).toString();

// 输出结果：{"username":"switch","password":"123456"}
System.out.println(jsonMap);

// 数组或List对象————>JSON
String[] strings = {"switch", "kity"};
String jsonArray = JSONArray.fromObject(strings).toString();

// 输出结果：["switch","kity"]
System.out.println(jsonArray);

List<String> lists = new ArrayList<>();
lists.add("switch");
lists.add("kity");
String jsonList = JSONArray.fromObject(lists).toString();

// 输出结果：["switch","kity"]
System.out.println(jsonList);

// 综合案例
User user1 = new User();
user1.setUid("uid1");
user1.setUsername("switch");
User user2 = new User();
user2.setUid("uid2");
user2.setUsername("kity");
List<User> users = new ArrayList<>();
users.add(user1);
users.add(user2);
String jsonComplex = JSONArray.fromObject(users).toString();

// 输出结果：[{"uid":"uid1","username":"switch"},{"uid":"uid2","username":"kity"}]
System.out.println(jsonComplex);

AJax中使用JSON

register.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>注册</title>
        <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js"></script>
        <script type="text/javascript">
            function checkUser(obj) {
                // post提交，并且接收格式为json
                $.post("${pageContext.request.contextPath }/CheckUserNameIsExistServlet", {"username":obj.value}, function(data) {
                    // 获取msg信息，并放入usename_msg对应标签中
                    $("#usename_msg").html(data.msg);
                    // 判断是否能够注册，能则提交按钮可用，不能则为disabled
                    if(data.isOk == "true") {
                        $("#sub").removeProp("disabled");
                    } else {
                        $("#sub").prop("disabled", "disabled");
                    }
                }, "json");
            }
        </script>
    </head>
    <body>
        <form action="${pageContext.request.contextPath }/RegisterServlet" method="post">
            <table width="60%" height="60%" align="center" bgcolor="#ffffff">
                <tr>
                    <td width="20%">用户名:</td>
                    <td width="40%">
                        <input type="text" name="username" id="username" onblur="checkUser(this)">
                    </td>
                    <td width="40%">
                        <span id="usename_msg">

                        </span>
                    </td>
                </tr>
                <tr>
                    <td>密码:</td>
                    <td><input type="password" name="password" id="password"></td>
                    <td></td>
                </tr>
                <tr>
                    <td>Email:</td>
                    <td><input type="text" name="email" id="email"></td>
                    <td></td>
                </tr>
                <tr>
                    <td>性别:</td>
                    <td>
                        <input type="radio" name="sex" value="男">男 
                        <input type="radio" name="sex" value="女">女 
                    </td>
                    <td></td>
                </tr>
                <tr>
                    <td>出生日期</td>
                    <td><input type="date" name="birthday"></td>
                    <td></td>
                </tr>
                <tr>
                    <td colspan="3"><input type="submit" id="sub" value="注册"/></td>
                </tr>
            </table>
        </form>
    </body>
</html>

CheckUserNameIsExistServlet.java

package com.itheima.web.servlet;

import java.io.IOException;
import java.sql.SQLException;
import java.util.LinkedHashMap;
import java.util.Map;

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

import com.itheima.domain.User;
import com.itheima.service.UserService;

import net.sf.json.JSONObject;

/**
 * 检测用户名是否存在Servlet
 * 
 * @author Switch
 * @data 2016年10月25日
 * @version V1.0
 */
public class CheckUserNameIsExistServlet extends HttpServlet {
    private static final long serialVersionUID = 7813407020472534606L;

    public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        response.setContentType("text/html;charset=utf-8");
        request.setCharacterEncoding("utf-8");
        // 获取用户名参数
        String username = request.getParameter("username");

        // 查询用户
        try {
            // 获取用户
            User user = new UserService().getUserByUserName(username);
            // System.out.println(user);

            // 创建JSON所需的Map对象
            Map<String, String> map = new LinkedHashMap<>();
            // 用户名未注册
            if (user == null) {
                // 填写json信息
                map.put("isOk", "true");
                map.put("msg", "<font color='green'>该用户名可以使用</span>");
            } else {
                // 填写json信息
                map.put("isOk", "false");
                map.put("msg", "<font color='red'>该用户名已被占用</span>");
            }
            // 转换成json
            String json = JSONObject.fromObject(map).toString();
            // 响应
            response.getWriter().write(json);
        } catch (SQLException e) {
            e.printStackTrace();
        }
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }
}