AJAX、Axios异步框架以及JSON知识点

AJAX：

        AJAX概念：AJAX（Asynchronous JavaScript And XML）：异步的JavaScript和XML

        AJAX作用：

                1、与服务器进行数据交换：通过AJAX可以给服务器发送请求，并获取服务器响应的数据。        

                        使用了AJAX和服务器通信，就可以使用HTML+AJAX来替换JSP页面了

                2、异步交互：可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术，如：搜索联想、用户名是否可用检索，等等...

        

        AJAX快速入门：

                1、编写AjaxServlet，并使用response输出字符串

                2、创建XMLHttpRequest对象：用于和服务器交换数据

                3、向服务器发送请求

                4、获取服务器响应数据

Axios异步框架：

        Axios对原生的AJAX进行封装，简化书写

        官网：https://www.axios-http.cn

        Aixos快速入门：

                1、引入axios的js文件：

                2、使用axios发送请求，并获取响应结果

        Axios请求方式别名：

                为了方便起见，Axios已经为所有支持的请求方式提供了别名

                        axios.get(url [, config])

                        axios.delete(url [, config])

                        axios.head(url [, config])

                        axios.options(url [, config])

                        axios.post(url, data [, config])

                        axios.put(url, data [, config])

                        axios.patch(url, data [, config])

                发送get请求             

axios.get("http://localhost/ajax_demo_war/axiosServlet?username=zhangsan").then(
    function (resp){
        alert(resp.data);
    }
)

        发送post请求

axios.post("http://localhost/ajax_demo_war/axiosServlet", "username=zhangsan").then(
    function (resp){
        alert(resp.data);
    }
)

JSON：

        JSON概念：JavaScript Object Notation。JavaScript对象表示法

                             由于其语法简单，层次结构鲜明，现多用于作为数据载体，在网络中进行数据传输

                JavaScript对象：

                        {

                                name: "zhangsan",

                                age:23,

                                city:"北京"

                        }

                JSON:

                        {

                                "name":"zhangsan",

                                "age":23,

                                "city":"北京"

                        }

        JSON基础语法：

                定义：

                        var 变量名 = {        "key1":value1,

                                                       "key2":value2,

                                                        ...

                                                };

                示例：

                        var json =

                        {

                                "name":"zhangsan",

                                "age":23,

                                "addr":["北京", "上海", "西安"]

                        };

                获取数据：        变量名.key        json.name

                        value的数据类型为：

                                数字（整数或浮点数）

                                字符串（在双引号中）

                                逻辑值（true或false）

                                数组（在方括号中）

                                对象（在花括号中）

                                null

        JSON数据和Java对象转换：

                请求数据：JSON字符串转为Java对象

                响应数据：Java对象转为JSON字符串

                

                Fastjson是阿里巴巴提供的一个Java语言编写的高性能功能完善的JSON库，是目前Java语言中最快的JSON库，可以实现Java对象的JSON字符串的相互转换。

                使用：

                        1、导入坐标

<dependency>
  <groupId>com.alibaba</groupId>
  <artifactId>fastjson</artifactId>
  <version>1.2.62</version>
</dependency>

                        2、Java对象转JSON        

                                String jsonStr = JSON.toJSONString(obj);        

                        3、JSON字符串转Java对象

                                User user = JSON.parseObject(jsonUser, User.class);