前端面试常见问题（模拟实现红绿灯，二分法，冒泡排序和快速排序）

1.前端模拟实现红路灯场景，红灯三秒，绿灯2秒，黄灯1秒。

提示：这种情况明显是一个异步的情况，前端提起异步，首先想到的是promise，这道题考察的是promise+async，await+setTimeout综合的使用

let box = document.getElementById("box")
  function fn(i){
    return new Promise((resolve,reject)=>{
      setTimeout(resolve,i)
    })
  }
  async function fn2(i,color){
    box.style.backgroundColor = color;
    await fn(i)
  }
  async function fn3(){
    while(true){
      await fn2(3000,"red");
      await fn2(2000,"green");
      await fn2(1000,"yellow");
    }
  }
  fn3()

时间问题，我这先出几道面试常见的算法题

二分法查找

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20];
  function fn(arr,index){
    let min=0;
    let max = arr.length-1;
    while(min<=max){
      let mid = parseInt((min+max)/2);
      if(index == arr[mid]){
        return mid
      }else if(index > arr[mid]){
        min = mid + 1;
      }else {
        max = mid -1;
      }
    }
    return -1
  }
  console.log(fn(arr,20))

数组冒泡排序和快速排序

    //快速排序
    function fn(arr){
    if(arr.length<=1){
      return arr
    }
    let index = parseInt(arr.length/2)
    let num = arr.splice(index,1)[0];
    console.log(num)
    let left=[],right=[];
    arr.forEach(item=>{
      if(item<num){
        left.push(item)
      }else{
        right.push(item)
      }
    })
    return fn(left).concat([num],fn(right))
  }
  console.log(fn([3,4,5,6,3,2,1,0,8,2]));

    //冒泡排序
  let arr =[3,4,5,6,3,2,1,0,8,2];
  for(let i=0;i<arr.length-1;i++){
    for(let j=0;j<arr.length;j++){
      if(arr[j]>arr[j+1]){
        let a = arr[j]
        arr[j]=arr[j+1]
        arr[j+1] =a;
      }
    }
  }
  console.log(arr)

面试无穷无尽，你不知道你将要面临的面试官问的什么问题，有的面试官爱问js语法，有的爱问算法类型的，大家苦累基本功，早日升职加薪，还有就是保住头发，毕竟植发也挺贵的。