巧用物件，生成不重複隨機數

伊澤瑞爾發表於2018-12-30
物件隨機

有時候我們需要在一定範圍內生成一組不重複的隨機陣列，我們可能會這樣做：

//需求：在一個已知的陣列中，隨機選取一部分組成新的資料，要求陣列元素不重複出現：
    //常規實現
    var arr = [3,5,30,20,21,50,80,6,8,10,15]
    //去重一下,不去重，可能造成死迴圈
    arr = arr.filter(function(element,index,self){
        return self.indexOf(element) === index;
    });
    var getArr = function (len) {
        var tempArr = []
        var mathIndex
        var arrLen = arr.length
        var arrItem
        var falg
        if(len > arrLen){
            console.log('無法獲取指定長度的陣列！')
            return
        }
        while (tempArr.length < len){
            falg = false
            //向下取整，得到0-(arrLen - 1)的整數
            mathIndex = Math.floor(Math.random() * arrLen)
            arrItem = arr[mathIndex]
            //判斷是否存在，存在即重新生成，不存在則push
            for(var i = 0 ; i < tempArr.length ; i++){
                if(tempArr[i] === arrItem){
                    falg = true
                    break;
                }
            }
            //不存在
            if(!falg){
                tempArr.push(arrItem)
            }
        }
        return tempArr
    }
    getArr(5)
    getArr(6)
    getArr(11)
複製程式碼

執行截圖：

執行截圖

可以看到，這樣實現的方式篇幅比較長，中間主要是由於要判斷是否有重複陣列做了大量處理，我們換一個種方式來實現。

var arr = [3,5,30,20,21,50,80,6,8,10,15]
    //去重一下,不去重，可能造成死迴圈
    arr = arr.filter(function(element,index,self){
        return self.indexOf(element) === index;
    });
// 物件替換陣列的方式實現：
    var getMyArr = function (len) {
        var tempArr = []
        var mathIndex
        var arrLen = arr.length
        var arrItem
        var arrIndexMap = {}
        if(len > arrLen){
            console.log('無法獲取指定長度的陣列！')
            return
        }
        while (tempArr.length < len){
            //向下取整，得到0-(arrLen - 1)的整數
            mathIndex = Math.floor(Math.random() * arrLen)
            arrItem = arr[mathIndex]
            //判斷是否重複
            if(!arrIndexMap[mathIndex]){
                //不存在，push，並儲存index
                tempArr.push(arrItem)
            //將索引存在物件裡面，做判斷用
                arrIndexMap[mathIndex] = true
            }
        }
        console.log(tempArr)
        return tempArr
    }
    getMyArr(5)
    getMyArr(6)
    getMyArr(11)
複製程式碼

可以看到上面用物件實現的時候，主要區別是在判斷生成的隨機數是否重複的部分。程式將生成的隨機數用物件的方式儲存了起來，然後只需要到物件裡面取值，看是否取到值即可，避免了去原素組裡面遍歷。這樣不僅簡化了實現過程，還提高了程式碼效能。

最後，有疑問的小夥伴可以發郵箱到： 630796280@qq.com

以上程式碼都能在github上下載得到，對應的檔案為：vue-study->src->test->getArr.html 最後可以關注我的個人公眾號，學習更多相關知識。

公眾號

相關文章