2023-05-06 17:05 已编辑 58集团_企业应用_前端

关注

美团前端笔试一面二面23年总结

省流

美团爱考http，手写二叉树

经验

美团特点就是效率高，就目前的美团面经来看，看起来是笔试做的差不多，再按简历的优势来约面（比如说学历- -），也难怪我被排在后面

就面经来看，哪怕手写写不出来，也没关系，其他表现好也可以

教训

面试多会照着简历问，所以不熟的东西千万不要作死写上去
手写一定要滚瓜乱熟，因为考的都是基础，所以面试时给你停顿时间不超过一分钟
答不出来也不必紧张，面试官的目的就是深挖到你答不出来，只是为了摸清你了解到哪个程度，一般情况并不会因为你少部分答不上来就不要你了

美团前端笔试3.25，4.1总结

4.6酒旅

感觉KPI面。。。八股文啥也没问，一直追着问项目，一般是简历上没啥问的会考察知识点，我都坦白项目是照着敲的，做了有段时间已经忘了，但还是追着问- -，最后说看我太紧张问了道算法（await promise），结果也紧张地写不出来。凉了。。。

面试官超好的，一直引导我，但因为手写很简单，所以一分钟没思考出来就直接帮我写出来了，40分钟就面完了

我问面试官对我有什么建议，他让我多尝试一下广度，一面都是很简单的基础，尝试后端，开发，算法，重点是要感兴趣

平台

牛客视频面试

23年美团前端一面总结

公共

自我介绍
你了解前端那些方面。（工程化，移动端，跨端，可视化，图形学）
平时咋学的
看过那些前端方面的书。（《你不知道的JavaScript》）
为什么学前端
个人项目，展示项目（屏幕共享）
遇到的最大困难
npm发包，package.json有哪些字段，main了解吗，dev了解吗？（dev不了解，说了npm run dev是啥意思）
babel的配置文件有没有去看过
组件库如何实现让用户按需引入（这面试官说了解一下分包等概念）
1.webworker（我答了作用和使用办法）
2.webpack打包原理
3.webpack的loader和plugin的区别，执行时间上有没有区别，有没有自己尝试写过loader（js字符串等内容）
webpack热启动原理
git指令，问了一个git cherry-pick怎么用
介绍项目
有哪些权限，权限是怎么分配的
有哪些难点，怎么解决的？耗费时间最长的是哪个难点 react状态异步更新组件更新原理
可反问。
前端该看那些书
培养那些能力
如何保持竞争力

CSS

有哪些定位。绝对定位父元素一定要是相对定位吗？
css会阻塞渲染吗（link加载不会，但是生成css规则树会）
css怎么保证变量不被污染，scoped的原理
图片压缩除了canvas还有什么方案吗？
怎么改变css，自己的组件、第三方库的组件的css
css的优先级
怎么写全局css
CSS positon属性说说，分别都是相对于谁 （x2）
CSS单位说说
CSS水平垂直居中方案（x5）
script标签中的async、defer

JS

基本数据类型（x2）
判断
tpyeof返回值；函数返回啥；缺点，还有那些判断方式
有没有了解过filter map reduce的性能，区别（x2）
箭头函数和普通函数的区别（x2）
var let const 区别（x2）
类数组对象有哪些
promise的状态有哪些、说说都有哪些常用方法、每个方法的参数、结果、用法（x2）
settimeout
宏任务微任务（x2）
看代码输出题（事件循环）（x2）
垂直居中有哪些方法四种定位
虚拟DOM和diff算法
数组常用的api、哪些能改变原数组
ES6新增的特性有用过哪些
闭包、闭包会导致什么
垃圾回收机制
this绑定说说
看代码说输出（this指向问题）
原型原型链说说

其他

TCP三次握手为什么不能两次握手

有了解udp吗

http缓存机制（x2）

http状态码

dns域名解析过程

有了解设计模式吗

http缓存

解析url。输入url到页面渲染（x2）

