1. ajax 的五個步驟
1.建立xmlHttpRequest對象
if ( window.XMLHttpRequest ) {
xmlHttp = new XMLHttpRequest();
if( xmlHttp.overrideMimeType ) {
xmlHttp.overrideMimeType("text/xml");
}
} else if ( window.ActiveXobject ) {
var activeName = ["MSXML2.XMLHTTP", "Microsoft.XMLHTTP"];
for (var i = 0; i < activeName.length; i++) {
try {
xmlHttp = new ActiveXobject(activeName[i]);
break;
} catch(e) {}
}
}
if (!xmlHttp) {
alert("創(chuàng)建xmlhttprequest對象失敗");
} else {}
2.設置回調函數(shù)
xmlHttp.onreadystatechange = callback;
function callback(){}
3.使用OPEN方法與服務器建立連接 xmlHttp.open("get","ajax?name="+ name,true)
此步注意設置http的請求方式(post/get),如果是POST方式,注意設置請求頭信息xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded")
4.向服務器端發(fā)送數(shù)據(jù)
xmlHttp.send(null);
如果是POST方式就不為空
5.在回調函數(shù)中針對不同的響應狀態(tài)進行處理
if (xmlHttp.readyState == 4){ //判斷交互是否成功
if (xmlHttp.status == 200){ //獲取服務器返回的數(shù)據(jù) //獲取純文本數(shù)據(jù)
var responseText =xmlHttp.responseText;
document.getElementById("info").innerHTML = responseText;
}
}
2. 點擊a標簽后的步驟
- 檢查a標簽里的URL是否為空。
- 瀏覽器檢查緩存,如果請求對象存在緩存并且能夠被使用,直接跳到第9步。
- 瀏覽器詢問操作系統(tǒng)提供服務器的IP地址。
- 操作系統(tǒng)進行DNS查看并將IP地址回復給到瀏覽器。
- 瀏覽器打開到服務器的TCP連接(對于HTTPS這個步驟要復雜得多)。
- 瀏覽器通過TCP連接發(fā)送HTTP請求。
- 瀏覽器接收到HTTP響應,且可以關閉TCP連接,或者將其重新用于其他請求
- 瀏覽器檢查響應是否是重定向(3xx結果狀態(tài)代碼)、授權請求(401)、錯誤(4xx和5xx)等;這些處理方式與正常響應(2xx)不同。
- 如果可緩存,則響應存儲在緩存中
- 瀏覽器解碼響應(例如,如果它是gzipped)
- 瀏覽器決定如何處理響應(例如,它是一個HTML頁面,一個圖像,還是一個聲音剪輯?)
- 瀏覽器呈現(xiàn)響應,或為無法識別的類型提供下載對話框
3. 擴展運算符(spread)是三個點(...)
console.log(...[1,2,3])
// 1 2 3
Math.max(...[14, 3, 77])
//獲得元素最大值,簡化代碼
4. Array.from把類似數(shù)組的對象的值轉化數(shù)組
let arrayLike = {
'0': 'a',
'1': 'b',
'2': 'c',
length: 3
};
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']
Array.from還可以接受第二個參數(shù),作用類似于數(shù)組的map方法,用來對每個元素進行處理,將處理后的值放入返回的數(shù)組。
Array.from([1, 2, 3], (x) => x * x)
// [1, 4, 9]
5.數(shù)組實例的 flat(),flatMap()
[1, 2, [3, 4]].flat()
// [1, 2, 3, 4]
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]
6.數(shù)組去重用Set
function dedupe(array) {
return Array.from(new Set(array));
}
dedupe([1, 1, 2, 3]) // [1, 2, 3]