我的简历经常经常被系统捞起来面试，目前是第三次，所以一定要单独写一篇
一面（2小时）：
1、介绍自己，主要是技术栈，近年来的项目
2、自学前端入门，如何自学的，GitHub，小项目
3、平移动画，有几种实现，优劣，css3transition,transform
4、是如何在面试过后知道自己回答得好不好，平时如何学习进步(项目，源码，看书)，项目做了哪些优化
5、pc端移动端占比，移动端css有什么区别，rem为什么16px
6、webpack如何构建工程，用过哪些工具（gulp，parcel）
7、es5和6、7区别，如何把es6转成es5，babel,polyfill
8、回调，promise，async await
9、自己比较满意的项目，给你时间的话你会怎么对待这个项目（优化，总结写文章），如何用canvas画出图表
10、孙节点通信，context，redux等，context具体实现和接收
11、如果不涉及页面渲染，变量怎么办。static等
12、未来的规划，想成为什么样的前端
13、有没有什么要问他的（在闲鱼做社区鱼塘公众号架构，运营后台，活动页面；加班适中没有很闲也没有996，对项目负责；闲鱼ctoc有很大用户和新挑战，是淘宝技术旗下，做很多尝试）
14、反馈说感觉比我一年多以前的简历还要好
笔试+问问题（1小时）
笔试是用内部共享编辑器，面试官可以实时看到面试者写代码，ide不能调试，写完会问问题
第一题
// 给定一个字符串，请你找出其中不含有重复字符的 最长子串 的长度。
// 示例 1:
// 输入: "abcabcbb"
// 输出: 3
// 解释: 因为无重复字符的最长子串是 "abc"，所以其长度为 3。
// 示例 2:
// 输入: "bbbbb"
// 输出: 1
// 解释: 因为无重复字符的最长子串是 "b"，所以其长度为 1。
// 示例 3:
// 输入: "pwwkew"
// 输出: 3
// 解释: 因为无重复字符的最长子串是 "wke"，所以其长度为 3。
// 请注意，你的答案必须是 子串 的长度，"pwke" 是一个子序列，不是子串。
function findNoRepeatStr(str){
if(str.length===0) return 0
let res = str[0]
let finRes = res;
for(let i=1;i<str.length;i++){
let index = res.indexOf(str[i]);
if(index===-1){
res= res + str[i]
if(res.length>finRes.length){
finRes = res;
}
} else {
res = res.slice(index + 1)+str[i]
}
}
return finRes.length
}
1、还有什么思路
2、判空
3、出bug解决
4、时间复杂度
第二题
// 请实现 `makeGroups` 方法，使得数组数据按 `groupId` 分组，并以 `value` 为排序字段，达到如下效果：
const dataSource = [
{value: "1", groupId: 'a'},
{value: "15", groupId: 'b'},
{value: "7", groupId: 'a'},
{value: "9", groupId: 'c'},
{value: "5", groupId: 'b'},
{value: "11"}
];
const groups = makeGroups(dataSource);
console.log(groups);
/* 输出数据如下：
[
[
{value: "1", groupId: 'a'},
{value: "7", groupId: 'a'}
],
[
{value: "5", groupId: 'b'},
{value: "15", groupId: 'b'}
],
[
{value: "9", groupId: 'c'}
],
[
{value: "11"}
]
]
*/
function makeGroups(dataSource){
let res = []
dataSource.forEach(x=>{
let index = res.findIndex(item=>item[0].groupId === x.groupId)
if(index===-1){
res.push([x])
} else {
res[index].push(x)
}
})
return res.map(x=>
x.sort((m,n)=>+m.value-(+n.value))
)
}
1、+操作，字符转数字，NaN
2、forEach，map
3、其它思路
二面面试官服务端：（40分钟）
- 有没有做过服务端
- 用没用过强类型语言，为什么js是弱类型语言
- js如何在浏览器运行
- 说说项目，c++编译
- 单线程如何工作
- 未来规划
- 对象的生命周期
- 闭包是怎么回事
之后
- 看下webpack
- 编译原理
- context redux
- leetcode hard
- ts，vue3源码
- 复盘passport·，flow , charts等项目
- js工作原理到浏览器，到机器码
天猫海外
1、关闭动画为什么会优化
2、smooth
3、请求在哪个生命周期
4、update怎么用
lazada
依然是共享编辑器笔试
constructor(){
this.subs = {}
}
on(event, callback){
if(this.subs[event] === 'undefined'){
this.subs[event] = []
} else {
this.subs.push(callback)
}
}
off(event,callback){
let index = this.subs[event].indexOf(callback)
if(index>-1)this.subs[event].splice(index,1)
if(this.subs[event].length === 0){
delete this.subs[event]
}
}
trigger(event, options){
this.subs[event].forEach(x=>{
x(options)
})
}
}
2. 写个转换函数，把一个JSON对象的key从横杠形式（Pascal）转换到小驼峰形式（Camel），即{“a_b”:1}——>{“aB”:1}
var trans = function(obj){
let resObj = {}
for(let i in obj){
console.log(i)
resObj[pascalToCamel(i)] = obj[i]
}
function pascalToCamel(str){
let arr = str.split('_')
let resarr =arr.slice(1).map(x=>{
let camel = x.slice(0,1).toUpperCase()+x.slice(1)
return camel
})
return [arr[0],...resarr].join('')
}
return JSON.stringify(resObj)
}
let test = {a_b:1}
console.log(trans(test))
3. 2个正整数字符串的相加，即 '1'+'19'——>'20'（考虑超长字符串相加）
var addBigInt = function(a,b) {
if(a.length<b.length){
[a,b] = [b,a]
}
b = Array(a.length-b.length).fill(0).join('') + b
console.log(a,b)
let carry = 0
let res = ''
for(let i=a.length-1;i>=0;i--){
let sum = parseInt(a[i])+parseInt(b[i])+carry
if(sum>9){
carry = 1
} else {
carry = 0
}
res = (sum)%10 + res
}
if(carry === 1) res = 1 + res
return res
}
console.log(addBigInt('1','19'))
问答：
http头部有哪些
分为通用，请求，响应，实体
BFC，display属性
diff，唯一key，dirty compnent
前端缓存，cache，session 区别
egg koa
隐藏元素方式，区别
UDP TCP
TCP：可靠，要握手连接，有流量控制拥塞控制
UDP：高效不可靠，适合直播视频等
