前端实习生面试总结(一）

今天去面试了一个公司的前端实习生岗位，特意记录下，为下次面试做点经验准备，废话不多说，直接上题目。

• 解析一个逆波兰式

function isOperator(op) {
  if (op.search('[0-9]+') >= 0) {
    // 表示这是一个数字
    return 0
  }
  else if (['+', '-', '*', '/'].indexOf(op) >= 0) {
    // 表示为一个合法的操作符
    return 1
  }
  else{
    // 表示为一个非法操作符
    return 2
  }
}

math_op = {
  '+': (first, second) => first + second,
  '-': (first, second) => first - second,
  '*': (first, second) => first * second,
  '/': (first, second) => {
    if (second == 0) {
      throw new Error('第二个数字不能为零')
      return 
    }
    if (first % second != 0){
      return (first/second).toFixed(5)
    } else {
      return (first/second)
    }
  }
}

function rpn(rpnStr){
  let rpnArr = rpnStr.trim().split(' ')
  let len = rpnArr.length
  if (len == 1) return rpnArr[0]
  let arr = []
  let i
  for (i = 0; i< len; i++) {
    let item = rpnArr.shift()
    try{
      if (isOperator(item) == 0) {
        arr.push(Number(item))
      }
      else if (isOperator(item) == 1) {
        let second = arr.pop()
        let first = arr.pop()
        arr.push(math_op[item](first, second))
      }
      else if (isOperator(item) == 2) {
        throw new Error('非法操作符')
      }
    } catch(e) {
      console.log(e.message)
      return 
    }
  }
  if (i != len){
    return 
  }
  if (arr.length != 0) {
    if (arr.length == 1) {
      return arr[0]
    } else {
    console.log('缺少操作符，此时栈中情况如下')
    return arr
    }
  }
}

• Vue生命周期
  beforeCreate,created,befoeMount,mounted,beforUpdate,updated,beforeDestroy,destroyed,分为组件实例创建，模板编译挂载，数据更新，实例销毁
  实例，按F12看生命周期(只看到实例创建和挂载)
  app.message = 'updated',查看数据更新
  app.$destroy
beforeDestroy，在销毁前调用，此时Vue实例还在，destroyed,啥都没有了

beforeCreate,可以加loading
created, 结束loading,自执行函数
mounted, 发起后端请求
beforeDestroy, 确认是否删除
destroyed, 可以清一些定时器类的
参考这位兄台的

• Mysql中主键与外键的区别
  
  • 主键，唯一标识一条记录，不能重复，不能为空，保证数据完整性
  • 外键，该表的外键是另一张表的主键，可以重复，可以为空，用来和其他表建立联系
    

    问题：为什么要设置外键，可以通过where语句查询也是一样?
    当删除了设置外键的主键之后，所有的外键都会被自动删除，例如：论坛上帖子和回复，在回复上设置外键为帖子的id,当帖子被删除后，回复也会被自动删除

• 当在浏览器地址栏输入一个URL按enter后发生了什么

  1. 向DNS服务器查询ip地址
  2. 浏览器根据ip地址与目标服务器在端口80建立TCP/IP连接
  3. 获取相应的html代码
  4. 渲染html代码

• 拓展：前端优化

  1. 减少http请求，合并文件、图片
  2. 浏览器缓存技术,Last-Modified或者Etag,验证本地是否为最新的，返回304则使用本地，否则下载新版本，or设置缓存过期时间
  3. 文件使用GZIP进行压缩
  4. 脚本放底部，样式放首部，尽量外联JS、CSS

• 但是当你ping www.baidu.com 时得到的ip却不是同一个,引出Nginx负载均衡

  • 轮询（默认），根据请求次数，将每个请求均匀分配到每台服务器
  • 最少连接，将请求分配给连接数最少的服务器，Nginx会自动统计
  • Ip hash，通过散列函数得到一个HASH值，分配到特定服务器

• 浏览器实时数据刷新

  • 轮询方式实现数据实时更新，通过Ajax实现(每隔一段时间发一次)，缺点是造成服务器较大负载
  • ajax长连接，客户端发请求，服务器查询有没有新数据，没有新数据就阻塞这个请求，直到有新数据或者超时，客户端收到请求返回结果后立刻再发一次请求
  • HTML5 Web Socket

今天大致就是这样，发挥的不太好，但从此次面试中可以看出对于前端的要求是越来越高了，需要对网络、算法、Linux、数据库都要有所了解，也对于以后的面试有了一次经验准备。