本文已参与「新人创作礼」活动, 一起开启掘金创作之路。
ajax的请求方式
其实从本质意义上来讲,请求的方式之间是没有任何区别的,只是应用不同,不管哪一种方式都可以向服务器传递数据
- GET:一般应用于从服务器获取数据(给服务器的数据少,从服务器拿的数据多),一般使用URL后加问号传参的方式向服务器传递内容
- POST:一般应用于向服务器推送数据(给服务器的多,从服务器拿下来的少),一般使用请求主体的方式向服务器传递内容
- PUT:一般应用于给服务器上增加资源文件(上传图片功能),向服务器传输内容方式与POST一致
- DELETE:一般应用于从服务器上删除资源文件,向服务器传输内容方式与get一致
- HEAD:一般应用于只获取服务器的响应头信息,向服务器传输内容方式与get一致
axios
axios是第三方库,为我们封装了非常好用的请求方法,我么可以直接使用里面的 axios().then()来发送和处理数据,不用操作XMLHttpRequest对象了(它的底层还是操作xhr)
axios的get请求
GET参数的本质就是把参数用 & 符号链接起来放到路径的最末尾用 ?分隔。
axios的GET请求
axios({
method: '请求的类型',
url: '请求的URL地址',
params: {id: 1, bookname: '红楼梦'} // params用于传递参数,可选
}).then((result) => {
// .then 用来指定请求成功之后的回调函数
// 形参中的 result 是请求成功之后的结果
})
axios的POST请求
axios({
method: '请求的类型',
url: '请求的URL地址',
data: {id: 1, bookname: '红楼梦'} // data用于传递JSON类型的字符串,axios会自动将data的值(对象类型)转换成JSON类型的字符串
}).then((response) => {
// .then 用来指定请求成功之后的回调函数
// 形参中的 response 是请求成功之后的结果
})
防抖和节流
防抖
防抖是在一段时间内频发触发某个操作,只执行最后一次
作用:可以减少服务器的压力
比如在1s内,我多次点击button按钮,每当我点击,就重新计时1s,直到我最后一次点击,然后过1s执行这个操作
以英雄联盟举例:比如玩英雄联盟,防抖就相当于回城,回城期间不能动,如果动了就得重新计时回城
节流
节流是在一段时间内,只执行第一次代码
作用:也是减少服务器的压力
比如在1s内,我点击button按钮,只执行我第一次点击,等过了1s后我在点击才有效
以英雄联盟举例:相当于英雄联盟的英雄技能冷却,当我们使用一次技能必须等对应的冷却时间后才能继续用