JS數組學習之splice方法

array.splice(start,deleteCount,item1,item2....)

splice方法從array移除n個元素(大於或等於0)，而且能夠用新的item替換被移除的元素。參數start是從數組array中移除元素的最開始位置（數組的索引，正負數表示方向，負數表示從數組末尾開始往前數,可是不論正負，移除的方向始終是索引遞增的方向）。參數deleteCounts是要移除的元素個數(若是設置爲 0，則不會刪除)。後面的items用來替換被移除的位置上(可多可少)。splice最終返回一個包含被移除元素的數組，而且原數組也被改變。

splice主要做用是從一個數組中刪除元素（改變原數組），slice主要做用是從數組中複製一段元素（不改變原數組），二者有本質區別

用法：

var a = [1,2,3,4,5],b=a.splice(0,2,6,7,8);
//a ==> [6, 7, 8, 3, 4, 5]
//b ==> [1,2]

原生方法實現分析:

1. 確認開始索引位置 start，最小爲0。

2. 確認須要移除的長度 deleConuts，最小爲0，

3. 確認原數組變化後的新長度

4. 按照索引位置，獲取deleConuts長度的新數組，用於返回

5. 對原數組進行替換items新元素。

最終代碼實現

//按照步驟，數組會被分紅3個部分，左邊,arr_left,中間被刪除arr_delete,右邊arr_right
Array.prototype.splice = function(start,deletCounts){
    var max = Math.max,
        min = Math.min,
        len = this.length,//數組長度
        insertCounts = max(arguments.length - 2 ,0),//用來替換的數組的個數，不包括參數值中的前2個
        result = [],//存儲用來返回的數組
        ;
    //肯定索引開始位置
    start = start >= 0 ? start || len + start ;//負數表示從數組末尾開始往前數
    //最多能刪除從索引開始到數組結束位置 
    deletCounts = max(min(typeof 'deletCounts' === 'number' ? deletCounts : len ,len - start),0);
    var changeCounts = insertCounts - deletCounts ,//新增-刪除
        new_len = len + changeCounts ;//原數組變化後的新長度
    //生成返回的數組    
    for (var i = 0; i < deletCounts; i++) {
        var item = this[start + i];//從索引開始後的元素（包括start）
        if(item !== undefined){
            //超過原數組最大索引值會不存在
            result[i] = item
        }
        if(start + i > len - 1){
            //超過原數組最大索引，後續不須要再處理
            break 
        }
    } 
    //替換被刪除項
    var arr_right_length = len - start - deletCounts;//右邊arr_right長度
    if(changeCounts > 0 ){
        //新增大於刪除，則將數組右邊部分arr_right 向右挪動差值個單位，至關於右邊的索引都增長 changeCounts(防止有重疊部分，從右往左複製)
        var i = 1;
        while(arr_right_length){
            this[new_len - i] = this[len - i];
            k ++;
            arr_right_length -- ;
        }
    }else if(changeCounts < 0){
        //新增小於刪除，則將右邊arr_right 向左挪動差值個單位
        var i = start + insertCounts ;//右邊新的索引
        for(var k = 0 ;k < arr_right_length ;k++){
            this[i] = this[i - changeCounts] ;//由於是負數，因此 i -changeCounts表示更大
            i ++ ;
        }
        this.length = new_len;//須要手動修改數組長度
    }   
    for(var i = 0;i < insertCounts ; i++){
        //對新增的部分進行賦值處理
        this[start + i] = arguments[2+i]
    }
    //返回被刪除的元素
    return result
}

附上一圖，但願可以更明瞭（畫工太拙劣）：

不對的地方還望指導，謝謝！