類數(shù)組轉(zhuǎn)數(shù)組
- 類數(shù)組:
- arguments: 用來接收實參的
- HTMLcollection: 獲取元素集合
- 類數(shù)組轉(zhuǎn)數(shù)組
- Array.prototype.slice.call(arguments) --> 完全兼容
- HTMLcollection 不兼容
- 瀏覽器異常捕獲
- 工作中：不用finally，因為無論成功或失敗，finally都會執(zhí)行
- 使用場景：解決 -> 報錯后，程序無法執(zhí)行的問題
- 如果在try...catch...中還希望阻斷程序執(zhí)行：throw new Error(‘報錯’);
try{
//標準瀏覽器
}catch(e){
// IE瀏覽器
}fanally{
// 無論是否成功都能執(zhí)行
}
JSON
- window.JSON 有兩個屬性
- JSON.parse(): 把JSON格式的字符串轉(zhuǎn)為JSON對象
- JSON.stringify(): 把JSON對象轉(zhuǎn)為JSON格式的字符串
如何判斷瀏覽器是否兼容
- try...catch...
- 屬性判斷：window.JSON
- in: 'json' in window
DOM映射：指的是HTML頁面結(jié)構(gòu)和獲取到的元素之間，存在一一對應(yīng)的關(guān)系
排序 3 步驟
- 類數(shù)組轉(zhuǎn)數(shù)組
- sort排序
- 把排好序的數(shù)組，重新朝如頁面
ajax請求數(shù)據(jù) 4 步驟
- 創(chuàng)建一個對象
- var xml = new XMLHttpRequest()
- 打開地址
- xml.open('GET','請求地址','是否異步')
- 響應(yīng)請求
xml.onreadystatechange=function(){
if(xml.readyState === 4 && /^2\d{2}$/.test(xml.status)){
var data = xml.responseText();
}
}
- 發(fā)送請求
- xml.send();
綁定數(shù)據(jù)，常用的有兩種
- 字符串拼接: 簡單、快捷
- 缺點：如果頁面中，有的元素身上有事件，那么，通過字符串拼接之后，所有的事件都沒了(可以忽略)
makeArray() : 類數(shù)組轉(zhuǎn)數(shù)組
- 瀏覽器異常捕獲
makeArray:function(arg){
var ary = [];
try{
ary = Array.prototype.slice.call(arg);
/* 或者寫成
* ary = [].slice.call(arg);
*/
}catch(e){
for(var i=0;i<arg.length;i++){
ary.push(ary[i]);
}
}
return ary;
}
JSON格式的字符串轉(zhuǎn)JSON對象
- "json" in window -> true
- JSON.parse()
- JSON.stringify()
jsonParse:function(jsonStr){
return 'json' in window ? JSON.parse(jsonStr) : eval('('+jsonStr+')')
}
排序 3 步走
- 類數(shù)組轉(zhuǎn)數(shù)組
- sort排序
- 把排好序的數(shù)組，重新插入頁面
求平均值
- 類數(shù)組轉(zhuǎn)數(shù)組
- sort排序
- 掐頭去尾
- (eval + join)+toFixed
// 求平均值：去掉一個最高分，去掉一個最低分，其他累加/個數(shù)
function average(){
var ary = [];
for(var i=0;i<arguments.length;i++){
ary.push(arguments[i]);
}
ary.sort(function(a,b){
return a-b;
}
ary.shift();
ary.pop();
return (eval(ary.join('+'))/ary.length).toFixed
}
var res = average(1.77777,8.77777,3.77777,9.7777,2.7777)
ajax數(shù)據(jù)請求
- 創(chuàng)建對象
- var xml = new XMLHttpRequest()
- 打開地址
- xml.open("GET","請求地址","是否異步")
- 響應(yīng)請求
- 準備好了 xml.readyState === 4
- 響應(yīng)成功 /^2\d{2}$/.test(xml.status)
- 發(fā)送請求 --- get請求
- xml.send() / xml.send(null);
var xml = new XMLHttpRequest();
xml.open('GET','data.txt',false);
xml.onreadystatechange = function(){
if(xml.readyState === 4 && /^2\d{2}$/.test(xml.status)){
var data = utils.jsonParse(xml.responseText);
}
}
xml.send();
http狀態(tài)碼
- 2XX：成功
- 3XX：重定向
- 4XX：請求錯誤
- 5XX：服務(wù)器的錯誤
綁定數(shù)據(jù)
- 字符串拼接
function bind(){
var str = '';
for(var i=0; i<data.length; i++){
str += '<li>\
<a href="#">\
<em>'+(i+1)+'</em>'+data[i].title+'</a>\
</li>';
}
oUl.innerHTML=str;
}
bind();
- 動態(tài)創(chuàng)建 --> 文檔碎片
function bind(){
var frg = document.createDocumentFragment();
for(var i=0; i<data.length; i++){
var oLi=document.createElement('li');
oLi.innerHTML='<a href="#">\
<em>'+(i+1)+'</em>'+data[i].title+'</a>';
frg.appendChild(oLi);
}
oUl.appendChild(frg);
frg = null;
}
bind()
