什么叫异步请求,异步请求的几种方法

一、同步、异步请求
浏览器发送请求给服务器,其有同步请求和异步请求两种方式。

1同步请求

什么叫同步请求呢?

就是在发送一个请求之后,需要等待服务器响应返回,才能够发送下一个请求。

之前学的请求是通过浏览器地址栏发送请求,这种方式就是属于同步请求。

但是其有两个缺陷:

①请求必须要等待响应

如果遇到请求阻塞,网络延迟,用户需要等待,这样用户体验效果不好。

②请求时会携带所有的信息

比如说一个form表单,需要填入用户名,密码,手机号,等多个信息。

如果其中有一个信息填写错了,请求失败,又要全部重新填写,会很麻烦繁琐。

我只填写我填错了的不就好了么?

如何解决这个问题?就需要引入异步的概念了。

2异步请求

和同步请求相对,异步不需要等待响应,随时可以发送下一次请求。

如果是同步请求,需要将信息填写完整,再发送请求,服务器响应填写是否正确,再做修改。

但是异步请求是局部页面更新。

比如上述的手机号、密码,邮箱名,在填写时就会发送一个异步请求。

若是格式不正确,会提醒修改,而其它已经填写的正确信息不受影响。

二、原生的Ajax
什么叫Ajax呢?

说白了就是用来发送异步请求的一种方式。

先写一个异步请求案例,再逐步学习。

有一个按钮,给它注册个点击事件,点击就发送异步请求,其具体实现方式共五步:

①创建

是AJAX的基础。

Ajax就是通过这个对象来发送异步请求的。

②onreadystatechange事件

不要看这一大串这么长,翻译过来就是当前数据源的数据将要发生变化时,就可以理解成监听。

这个事件就是实现异步请求的核心关键。

为什么异步请求可以不用等待响应?

就是因为这儿设置了一个监听事件。

服务器被监听,一旦readyState为4并且status为200,表明响应成功。

这些属性都是怎么来的,w3c文档中就有说明:

readyState和status都对应有不同的数值,只不过4和200表示响应成功。

③绑定提交地址

open()方法,其有三个参数:

method:即请求方式,例子中是GET请求。
url:请求路径,”/getAjaxServlet”。
async:true表示为异步、false表示为同步,不写默认为true。
④发送请求

send()方法,将请求发送到服务器。

同样的道理,这些方法在w3c文档中也有详细说明。

⑤接收响应数据

也就是在②中判断响应成功时,接受响应的数据,有两种属性:

responseText :获取字符串形式的数据。
responseXML:获取XML形式的数据。
如果不是XML数据,都使用responseText。

以上就是原生的Ajax,当然实际使用过程中不会这样用,但是面试时可能会被问到。

并且这是基础,学一下也是有必要的。

三、JSON
JSON是一种轻量级的数据交换格式,具有良好的可读性以及便于编写。

在JSON之前一般都是使用xml来传递数据的,将这两种数据格式做一个对比:

相比较而言:json数据更加地简洁。

当然XML也并不是一无是处,其格式统一,就观感而言也有人更喜欢xml这种排版方式。

并且XML出来了很久了,推广深入人心,通用性高,喜欢XML的人还是挺多的。

但是对于传输数据来说,数据是否容易被解析?这是非常重要的。

而json相对于xml而言就具有这样的优势,故在这一块更加地常用。

Json的基础语法

一共有三种数据格式,分别说明:

①对象类型

格式为:{name:value,name:value……}

以键值对的方式存储数据,可以有多个键值对,键值对之间用逗号隔开。

其中name为字符串类型,而value是任意类型。

②数组/集合类型

格式为:[value,value…]

其中value是任意类型。

和数组就很类似,只不过是使用中括号将数据包裹起来的。

③混合类型

即包含对象类型和数组类型。

值得注意的是:

JSON数据的key值:字符串类型,必须加双引号。
JSON数据的value值:任意类型,如果是字符串则必须加双引号。
时间有限,其中关于json还有一些api就不做专门讲解了,今后使用到了边记边学就好了。

Published by

风君子

独自遨游何稽首 揭天掀地慰生平

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注