筆記-JavaWeb學習之旅18

時間 2019-11-10

標籤筆記 javaweb 學習之旅欄目 Java 简体版

原文原文鏈接

AJAX:ASynchronous JavaScript And XML 異步的JavaScript 和XML

異步和同步：客戶端和服務器端相互通訊的基礎上javascript

同步：客戶端操做後必須等待服務器端的響應，在等待的期間客戶端不能作其餘操做html

異步：客戶端操做後，不須要等待服務器端的響應，在服務器處理請求的過程當中，客戶端能夠進行其餘的操做java

JQuery對AJAX實現jquery

實現異步的方式

使用$.ajax()發送異步請求ajax

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-3.3.1.min.js"></script>
    <script>
        //定義方法
        function fun(){
            //使用JQuery的方式實現異步請求
            $.ajax({
                url:"ajaxServlet1",//必選參數
                type:"POST",//請求方式，可選參數
                data:{"username":"jack","age":23},//請求參數，可選
                success:function(data){
                    alert(data);//data變量是服務器響應給會的結果值
                },//響應成功後的回調函數,可選
                error:function(){
                    alert("出錯啦...");
                },//請求響應出現錯誤，會執行的回調函數
               dataType:"text"//設置接受到的響應數據的格式
            });
        }
    </script>
</head>
<body>
    <input type="button" value="發送異步請求" onclick="fun();">
    <input>
</body>
</html>

package com.data.ajax;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

@WebServlet("/ajaxServlet1")
public class AjaxServlet1 extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //獲取請求參數
       String username =  request.getParameter("username");
       String age =  request.getParameter("age");
        System.out.println(username);
       //響應請求請求
        response.getWriter().write("hello :" + username+age);
    }

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

使用$.get()和$.post()發送異步請求json

$.get(url,[data],[callback],[type])數組

url:請求路徑服務器

data:請求參數app

callback:回調函數，載入成功後執行的函數dom

type:響應結果的類型

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-3.3.1.min.js"></script>
    <script>
        function fun() {
            $.get("ajaxServlet1",{"username":"zhangsan"},function (data) {
                alert(data)
            })
        }
    </script>
</head>
<body>
    <input type="button" value="發送異步請求" onclick="fun();">
    <input>
</body>
</html>

$.post(url,[data],[callback],[type])

JSON:

1.概念：JavaScript Object Notation JavaScript對象表示法

json如今多用於存儲和交換文本信息的語法

進行數據的傳輸

JSON比XML更小，更快，更易解析

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        var person1={"name":"張三",age:23,'gender':"true"};
        //遍歷對象
        for(key in person1){
            alert(key+":"+person1[key]);
        }
        //獲取name的值
        var name1 = person1.name;
        alert(name1)
        //嵌套格式{}->[]
        var person2 = {
            "person":[
            {"name":"張三","age":23,"gender":true},
            {"name":"李四","age":24,"gender":true},
            {"name":"王五","age":25,"gender":false},
        ]
        };
        //嵌套格式  []-{}
        var person3=[
            {"name":"張三","age":23,"gender":true},
            {"name":"李四","age":24,"gender":true},
            {"name":"王五","age":25,"gender":false},
        ]
        alert("===============")
        //遍歷數組person3
        for(var i=0;i<person3.length;i++){
            var l=person3[i];
            for(key in l ){
                 alert(key+l[key]);
            }
        }
    </script>
</head>
<body>
</body>
</html>

JSON解釋器--jackson

常見JSON解釋器：Jsonlib,Gson,fastjson,jackson

把Java對象轉換爲JSON對象

註解：@JsonIgnore:排除不須要的屬性，@JsonFormat:屬性值格式化

複雜java對象轉換

1.List:轉換出來的是數組

3.Map:轉換出來結果與對象格式一致

package com.data.domain;

import com.fasterxml.jackson.annotation.JsonFormat;

import java.util.Date;

public class Person {
    private String name;
    private String gender;
    private int age;
    @JsonFormat(pattern = "yyyy-MM-dd")//設置指定格式
    private Date birthday;

    public Person(String name, String gender, int age, Date birthday) {
        this.name = name;
        this.gender = gender;
        this.age = age;
        this.birthday = birthday;
    }
    public Person(String name, String gender, int age) {
        this.name = name;
        this.gender = gender;
        this.age = age;
    }

    public Person() {

    }

    @Override
    public String toString() {
        return "Person{" +
                "name='" + name + '\'' +
                ", gender='" + gender + '\'' +
                ", age=" + age +
                ", birthday=" + birthday +
                '}';
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getGender() {
        return gender;
    }

    public void setGender(String gender) {
        this.gender = gender;
    }

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }

    public Date getBirthday() {
        return birthday;
    }

    public void setBirthday(Date birthday) {
        this.birthday = birthday;
    }
}

package com.data.test;

import com.data.domain.Person;
import com.fasterxml.jackson.databind.ObjectMapper;
import org.junit.Test;
import java.io.File;
import java.util.*;

public class TestDemo1 {
    //把Java對象轉化爲JSON對象
    @Test
    public void test1() throws Exception {
        Person person = new Person("張三","男",20);
        //建立Jackson的核心對象，ObjectMapper
        ObjectMapper mapper = new ObjectMapper();
   /*
    writeValueAsString(obj):將對象轉爲json字符串
    轉換方法：writeValue(參數1,obj):該方法有不少重載方法
    參數1：
        File:將obj對象轉換爲JSON字符串，並保存到指定的文件中
        Writer:將Obj對象轉換爲JSON字符串，並將json數據填充到字符輸出流中
        OutputStream:將obj對象轉換爲JSON字符串，並將json數據填充到字節輸出流中

   */
        String s = mapper.writeValueAsString(person);
        System.out.println(s);//{"name":"張三","gender":"男","age":20}
        //將JSON寫入文件
        mapper.writeValue(new File("e://a.txt"),person);
    }
    @Test
    public void test2() throws Exception {
        Person person = new Person("張三","男",20, new Date());
        ObjectMapper mapper = new ObjectMapper();
        String s = mapper.writeValueAsString(person);
        System.out.println(s);
    }
        //List集合轉JSON對象
    @Test
    public void test3() throws Exception {
        Person person1 = new Person("張三","男",20, new Date());
        Person person2 = new Person("李四","女",22, new Date());
        Person person3 = new Person("王五","男",23, new Date());
        Person person4 = new Person("趙六","女",24, new Date());
        //建立List集合
        List<Person> list = new ArrayList<>();
        list.add(person1);
        list.add(person2);
        list.add(person3);
        list.add(person4);
       //把List集合轉換爲JSON對象
        ObjectMapper mapper = new ObjectMapper();
        String s = mapper.writeValueAsString(list);
        System.out.println(s);
    }

    @Test
    public void test5() throws Exception {
        Map<String,Object> map = new HashMap<>();
        map.put("name","張三");
        map.put("age",22);
        map.put("gender","男");
        ObjectMapper mapper = new ObjectMapper();
        String s = mapper.writeValueAsString(map);
        System.out.println(s);
    }
    //把JSON對象轉換爲java對象
    @Test
    public void test6() throws Exception {
        //初始化JSON字符串
        String json = "{\"gender\":\"男\",\"name\":\"張三\",\"age\":22}";
        ObjectMapper mapper = new ObjectMapper();
        Person s = mapper.readValue(json,Person.class);
        System.out.println(s);
    }

}

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。