谈谈http各个版本：http1.0-1.1-2.0的进化史（x2）

一般的发Http请求的流程是什么样的

4.具体说一下TCP四次握手

5.TCP客户端和服务端同时发出断开请求后续会怎么样

6.TCP滑动窗口策略，具体说说，它有什么好处，实现机制

7.TCP拥塞控制有几种策略分别介绍一下

9.能具体讲一讲http1.1吗持久连接具体是什么指什么连接谁与谁为什么要出这个呢，keep-alive会引起其他的什么问题（x2）

11.Http1.0时候发起一个http请求会开启一个TCP连接吗

强缓存和协商缓存

进程和线程区别进程间通信（x4）

进程状态，线程状态死锁进程通信

进程怎么被调度（就绪、阻塞、运行态那堆）

浏览器本地存储策略、localstorage与sessionstorage区别，刷新后还能访问sessionstorage原数据

跨域是什么、有哪些解决方式，问了postMessage

手写

手写深拷贝（给的测试对象有循环引用）

防抖，节流

函数柯里化

箭头函数this指向问题（看代码说输出

实现一个Promise.All

手写垂直水平居中

千位分隔符

场景题：手写一个hooks组件实现倒计时，React倒计时（x2）

瀑布流

判断链表是否有环（x2）

判断回文数字，使用多种方法（x2）

一个两个字符串，判断其中一个字符串包含另外一个字符串的最短字符子串

判断一颗二叉树是否对称

二叉树层次遍历

一个简单的递归展开树结构

二叉树，如，前序遍历（递归方法，迭代方法）

二叉树所有子节点的和

二叉树的序列化和反序列化

11.场景：如果开发者的页面打开正常，客户端的是白屏，怎么定位错误(循序渐进地引导我回答，首先是回答了看浏览器调试功能文件请求有没有正常获取到，如果正常我会在vue里面的生命周期之类的输出一些东西定位问题，毕竟客户端不能打断点，面试官说Chrome是可以的，让我可以了解一下)

12.算法题：开平方，中途有死循环bug问了我平常遇到这种无限循环的怎么去调试和debug。面试官的评价：总体不错，可以多看看用到的东西内部的原理配置啥的(例如axios，babel)

场景题：设计一个axios，红包分配（考虑精度问题和上下限）

给个数组按age排序[

{name:'a',age:4},

{name:'b',age:6},

{name:'c',age:3},

{name:'d',age:2},

{name:'e',age:9},

{name:'f',age:8},]

const person = [  
{name:'a',age:4}, 
{name:'b',age:6}, 
{name:'c',age:3},  
{name:'d',age:2},  
{name:'e',age:9},  
{name:'f',age:8},]
;
person.sort((a,b)=>{//按年龄升序排序
  return a.age-b.age;
});
console.log(person);//Array [Object { name: "d", age: 2 }, Object { name: "c", age: 3 }, Object { name: "a", age: 4 }, Object { name: "b", age: 6 }, Object { name: "f", age: 8 }, Object { name: "e", age: 9 }]

26、手撕题：模拟击鼓传花游戏的过程并返回获胜者（数组实现和队列实现）

27、手撕题：手写URL参数解析（x2）


// 解析URL，实现一个函数parseUrl使，
// parseUrl('https://www.meituan.com/index.html?a=test&b=2.1')
// 返回 {a:'test', b: 2.1}

function parseUrl(url) {
let args = url.substr(url.indexOf('?') + 1);
// console.log(args);
let arr = args.split('&');
// console.log(arr);
let obj = {};
arr.forEach((el) => {
let pos = el.indexOf('=');
let key = el.substr(0, pos);
let val = el.substr(pos + 1);
if (Number.isNaN(parseFloat(val))) {
//不是数值型咱们就不转
obj[key] = val;
} else {
//否则转
obj[key] = parseFloat(val);
}
});
return obj;
}
let str = 'https://www.meituan.com/index.html?a=test&b=2.1';
console.log('res ', parseUrl(str));