2018-09面试总结

小鹅通

1. 冒泡时间复杂度：两层for循环嵌套，n平方

2. 三次握手：
   第一次：客户端给服务器发送syn，即客户端请求建立联机
   第二次：服务器给客户端发送syn+ack，即服务器回复确认，请求建立联机
   第三次：客户端给服务器发送ack，即客户端回复联机确认

   syn（同步，建立联机）
   ack（确认信息）
   FIN（结束）

3. 四次挥手：
   第一次：client发送FIN
   第二次：server发送ack
   第三次：server发送FIN
   第四次：client发送ack

   第二次和第三次为什么不能缩短为一次：因为起先双方既然建立了链接。那么，这个时候就不仅仅是只有Client才具有话语权。当Client示意要断开链接时只是它本身不在发送数据时，Server端此时仅能先回复说“好，我知道你不再发送数据了！”。但，有可能Server端此时有一个任务正主动向Client发数据，它必须得等任务结束，再进行第三次握手。所以，第二次跟第三次握手不能合为一次。简单说就是第二次跟第三次可能存在时间上的先后

4. css垂直水平居中实现方式（待补充）：

   • display：flex

   • 绝对定位

     position:absolute;
     top:50%;
     left:50%;
     transform:translateX(50%);
     transform:translateY(50%);

     transform:translate(百分比)：相对于元素自己的宽和高
     css中的百分比

5. 四层模型：？？？

6. vuex：

7. keep-alive：

   场景：tab切换，想继续展示之前的内容，以避免反复重渲染导致的性能问题

   keep-alive元素将动态组件包裹起来

8. .sync修饰符：

   //父组件
   <text-document
     v-bind:title="doc.title"
     v-on:update:title="doc.title = $event"
   ></text-document>
   //子组件
   this.$emit('update:title', newTitle)

   .sync实则以上的语法糖，实现父子数据双向绑定

9. 浏览器双核：
   国内主流浏览器都会双核浏览器，基于webkit内核和基于ie内核

   //让IE以最高级模式渲染文档，强制IE使用Chrome Frame渲染
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

腾讯电话面试

1. echart特点：
   可视化框架还有哪些？d3.js highcharts.js
   echart优缺点：简单易用，但可定制性差
   d3.js：强大的可定制化，需要svg基础

2. attr和prop区别：

3. http请求头响应头：

4. db引擎和索引？？：
5. diff算法：

墨子

1. CMD AMD UMD:
2. node.js事件流

bitbank

后续从微信笔记中迁移

四方精创

后续从微信笔记中迁移

健康160

1. 数组去重：
   • indexOf==-1则push
   • 遍历排序后的数组，判断和前一个item相不相等，不相等push
   • 键值对
   • es5 filter
   • ES6 Set
     [new Set([1,2,3,1,2,3])]=>[1,2,3]
2. json：
   • 也可能是数组
3. keys：keys()/value()/entries()对象的静态方法，数组的成员方法
4. axios拦截应用
5. fiddle应用
6. vue-router的hash模式和history模式

富士智能

1. arguments.callee和caller

   • arguments.callee:正在执行的函数，es5严格模式被禁止使用
   • arguments.caller:函数被调用时所在的函数。已移除！可用函数对象Function.caller替代，全局调用时返回null;

2. jq的事件委托方法on/live/delegate

3. 优雅降级和渐进增强
4. css hack

sixteen market

1. 拖拽原生实现
   在目标元素上触发mousedown事件
   document mousemove
   目标元素 mouseup
   dragEle.style.left = ev.pageX + ‘px’;
2. for执行顺序
3. 三栏布局
   float left、right、main
   position
   圣杯布局，负margin对浮动元素的影响
   双飞翼布局，同圣杯
   flex,flex:1,order顺序控制
4. compiler
   深度优先遍历
   判断nodeType，如果为textNode,正则匹配\{\{\}\}中绑定的变量，新增订阅者
   如果为elementNode，判断attributes之中有没有v-bind等指令，新增订阅者，如果还有childNode，递归调用
5. css优先级
   !important
   内联样式
   id
   class
   标签选择
6. 节点类型
   元素节点 1
   属性节点 2
   文本节点 3
   注释节点
7. filter
8. mixins
   策略:分三种情况
   数据选项
   钩子
   对象选项如methods/components…

腾讯二面（php）

1. linux指令

   r 对当前文件夹下的所有文件递归操作
   f force强制执行

文件权限
查看：ls -l或者ll
修改：chmod [u/g/o][+/-/=][r/w/x] 文件 或者 chmod -r 755 文件夹

u owner
g 所属组
o other其他
r read，4
w write，2
x 执行权限，1

777 所有者rwx,所属组rwx,其他人rwx
755 所有者rwx,所属组r-x,其他人r-x

2. sql注入及防御

3. sql，所有女同学的最近一次考试的平均成绩

   SELECT 
   AVG(p.`score`)
   * FROM student t LEFT JOIN score p ON t.`id` = p.`student_id` 
   WHERE t.`sex` = 1 AND p.`date` = (SELECT MAX(DATE) FROM score) GROUP BY p.`date`

4. 网络协议

客路

1. 随机打乱数组

   var arr = ['a','b','c','d','e'],
       len = arr.length,
       newarr = [];
   for(var i = 0;i<len;i++){
       var index = Math.floor(Math.random()*(len-i));
       //console.log(index);
       var item = arr.splice(index,1)[0];
       console.log(item);
       newarr = newarr.concat(item);
   }
   console.log(newarr);

2. filter
   array.filter(callback)
   callback对于那些已经被删除或者从未赋值的item不会调用。

   var arr = [1,2,3];
   arr[10] = 10;
   arr[9] = undefined;
   arr.filter((item)=>{return item === undefined;})

3. 频繁搜索调用接口，展示最新的结果
   xhr.abort()
   https://segmentfault.com/q/1010000012498572

4. 前端错误监控
5. a.js?version=hash和a.hash.js实现缓存机制的区别

微众银行

1. 移动端兼容问题
   touch事件:只存在移动端
   click事件:延迟大约300ms执行，原因是 浏览器需要区分 单击事件和双击屏幕缩放
   touchstart => touchmove => touchend

2. 路由守卫中获取to路由对应组件的实例
   全局前置守卫beforeEach(to,form,next)
   全局后置守卫afterEach(to)
   组件内的守卫
   beforeRouteEnter
   beforeRouteUpdate
   beforeRouteLeave

3. ul->li布局怎么实现以及横竖屏如何布局

微众银行

岩心

奥哲

1. keep-alive,生命周期
2. webpack,插件打包成另一个chunk，？？
3. v-once freezon
4. 面试题
5. 生命周期做的事情