react面试专题
1. 达达京东到家
笔试: 都是些基础选择题,考察计算机网络,事件循环机制,闭包,this 这些。 一面:
-
[项目详情 1.小程序图片优化2.腾讯云架构图]
2.达观数据
笔试
- 算法:柯里化通用实现
- 算法:two-sum
var twoSum = function(nums, target) {
const hashMap = new Map();
for (let i = 0; i< nums.length; i++) {
if (hashMap.has(target - nums[i])) {
return [hashMap.get(target - nums[i]), i];
} else {
hashMap.set(nums[i], i)
}
}
};
一面:
-
[redux 用法] 二三面:
-
项目细节,深入typescript使用
3. 英语流利说
一面:
- 什么是JWT
- JWT 优缺点
- 选择器优先级
- js的数据类型相关面试题
- nginx 负载均衡配置
- 前端性能优化手段
- 针对 React 的性能优化手段
- 301 302 307 308
- 401 403
- vue 的 nextTick 实现原理以及应用场景
- vue 和 react的 组件间通信
- 谈谈 XSS 防御,以及 Content-Security-Policy 细节 二面:
- 场景题:一个气球从右上角移动到中间,然后抖动,如何实现
- 场景题:一个关于外边距合并的高度计算
- css盒模型深度解析,BFC块级格式化上下文解析
- mobx-react 如何驱动 react 组件重渲染
- forceUpdate 经历了哪些生命周期,子组件呢?
- vue key的作用,为什么不能用index做key
- vue 的 diff算法和 key(深入解释diff算法)
- React 的diff算法和key
三面:
- Node 大文件上传 实现方案
- 前端大文件分片下载 实现方案
- 手写冒泡排序,并对其做一些优化
- JWT 细节,适用场景
- 跨域方式和优缺点
- 方案题:不同前端技术栈的项目,如何实现一套通用组件方案? 方案一:基础js实现或js基座+iframe
方案二:微前端
4. 拍拍贷
一面:
- ES6 特性
- 谈谈闭包
- 谈谈this
- postcss 配置
- 手写Promise
- 手写async await
- [手写深拷贝]
// 解决循环引用的深拷贝
function deepClone(target, map = new WeakMap()) {
if (typeof target === "object") {
let cloneTarget = Array.isArray(target) ? [] : {};
if (map.get(target)) {
return map.get(target);
}
map.set(target, cloneTarget);
for (const key in target) {
cloneTarget[key] = deepClone(target[key], map);
}
return cloneTarget;
} else {
return target;
}
}
- Vuex, Redux 各自的特点和区别
- Vuex和Pinia的对比
- react 生命周期
- 各方面谈谈性能优化
- serviceworker 如何保证离线缓存资源更新
- react virtual dom 的渲染原理和特性
二面:
-
总监面,把刚才一黑板的项目架构图全部擦掉,再来谈一遍。 三面:
-
[图片懒加载实现] 方案1 原生js实现懒加载
方案2 使用渐进式图片,优化用户体验
- 天壤智能 一面:
-
[react的hooks知道哪些?]
-
[vite 和 webpack 的区别]
-
手写 Promise 的原理实现 二面:
-
[聊项目] 三面:
[聊项目]
5. 拼多多
一面:
- Promise 实现原理
- vue 组件间通信
- 性能优化细节 图片性能优化
- vuex和redux 数据流动过程
- 谈谈 css 预处理器机制
- [算法:Promise 串行]
const funcArr = [
() =>
new Promise((resolve) => {
setTimeout(() => resolve(1), 2000);
}),
() =>
new Promise((resolve) => {
setTimeout(() => resolve(2), 1000);
}),
() =>
new Promise((resolve) => {
setTimeout(() => resolve(3), 3000);
}),
];
/**
* @description: 实现Promise的串行
* @param {*}: 接收一个包含多个返回Promise对象的函数的数组
* @return {*}: 返回一个Promise对象
*/
function orderPromiseFn(arr) {
let res = []
return new Promise((resolve, reject) => {
arr.reduce((old,curr) => {
return old.then(() => curr()).then(currRes => res.push(currRes)).catch(err => {throw new Error(err)})
},Promise.resolve()).then(() => {
resolve(res)
}).catch(err => {
reject(err)
})
})
}
orderPromiseFn(funcArr).then(res => {console.log(res)}).catch(err => {
console.log(err)
})
二面:
- CI/CD 整体流程
- 性能优化
- vue 的 ssr 实现
- SSR 对性能优化的提升在哪里
- [怼项目 重点项目:腾讯私有云+IP商品化]
6.猫眼电影
一面:
-
[怼项目] 二面:
-
[怼项目]
6.米哈游
一面:
7.bilibili
一面:
8.阅文
一面:
9.阿里
算法笔试题
-
将数组扁平化并去除其中重复数据,最终得到一个升序且不重复的数组
-
第二题: 说明:实现一个方法,用于比较两个版本号(version1、version2) 如果version1 > version2,返回1;如果version1 < version2,返回-1,其他情况返回0 版本号规则x.y.z,xyz均为大于等于0的整数,至少有x位 示例: compareVersion(‘0.1’, ‘1.1.1’); // 返回-1 compareVersion(‘13.37’, '1.2 '); // 返回1 compareVersion(‘1.1’, ‘1.1.0’); // 返回0
-
找到字符串中最大回文子串 例如 ‘3434356’ 的最长回文子串是 ‘34343’。回文是指对称的字符串,如:‘abccba’。找到字符串中最大回文子串
参考链接 # 前端三年到五年面试题分享