# 头条
# 一面
浏览器缓存
cookie 和 session 的区别
- session 存在服务端,cookie 在客户端
- session 默认保存在服务端的一个文件中(不是内存)
- session 的运行依赖 session_id,而 session_id 保存在 cookie 中,如果浏览器禁用了 cookie,一定程度上 session 也会失效
- session 可以放在文件、数据库或内存中
- 用户验证这种场合一般会用 session
csrf 和 xss
怎么防治 csrf 和 xss
跨域的处理方案有哪些
对于 CORS,get 和 post 的区别
了解 HTTPS 的过程
webpack 性能优化
打包体积和打包时间
体积分析用 webpack-bundle-analyzer
插件,速度分析用 speed-measure-webpack-plugin
插件
玩转 webpack,是你的打包速度提升 90% (opens new window)
es module 和 common js 的区别
前端模块化:CommonJS, AMD, CMD, ES6 (opens new window)
react 中实现动态加载
React.lazy()
,另外通过 webpack
的 require.ensure
动态加载的原理
就是 webpack
编译出来的代码
方式就是动态创建 script 标签,然后发送 jsonp 请求
笔试题:页面结构包括页头(永远在顶部)、主体内容、页脚,页脚永远在页面底部(不是窗口底部),即内容高度不够时,页脚也要保证在页面底部
可以使用 sticky、Flex、Grid 布局
手写 new
写一个函数处理 JS 精度问题
通过将小数倍数相乘得到整数,相加之后再除以倍数得到小数
1000000000 + 1000000000 允许返回字符串 处理大数
转成字符串,从后往前加,按位递增
# 二面
聊项目
- 遇到的困难以及解决的办法
- 项目有哪些亮点
手写 es 继承
手写大数相乘
/**
* @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
}
# 三面
聊项目
手写防抖函数
# 滴滴
# 一面
webpack 原理
webpack工作原理 (opens new window)
babel 原理
虚拟 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 请求
为什么要有三次握手、四次挥手
三次握手的原因:防止已失效的连接请求报文传到服务端因此产生的错误
四次挥手的原因:确保数据完全传输