類數(shù)組轉數(shù)組

• 類數(shù)組:
  • arguments: 用來接收實參的
  • HTMLcollection: 獲取元素集合
• 類數(shù)組轉數(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格式的字符串轉為JSON對象
  • JSON.stringify(): 把JSON對象轉為JSON格式的字符串

如何判斷瀏覽器是否兼容

• try...catch...
• 屬性判斷：window.JSON
• in: 'json' in window

DOM映射：指的是HTML頁面結構和獲取到的元素之間，存在一一對應的關系

排序 3 步驟

1. 類數(shù)組轉數(shù)組
2. sort排序
3. 把排好序的數(shù)組，重新朝如頁面

ajax請求數(shù)據(jù) 4 步驟

1. 創(chuàng)建一個對象
   • var xml = new XMLHttpRequest()
2. 打開地址
   • xml.open('GET','請求地址','是否異步')
3. 響應請求

xml.onreadystatechange=function(){
    if(xml.readyState === 4 && /^2\d{2}$/.test(xml.status)){
        var data = xml.responseText();
    }
}

4. 發(fā)送請求
   • xml.send();

綁定數(shù)據(jù)，常用的有兩種

• 字符串拼接: 簡單、快捷
  • 缺點：如果頁面中，有的元素身上有事件，那么，通過字符串拼接之后，所有的事件都沒了(可以忽略)

makeArray() : 類數(shù)組轉數(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格式的字符串轉JSON對象

• "json" in window -> true
• JSON.parse()
• JSON.stringify()

jsonParse:function(jsonStr){
    return 'json' in window ? JSON.parse(jsonStr) : eval('('+jsonStr+')')
}

排序 3 步走

1. 類數(shù)組轉數(shù)組
2. sort排序
3. 把排好序的數(shù)組，重新插入頁面

求平均值

1. 類數(shù)組轉數(shù)組
2. sort排序
3. 掐頭去尾
4. (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ù)請求

1. 創(chuàng)建對象
   • var xml = new XMLHttpRequest()
2. 打開地址
   • xml.open("GET","請求地址","是否異步")
3. 響應請求
   • 準備好了 xml.readyState === 4
   • 響應成功 /^2\d{2}$/.test(xml.status)
4. 發(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：服務器的錯誤

綁定數(shù)據(jù)

1. 字符串拼接

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();

2. 動態(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()