常见前端面试题整理

整理一下上次前端面试的面试题。

第一题是函数申明提前

	foo();
  var foo = function(){
    console.log('aaa');
  }
  function foo(){
    console.log('bbb');
  }
  foo();

第一次调用foo函数输出bbb，第二次调用输出aaa。

由于函数申明提前，整个函数体被提前到最前面。所以一开始调用foo函数，打印输出是bbb，接着用函数表达式申明，覆盖了之前的定义，再次调用输出aaa。

第二题考点是块级作用域：

for(var i = 0; i<5; i++) {
    setTimeout(() => {
      console.log(i);
    }, 1000);
}
console.log(i)

输出是什么，先输出一个5，后输出5个5，一个5是for循环外先输出，for循环内部的的var是函数作用域，并没有块级作用域。settimeout是宏任务，他会等这次宏任务结束后到下一次宏任务时调用，涉及到事件循环机制，建议了解一下js事件循环。如果改为let输出会是怎样。

先输出i未定义的报错，然后输出01234。i是块级作用域，for循环外是用不了for里面定义的i，所以会报错。
在setTimeout的时候，会申明创建一个匿名函数function(){console.log(i);}，当匿名函数执行的时候，会查找当前运行环境的 i 的值。var声明的 i ，运行环境的 i 的值为10，但是let声明的 i，运行环境中 i 的值是每一个循环创建匿名函数时候的 i。

第三题

<style>
  .parent{
    width: 200px;
    height: 200px;
    padding: 20px;
    box-sizing: border-box;
    background: red;
  }
  .child{
    width: 100%;
    height: 100%;
    background: yellow;
  }
  </style>
  <div class="parent">
    <div class="child"></div>
  </div>

问题是描述div的宽高，颜色什么的。
border-box是怪异模式，width包括了padding和border，所以parent的width和height就是定义的200px；然后因为parent的padding是20px；child的width和height是160px。如果child是span的话就没有宽高了，div不需要被撑开。

第四题：数据结构怎么用栈实现队列：
用两个栈来实现队列
stackA和stackB两个栈，假设数据进入stackA，入队操作就是stackA.push(ele);
出队操作重新写一下。

function deQueue(){
  if(stackB.isEmpty()){
    if(stackA.isEmpty()){
      return null;
    }
    popFromStackA();
  }
}

function popFromStackA(){
  while(!stackA.isEmpty()){
    stackB.push(stackA.pop())
  }
}

出队操作判断stackB是不是为空，如果为空那要先从stackA中取数据。
如果是用队列实现栈的话，假设有队列queueA和queueB，出栈的操作如下

function deStack(){
    let data;
    queueB = [];
    while(!queueA.isEmpty()){
      data = queueA.pop();
      if(queueA.isEmpty()){
        return data;
      }else{
        queueB.push(data);
      }
    }
    queueA = queueB
}

如果队列A不为空，那么就去取队列A弹出的数据，如果这个数据弹出后队列A变成空了，那么这个数据就相当于是栈要弹出的数据，用queueB来保存其他的数据，然后最后queueA重新等于queueB，这样的话每次都要初始化queueB是空的。

第五题：二叉树的遍历：
简单的二叉树遍历

int count = 0;
status countNodes(BiTree T){
  if(T->value){
    count++;
    countNodes(T->left);
    countNodes(T->right);
  }else{
    return;
  }
}

先序遍历，递归实现。