有時候我們需要在一定範圍內生成一組不重複的隨機陣列,我們可能會這樣做:
//需求:在一個已知的陣列中,隨機選取一部分組成新的資料,要求陣列元素不重複出現:
//常規實現
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 最後可以關注我的個人公眾號,學習更多相關知識。