《小代码大世界》随机抽奖方法和关键词搜索请求优化

前言

　　技术经理（以下简称“大欢哥”，因为大欢哥人高马大的）一日出差回来，在楼下休息听到 “今日头条” 的前端网面（头条就在我们公司隔壁。公司楼下有休息区，可以坐那喝咖啡）。两个javaScript题目。

　　今天早上来上班，包还没放下，就一脸神秘的对我说 “ 我这听到 头条的前端面试题，等我吃完饭回来给你说，考考你，嘿嘿 ”，我的小心肝一下就紧张了。“头条”、“面试题”...貌似人生巅峰来了！！！做出来就有白富美啦！！！

　　终于吃完饭回来了，出题了.....

正文

　　回归技术！！！回归正文！！！

　　题目一：输入框实现输入文字，后台请求获取数据，用户输入后JS可以性能丢丢，减少请求次数！

　　具体表现：用户连续输入“abc”，查询 “abc”，而不是查询“a”，“ab”，“abc”。。。

　　关键点：用户输入 间隔时间 满足要求则请求

　　实现代码：（欢迎指正）

<input type="text" name="" id="search_text">
<script type="text/javascript">
var lastValue,//上一次输入值
inputIng;//定时器保存
document.getElementById('search_text').oninput=function(){
//监听input值变化
var input=false,//是否在输入状态
that=this;
window.clearTimeout(inputIng);
inputIng=setTimeout(function(){
if(!input){
if(lastValue==that.value){
return;
}
console.log(that.value);
lastValue=that.value;
input=true;
}
},800);//时间调整确定用户输入间隔 实践之后800ms最合适
}
</script>

　　题目二：实现一个Function，要求入参为array，返回一个方法，调用方法返回数组中的一个值，值不重复，数组所有值返回完毕，重新返回！

　　关键点：数组在内存中的存储

　　实现代码：（此处贴我实现的代码，与要求有差距）。

　　　　//我写的(大错误改正了，还有一个隐藏错误)
function ran(arr){
this.arr=arr.join(',').split(',');//当前操作数组
this.oldArr=arr.join(',').split(',');//备份数组
this.randomNum=function(){//定义方法操作数组返回值
if(this.arr.length==0)this.arr=this.oldArr.jion(',').split(',');//如果当前操作数组值没有了，就从备份数组中备份
var index=Math.round(Math.random()*this.arr.length-1);//获取数组中随机下标四舍五入取整数 （此写法有错，自己思考改正）
return this.arr.splice(index,1).toString();//返回下标对应的值
};
}
var arr=[0,1,2,3,4,5];
var a = new ran(arr);
console.log(a.randomNum());

//大欢哥写的 参考思路实现，不是大欢哥原代码
function Ran(arr){
var newArr = arr.slice();
var TemArr = arr.slice();
return function(){
if(newArr.length==0){
newArr=TemArr.slice();
}
var index = Math.floor(Math.random()*newArr.length);
var keyVale = newArr[index];
newArr.splice(index,1);
return keyVale;
};
}

var fun = Ran(arr);
console.log(fun());

　　最后测试结果是：功能都实现（忽略我的隐藏bug），大欢哥写的性能在我的150%以上！

　　测试代码得出：1、' '+Num 转字符串的方式比 Num.toString() 性能高

　　　　　　　　　2、由上衍生出，以下方式一和和方式二对比，谁随机的数比较公平（下一个随笔会详细论证）

var ran1 = Math.floor(Math.random()*a.length);//方式一

var ran2 = Math.round(Math.random()*(a.length-1));//方式二

　　　　　　　　　3、尽量精简API的调用

结束总结

　　程序员的世界你不懂！为了讨论问题可以不吃饭、可以不回家、可以一个问题诞生很多问题。。。。。