天天看點

es5.js 通過擴充js的prototype 讓不支援es5的浏覽器支援es5函數 (擴充數組)

擴充es5數組新增api

數組新增了幾個經典的周遊篩選等方法,非常友善。可以避免過渡使用for循環。通過javascript對象的原型擴充能提供一個統一的前端調用接口。

代碼如下:

(function(_window){
    //數組新增某些方法
    //forEach方法從頭到尾周遊數組,為每個數組元素調用指定函數并提供目前元素,目前索引與數組當做參數傳給函數
    Array.prototype.forEach||(Array.prototype.forEach=function(fun){
        var length=this.length;
        for(var i=0;i<length;i++){
            fun(this[i],i,this);
        }
    })
    //map方法周遊數組并調用指定函數,最後傳回一個數組,數組由所有函數傳回值組成
    Array.prototype.map||(Array.prototype.map=function(fun){
        var length=this.length;
        var returnArray=[];
        for(var i=0;i<length;i++){
            returnArray.push(fun(this[i],i,this));
        }
        return returnArray;
    })
    //filter相當一個數組的帥選器,周遊數組并調用指定函數,并傳回一個新數組,如果函數傳回true則添加傳回的數組。
    Array.prototype.filter||(Array.prototype.filter=function(fun){
        var length=this.length;
        var returnArray=[];
        for(var i=0;i<length;i++){
            if(fun(this[i],i,this)){
                returnArray.push(this[i]);
            }
        }
        return returnArray;
    })
    //every 周遊數組調用指定函數,當所有函數都傳回true 則every傳回true否則傳回false。
    Array.prototype.every||(Array.prototype.every=function(fun){
        var length=this.length;
        if(length==0) return true;
        //every應該盡早結束循環
        for(var i=0;i<length;i++){
            if(!fun(this[i],i,this)){
                return false;
            }
        }
        return true;
    })
    //some 周遊數組調用指定函數,當有一個函數傳回true就傳回true,當所有函數都傳回false就傳回false
    Array.prototype.some||(Array.prototype.some=function(fun){
        var length=this.length;
        if(length==0) return false;
        //some應該盡早結束循環
        for(var i=0;i<length;i++){
            if(fun(this[i],i,this)){
                return true;
            }
        }
        return false;
    })
    //reduce 周遊數組調用指定函數(函數需要2個參數),每次把調用函數的傳回值與下一個元素當做函數參數繼續調用。
    //對數組進行求和等操作很實用
    Array.prototype.reduce||(Array.prototype.reduce=function(fun,initval){
        var length=this.length;
        if(length==0) return "";
        if(length==1){
            return initval?fun(initval,this[0]):this[0];
        }
        var val=initval,
            firstindex=initval?0:2;
        if(!initval){
            val=fun(this[0],this[1]);            
        }
        for(var i=firstindex;i<length;i++){
            val=fun(val,this[i]);
        }
        return val;
    })
    //reduceRight 與reduce一樣 隻是從右到左周遊數組
    Array.prototype.reduceRight||(Array.prototype.reduceRight=function(fun,initval){
        var length=this.length;
        if(length==0) return "";
        if(length==1){
            return initval?fun(initval,this[0]):this[0];
        }
        var val=initval,
            firstindex=initval?length-1:length-3;
        if(!initval){
            val=fun(this[length-1],this[length-2]);    
        }
        for(var i=firstindex;i>=0;i--){
            val=fun(val,this[i]);
        }
        return val;
    })
    Array.prototype.indexOf||(Array.prototype.indexOf=function(val){
        var length=this.length;
        if(!length){
            return -1;
        }
        for(var i=0;i<length;i++){
            if(this[i]===val){
                return i;
            }
        }
        return -1;
    })
    Array.prototype.lastIndexOf||(Array.prototype.lastIndexOf=function(val){
        var length=this.length;
        if(!length){
            return -1;
        }
        for(var i=length-1,k=0;i>=0;i--){
            k++;
            if(val===this[i]){
                return k;
            }
        }
        return -1;
    })
    Array.prototype.isArray||(Array.prototype.isArray=function(){
        return Object.prototype.toString.call(this)==="[object Array]";
    })
})(window);