# 头条

# 一面

浏览器缓存

浏览器缓存 (opens new window)

cookie 和 session 的区别

  1. session 存在服务端,cookie 在客户端
  2. session 默认保存在服务端的一个文件中(不是内存)
  3. session 的运行依赖 session_id,而 session_id 保存在 cookie 中,如果浏览器禁用了 cookie,一定程度上 session 也会失效
  4. session 可以放在文件、数据库或内存中
  5. 用户验证这种场合一般会用 session

csrf 和 xss

前端安全 (opens new window)

怎么防治 csrf 和 xss

前端安全面试题 (opens new window)

跨域的处理方案有哪些

跨域 (opens new window)

对于 CORS,get 和 post 的区别

CORS 预请求 (opens new window)

了解 HTTPS 的过程

HTTPS (opens new window)

HTTPS握手过程 (opens new window)

webpack 性能优化

打包体积和打包时间

体积分析用 webpack-bundle-analyzer 插件,速度分析用 speed-measure-webpack-plugin 插件

玩转 webpack,是你的打包速度提升 90% (opens new window)

es module 和 common js 的区别

模块化 (opens new window)

前端模块化:CommonJS, AMD, CMD, ES6 (opens new window)

react 中实现动态加载

React.lazy(),另外通过 webpackrequire.ensure

动态加载的原理

就是 webpack 编译出来的代码

方式就是动态创建 script 标签,然后发送 jsonp 请求

笔试题:页面结构包括页头(永远在顶部)、主体内容、页脚,页脚永远在页面底部(不是窗口底部),即内容高度不够时,页脚也要保证在页面底部

可以使用 sticky、Flex、Grid 布局

手写 new

手写 new (opens new window)

写一个函数处理 JS 精度问题

通过将小数倍数相乘得到整数,相加之后再除以倍数得到小数

1000000000 + 1000000000 允许返回字符串 处理大数

转成字符串,从后往前加,按位递增

# 二面

聊项目

  1. 遇到的困难以及解决的办法
  2. 项目有哪些亮点

手写 es 继承

js寄生组合继承 (opens new window)

手写大数相乘

/**
 * @param {string} num1
 * @param {string} num2
 * @return {string}
 */
function multiply(num1, num2) {
  if(!isNaN(num1) || !isNaN(num2)) return ''
  const len1 = num1.length
  const len2 = num2.length
  const ans = []
  
  for(let i = len1 - 1;i >= 0;i--) {
    for(let j = len2 -1;j >= 0;j--) {
      const index1 = i + j
      const index2 = i + j + 1
      
      const mul = num1[i] * num2[j] + (ans[index2] || 0)
      ans[index1] = Math.floor(mul/10) + (ans[index1] || 0)
      ans[index2] = mul % 10
    }
  }
  
  const result = ans.join('').replace(/^0+/, '')
  return !result ? '0' : result
}

# 三面

聊项目

手写防抖函数

手写防抖函数 (opens new window)

算法:扑克牌中的顺子 (opens new window)

# 滴滴

# 一面

webpack 原理

webpack工作原理 (opens new window)

babel 原理

babel原理 (opens new window)

虚拟 DOM 的理解

从 React 历史的长河里聊聊虚拟 DOM 以及其价值 (opens new window)

# 二面

Redux 原理

Redux 做状态管理和发布订阅模式有什么区别

Redux 其实也是一个发布订阅,但是 redux 可以做到数据的可预测和可回溯

react-redux 的原理,是怎么跟 react 关联起来的

react-redux 的核心组件只有两个:Provider 和 connect,Provider 存放 Redux 里 store 的数据到 context 里,通过 connect 从 context 拿数据,通过 props 传递给 connect 所包裹的组件

多端原理

http 与 tcp 的关系

tcp 可以建立多少个连接

http 1.0 默认不支持长连接,一个 http 请求对应一个 tcp;

http 1.1 起支持长连接,只要 tcp 连接不中断就可以一直发送 http 请求

为什么要有三次握手、四次挥手

三次握手的原因:防止已失效的连接请求报文传到服务端因此产生的错误

四次挥手的原因:确保数据完全传输