异步和单线程
同步和异步的区别?
ajax 同步和异步区别?
我们在使用 ajax 一般都会使用异步处理。
异步处理呢就是我们通过事。00件触发到 ajax,请求服务器,在这个期间无论服务器有没有响应,客户端的其他代码一样可以运行。
同步处理:我们通过实践触发 ajax,请求服务器,在这个期间等待服务器处理请求, 在这个期间客户端不能做任何处理。当 ajax 执行完毕才会继续执行其他代码。
同步:提交请求->等待服务器处理->处理完毕返回 这个期间客户端浏览器不能干任何事异步: 请求通过事件触发->服务器处理(这是浏览器仍然可以作其他事情)->处理完毕同步需要等待返回结果才能继续,异步不必等待,一般需要监听异步的结果
异步应用场景
异步:在异步模式下,当我们使用AJAX发送完请求后,可能还有代码需要执行。这个时候可能由于种种原因导致服务器还没有响应我们的请求,但是因为我们采用了异步执行方式,所有包含AJAX请求代码的函数中的剩余代码将继续执行。如果我们是将请求结果交由另外一个JS函数去处理的,那么,这个时候就好比两条线程同时执行一样。
同步:在同步模式下,当我们使用AJAX发送完请求后,后续还有代码需要执行,我们同样将服务器响应交由另一个JS函数去处理,但是这时的代码执行情况是:在服务器没有响应或者处理响应结果的JS函数还没有处理完成return时,包含请求代码的函数的剩余代码是不能够执行的。就好比单线程一样,请求发出后就进入阻塞状态,知道接触阻塞余下的代码才会继续执行。
callbackHell & Promise
const url1 = ‘/data1.json’
const url2 = ‘/data2.json’
const url3 = ‘/data3.json’
// callbackHell
$.get(url1, () => {
// …
$.get(url2, () => {
// …
$.get(url3, () => {
// …
})
})
})
// Promise
function getData(url) {
return new Promise((resolve, reject) => {
$.ajax({
url,
success(data) {
resolve(data)
},
error(err) {
reject(err)
}
})
})
}
// 将callbackHell扁平化
getData(url1)
.then((data1) => {
// …
return getData(url2)
})
.then((data2) => {
// …
return getData(url3)
})
.then((data3) => {
// …
})
.catch((err) => {
// …
})