巧用对象，生成不重复随机数

有时候我们需要在一定范围内生成一组不重复的随机数组，我们可能会这样做：

//需求：在一个已知的数组中，随机选取一部分组成新的数据，要求数组元素不重复出现：
    //常规实现
    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
最后可以关注我的个人公众号，学习更多相关知识。