超全前端知識點總結解答求職筆記

寫在前面
1、這是博主2019年的前端筆記，有自己的一些開發經驗，也有網上找到的比較好的資料，做了一下總結。從最開始粗略整理到根據面試反饋不斷完善，我覺得已經非常全面，可以說涵蓋到了大部分前端面試的點，除了js、css、html，其他瀏覽器、框架、http、數據結構、算法等等全都有涉及。
2、因爲是學習筆記，而且涉及條目很多（97個），雖然博主已經認真校對，但難免有失誤之處，大家多多包涵。
3、這份總結，只能算作一個概要，詳細的學習大家自行拓展。對於面試來說，這份總結只能讓你對面試考察的點有一個粗略的感覺，但是想要真正脫穎而出，必須真的是自己在用，接觸到，而不是泛泛而談。
4、最後，不管是書本學習，做項目，還是找工作，都是一個練習+反饋的過程，秋招過程讓我注意到了很多平時忽略的知識點，對於我來說是一個很好的成長過程，一起加油吧。

markdown版：https://github.com/Lindsayyyy/feiyu-notes
pdf版：https://pan.baidu.com/s/1ou4GVSVCg6HN1_V_UDP1ug   提取碼wr3x 

內容太多，不直接貼在博客上了，下面放一些常考的編程題的js實現

1、數組去重

1、reduce， indexOf
function unique(arr) {
  return arr.reduce((prev, cur, index) => {
    // return prev.indexOf(cur) === -1 ? prev.concat(cur) : prev
    return arr.indexOf(cur) === index ? prev.concat(cur) : prev
    // 注意push concat返回值不同
    // if (prev.indexOf(cur) === -1) {
    //   prev.push(cur)
    // }
    // return prev
  }, [])
}
2、filter，indexOf
function unique(arr) {
  return arr.filter((cur, index) => {
    return arr.indexOf(cur) === index
  })
}
3、set
function unique(arr) {
  return [...new Set(arr)];
}
4、雙層循環
function unique(arr) {
  var res = [];
  for (var i = 0; i < arr.length; i++) {
    for(var j = 0; j < res.length; j++) {
      if (res[j] === arr[i]) {
        break;
      }
    }
    if (j === res.length) {
      res.push(arr[i]);
    }
  }
  return res;
}
5、排序後去重，比較相鄰位

2、數組扁平化

1、遞歸
function flatten(arr) {
  var res = [];
  arr.forEach((cur) => {
    if (Array.isArray(cur)) {
      res = res.concat(flatten(cur));
    } else {
      res.push(cur);
    }
  })
  return res;
}
2、reduce
function flatten(arr) {
  return arr.reduce((prev, cur) => {
    return Array.isArray(cur) ? prev.concat(flatten(cur)) : prev.concat(cur);
  }, [])
}
3、...擴展運算符，some()判斷
function flatten(arr) {
  while(arr.some((cur) => {return Array.isArray(cur)})) {
    arr = [].concat(...arr)
  }
  return arr;
}

3、鏈表有環

// 快慢指針方法
function EntryNodeOfLoop(pHead)
{
    if (pHead == null || pHead.next == null) return null;
    let fast = pHead;
    let slow = pHead;
    let flag = false;
    while (fast) {
      fast = fast.next.next;
      slow = slow.next;
      if (fast == slow) {
        flag = true;
        break;
      }
    }
    if (flag) {
      fast = pHead;
      while (fast != slow) {
        fast = fast.next;
        slow = slow.next;
      }
      return fast;
    } else {
      return null;
    }
}

// 用Set解決
let node = pHead;
let arr = [];
while(node) {
  arr.push(node);
  if ([...new Set(arr)].length !== arr.length) {
    return node;
  }
  node = node.next;
}
return null

4、二分查找

// 非遞歸
function foo(arr, target) {
  let front = 0;
  let end = arr.length-1;
  while(front <= end) {
    let mid = Math.floor((end + front)/2);
    if (target > arr[mid]) {
      front = mid + 1;
    } else if (target < arr[mid]) {
      end = mid - 1;
    } else {
      return mid
    }
  }
  return -1;
}
// 遞歸
function binarySearch(data,item,start,end){
    var end=end || data.length-1;
    var start=start || 0;
    var m=Math.floor((start+end)/2);
    if(item==data[m]){
        return m;
    }else if(item<data[m]){
        return binarySearch(data,item,start,m-1) //遞歸調用
    }else{
        return binarySearch(data,item,m+1,end);
    }
    return false;
}

5、用apply實現bind

Function.prototype.bind = function(context) {
var self = this
args = Array.prototype.slice.call(arguments);
    return function() {
        return self.apply(context, args.slice(1));    
    }
};

6、樹的遍歷

// 深度優先遞歸
function DLR(tree){
    console.log(tree.value);
    if(tree.left){
        DLR(tree.left);
    }
    if(tree.right){
        DLR(tree.right);
    }
}
//深度優先非遞歸，棧先進後出
function DepthFirstSearch(biTree) {
    let stack = [];
    stack.push(biTree);
    while (stack.length != 0) {
        let node = stack.pop();
        console.log(node.data);
        if (node.rChild) {
            stack.push(node.rChild);
        }
        if (node.lChild) {
            stack.push(node.lChild);
        }
    }
}

//廣度優先非遞歸，隊列先進先出
function BreadthFirstSearch(biTree) {
    let queue = [];
    queue.push(biTree);
    while (queue.length != 0) {
        let node = queue.shift();
        console.log(node.data);
        if (node.lChild) {
            queue.push(node.lChild);
        }
        if (node.rChild) {
            queue.push(node.rChild);
        }
    }
}