2018-01-29 自己实现一个AJAX

JS可以设置任意请求header吗?
可以：用setRequestHeader
放在.open和.send之间

image.png
image.png

请求头显示出来了

那第4部分能不能设置？（要用POST请求）
搜 js set request body
.send()

image.png
image.png

getAllResponseHeaders()
getResponseHeader

image.png

所有的响应的头——字符串

request.statusText就是获取OK啊什么的

requset.responseText

image.png

AJAX的请求和响应

服务端需要端口号

image.png

jquery.ajax

window.jQuery.ajax的内存图

image.png

写jquery.ajax的目的是把4行代码变成一行

image.png image.png

问题：时间长了，无法确定下面的参数是什么意思

image.png

问题：当使用GET方法，第三个参数其实不需要的，那怎么办？只能写undefined或者null，代码看起来丑
比如某个API xxx(null,null,null,null,1)完全不知道每个参数的意思

办法：用有结构的参数

箭头函数是没有arguments的

image.png

使用方用到了successFn，而里面的参数x是被调用方的第一个参数request.responseText，即x <-request.responseText，这就叫做callback

如果请求失败了，有没有可能依然存在第4部分？
答案：是的

模拟下：

image.png image.png
image.png image.png
image.png

一个函数如何接受两种形式的参数？

image.png image.png image.png
image.png

ES5和ES6

如果成功了，会打印出responsText和成功

image.png

'成功'是作为第二个then的参数传进去的
第一个then里的return的值会传递给下一个then的输入参数
问题：为什么成功之后打印出来的结果是个对象？（responsText）

image.png

因为jQuery发现你的返回值的content-type是text/json，json这4个字母，会自动把字符串转换成对象

image.png

代码变更

window的promise是怎么的？

image.png

要用promise，需要new一个，需要传入一个函数

image.png
promise返回的对象带有then属性，所以可以调用then
then也返回一个promise对象，所以可以继续then