篇一：【前端】面经合集百度/阿里/腾讯/字节/美团/拼多多/搜狗等

2019年8月16日 

公司：猿辅导

岗位：前端二面（38min）

面试体验一般

1 你说一下自己怎么学习前端

2 说一下ajax

3 口述ajax代码

4 说一下http

5 说一下http状态吗

6 说一下304

7 说一下 缓存

手写

8 http的post的请求头有哪些

9 when("#id").then(console.log,console.error)

10 sum(2)(5) === sum(2,5)

11 a-z   1-26, abc 123,  那123  代表？

 

2019年8月13日 

公司：美团   

岗位：前端一面（80min） 

面试体验非常好

1 介绍一下自己

2 说一下自己是怎么学习的

3 说一下三栏布局  两边固定  中间自适应  五种

4 说一下bfc

5 说一下var let const的区别

6 说一下什么是变量提升

7 说一下基本数据类型和基本数据类型的区别

8 说一下跨域  解决方法  详细说一下 jsonp 和 CORS

9 服务器端是不是可以发送xmlHttpRequest

10 手写jsonp 不太会

11 手写数组扁平化

12 手写正则表达式  13900001234 怎么把手机号变成 139****1234  不会

13 replace说一下用法

 

这次美团的面试官非常好，我的面试体验非常好，开始***别卡，老师换成了标清线路，结果还是不行，老师就用电话打过来，一边视频一边打电话，我真觉得自己好菜好菜，老师还是特别有耐心的给我讲解，感谢老师。

 

2019年8月13日   

公司：腾讯   

岗位：前端二面   

面试体验非常好，但是挂了

 

我说我紧张，老师还跟我聊了会天，让我别紧张，问我专业和经历。估计是本来就有更加好的人选，我本来就不够规格。不过没关系，感谢面试官老师。

1 介绍一下自己

2 你是怎样学习前端的

3 介绍一下项目结构，说一下难点。

4 jsonp能用post吗

5 promise的兼容性了解么

6 性能优化你知道那些

7 强缓存返回的状态码  我不会

8 说一下强缓存的header头有哪些

9 说一下etag在发送请求种有什么用

10 说一下https

11 说一下https建立的过程

12 说一下ca生成

13 说一下对称加密和非对称加密

14 https可以预防哪种攻击  xss'csrf  答案都不能

15 说一下xss 和csrf

最后，我问了一下，我有哪些不足？

系统化知识

他说他们主要是招基础好的，知识系统化的学生。换句话说，就是科班的。

我问技术栈

他们主要做app的  什么ios 安卓 web vue react 都有  现在还做一些给予native的混合开发

 

2019年8月9日

公司：猿辅导

岗位：前端一面

1 介绍一下自己

2 说一下你做的项目

3 写一个导航栏，用vue，数据结构是老师给的。写了一部分，他让我改进，我说了写思路开始写，我写的太慢了，写了一半，所以就不让我写了

4 说一下输入url后前后端进行了哪些工作

5 说一下三次握手  四次挥手

6 说一下跨域 解决方法

 

2019年8月7日

公司：拼多多

岗位：前端二面

1 无自我介绍

2 说一下你一面没有回答的问题 webpack router

3 利用路由跳转到一个页面，用哪些方法

4 说一下跳转路由组件怎样销毁

5 从一个路由页面跳转到另一个路由页面，我在前一个路由页面有一个请求还没有结束，应该怎么办

6 history模式与hash模式比较

7 你哪方面比较强   es6  说一下map与weakmap的区别

8 说一下symbol

9 说一下性能优化

10 css文件在加载的过程种出现了阻塞会怎样？ 加载html文档10ms  加载css10s  会出现什么现象

11 html语义化种 dl dt dd什么意思  ol ul

12 说一下http1.1的keep-alive

13 说一下htpp1.1 与 http2.0 什么区别

14 http1.1中的keep-alive与http2.0中的多路复用有什么区别。

 

我有哪些地方需要改进

1 原生js

2 计算机网络

 

2019年8月6日 

公司：腾讯王者荣耀 

岗位：前端一面

面试体验非常好

1 介绍一下自己

2 说一下vuex  中间问了一下为什么只能用mutation改变数据

3 详细说一下双向绑定，顺带说了一下vue3.0双向绑定

4 说一下是虚拟dom  顺带说了一下vue3.0虚拟dom

5 说一下你封装的组件

6 说一下减少耦合，不用props传递属性怎么办？slot

7 说一下es6 import 与node export有什么区别

8 说一下promise

9 说下async await

10 说一下var let const的区别

11 口述ajax源码

12 axios底层你知道么？猜的 fetch

13 fetch你知道哪些

14 说一下flex

15 说一下 rem em  说一下 vw vh

16 说一下translate transform transition animation

17 说一下浏览器的渲染过程

18 css阻塞怎么办

19 数据结构与算法你知道哪些

20 说一下快排  时间复杂度  空间复杂度

21 说一下选择排序 时间复杂度 空间复杂度‘

22 什么是平衡二叉树

23 能实习吗

24 想来成都吗？

 

他说二面是算法 ，结果 ，呵呵了，没有算法。计算机网络基础挺多的。二面的时候挂了。

 

2019年8月20日 

公司：腾讯 地图

岗位：前端一面（56min）

面试体验一如既往的好 

本来是约的昨天的，结果被鸽了。面试官开会。其实也怪我自己，因为，我改的时间，所以。。只能今天面试了

1 介绍一下自己

2 说一下自己看的vue源码有哪些？ vue双向绑定 和  vue路由

3 说一下vue的双向绑定

4 说一下vue是怎样监听数组的

5 说一下在data中，我添加一个属性，我怎样通过数据劫持，监听到他。其实调用了一个方法$set

6 说一下v-model与自定义组件之间是怎样双向绑定的

7 说一下vue的生命周期及其各个阶段是干什么的

8 说一下vue组件之间的数据传递，我说了 父子组件的  eventbus  vuex slot

9 说一下hash路由和history路由的原理

10 说一下你了解的es6，吧啦吧啦吧

12 说一下promise在出错的时候怎样处理

13 说一下跨域  proxy 我不太懂  但是经常用的jsonp和cors

14 说一下jsonp的原理，有什么缺点

15 说一下cors

16 你知道webpack，了解不多，以前配过，后来就不用了

17 浏览器缓存你知道吗

18 强缓存的关键字有哪些

19 说一下你的项目中登陆页面是怎样的做的

20 你有什么问题要问我吗

 

1 我需要提高哪些方面（数据结构与算法）

2 咱们的技术栈是什么（vue）

3 咱们腾讯地图是不是要用（canves/d3/threejs/webgl特别多？看方向）

 

2019年08月22日 

公司：腾讯地图二面（30min）

面试体验非常好 Dony老师

1 介绍一下自己

2 说一下自己的项目

3 说一下项目中比较印象深刻的地方

4 说一下vue双向绑定和路由

5 说了以下自己的nodejs

6 你朋友用三个词来形容你的词

7 印象最深刻的事情

8 有什么爱好

9 你有什么想问题的

2019年08月23日 

公司：阿里巴巴 飞猪 

岗位：前端一面（36min） 

面试体验非常好 

本来老师下午5.30打电话过来的，可是不太方便，约的晚上7.30

后来老师晚上7.30打电话过来，我跟老师表示歉意，然后就开始了。

1 自我介绍一下

2 说一下机械专业有学什么有关计算机的课程吗

3 说一下你的项目

4 你在做项目的时候，难点有哪些

5 你的登录那一块怎么做的  localstorage

6 有什么缺点吗

7 如果让你现在设计，你会怎么设计

8 cookie与session有什么区别吗

9 cookie有什么缺点吗

10说一下xss

11 他跟csrf有什么区别吗

12 怎样预防csrf

13 你了解https吗

14 服务器到客户端传过来的秘钥是私钥还是公钥

15说一下vue与react的区别有哪些

16最后一个问题，你对性能优化做过哪些研究？（自我介绍的时候提过）

17穿插问的 什么是回流

18说一下cdn主要解决什么问题？

 

提问环节

我需要在哪些地方提高自己？热情  项目  解决问题

技术栈  react

想在哪里工作？  都可以，我可以去大家都不想去的地方

老师问：你家哪里的   山东   北京离家比较近  （杭州环境比较熟悉）

 

2019年8月26日 

公司：阿里巴巴 飞猪 

岗位：前端二面（35min） 

面试体验非常好 

本来老师下午3.30打电话过来的，可是不太方便，约的晚上7.10

后来老师晚上7.15打电话过来，然后就开始了。

 

1 自我介绍

2 说一下cdn

3 cdn的应用场景有哪些

4 cdn高层次的应用？有点晕

5 box-sizing:有哪些属性

6 说一下boder-box有什么特点

7 重绘 回流

8 怎样减少回流

9 浏览器是怎样判断一个css属性是不是兼容的？

10 移动端300ms问题

11 移动端点透问题

12 说一下async await

13 我有多个异步请求，我怎样才能保证他们并行处理？

14 v-if与v-show的区别

15 computed与watch

16 vue强制刷新用哪个命令   forceUpdate() 我不会

17 vue与react的区别

18 一个按钮我怎样知道它点击了多少次   埋点 但是我不会做

19 如果让你做你会怎样做

2019年8月27日 

公司：360 手机助手 

岗位：前端一面（36min）

1 自我介绍

2 说一下项目 登录部分

3 说一下 项目的收获

4 说一下vue-router的原理

5 最近用vue-router路由的原理解决的一个问题

6说一下map 和  set

7 http

8 说一下缓存

9 说一下双向绑定

10 一个题目

console.log(0)

setTimeout(function(){

console.log(1);

}, 200)

 

var p = new Promise(function(resolve){

console.log(2);

setTimeout(function(){

resolve(3)

}, 200)

});

 

p.then(function(v){

console.log(v)
})

 

console.log(4)

 

2019年8月27日

公司：360 手机助手 

岗位：前端二面（80min）

 我撕了八个代码 你敢信

以下是我的答案  不对的  大家自己可以去搜一下答案

1 自我介绍

2 写一个 数组打乱的题目

var arr = [1,2,3,4,5];

/**

* @param {array} arr

* @return {array}

*/

function shuffle() {

}

 

我的回答

function shuffle(arr){

if( arr.length == 0 ){

return [];

}

var len = arr.length;

var res = arr.sort((a,b)=>}{

return Math.random() - 0.5;

});

return res;

}

console.log( shuffle(arr) )

3 将3  2   1 的顺序 改为 1  2  3

document.body.insertAdjacentHTML('beforeend', `<ul id='ul'>

<li>3</li>

<li>2</li>

<li>1</li>

</ul>`);

我的回答

var ul = document.getElementById("#ul");

 

var lis = ul.getElementsByTagName("li");

 

var html =""

Array.prototype.slice.call(lis).reverse().forEach((item)=>{

html += "<li>" + item.text +"</li>"

})

 

var newhtml = "";

 

for( let i = lis.length-1;i >= 0;i-- ){

newhtml += "<li>" + lis[i].innerText() + "</li>"

}

 

ul.removeChild();

 

ul.innerHtml(newhtml);

 

4 输出结果

console.log('script 0');

setTimeout(() => {

console.log('setTimeout 0')

},0)

setTimeout(() => {
console.log('settimeout 1');

Promise.resolve().then(() => {

console.log('promise then');

})

}, 0);

var promise1 = new Promise((resolve) => {

console.log('promise 1');

})

promise1.then(res => {

console.log('promise 1 then ');

})

 

我的回答

 

script 0

promise 1

promise 1  then

setTimeout 0

settimerout 1

promise then

5 实现new的过程

new

 

function dog() {}

dog.prototype.bark = function() {}

 

const wangcai = new dog();

 

function _new () {}

 

const xiaohua = _new(dog);

xiaohua.bark();

 

我的回答

function dog() {}

dog.prototype.bark = function() {}

 

const wangcai = new dog();

 

function _new (fun) {

var  o = {};

o.__proto__ = fun.prototype;

fun.call( o )

return o;

}

 

const xiaohua = _new(dog);

xiaohua.bark();

 

6

const home = { template : '<div>home</div>'}

'/detail/:id'

const detail = {

template: `<div> {{ detail}}</div>',

methods: {

async getData (id) {

let res = await fetch('xxx');

let data = res.json();

this.detail = data;

}

}

}

 

<template>

<div id='app'>

<router-link to="/home"></

<router-link to="/detail/1">..

<router-link to="/detail/2">

<router-view/>

</div>

</tempalte>

 

写出异步请求，根据路由参数 来获得数据

 

7 给定矩阵int a[3][4],若a[0][0]地址为1000，按列存储时a[1][2]的地址为（      ）  1036？？

 

8<div class="parent">

<div class="logo">

<img src="" alt="">

</div>

<div class="detail">

<p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>

</div>

</ div>

 

利用flex实现 左侧128px  右侧自定义   右侧文字   如果太多，单行显示，剩余的部分用省略号

我的回答

 

.parent{

display:flex;

flex-flow: row no-wrap;

justify-conent:space-between;

align-items:center;

}

 

.logo{

flex:0 0 128px;

}

.detail{

flex:1;

p{

overflow:hidden;

text-overflow:elipsis;

write-space:no-wrap;

}

}

 

 

9 说一下闭包 

10 一个盒子  宽度是父盒子的一般  高度是自身宽度的一半

11 单行居中  多行居左 怎么样也实现

12 说一下你看过的书有哪些

13 说一下    vue监听数组的原理  不会

14 说一下  你了解的新的知识热点有哪些   比如

15 ES6与ES2015有什么区别？  没区别

 

2019年8月27日   

公司：360手机助手 

岗位：前端三面（21min）

hr面试

1 介绍一下自己

2 说了一下经历

3 说了一下自己学校在哪里

4 问了一下家庭情况

5 问了一下具体的打算

6 问了一下有没有offer

7 问了一下怎么学习前端

8 问了看了哪些书

9 问了一下想去哪里发展

 

我的提问

1 工作时间

2019年9月9日 

公司：海信

岗位：前端一面（38min）

面试体验挺好

1 介绍一下自己

2 说一下前端优化你做过哪些工作

3 说一下类选择器的解析顺序  从左到右 还是从右到左

4 说一下为了性能优化  选择器使用注意哪些

5 说一下jQuery 与 vue你在用的时候有什么区别

6 说一下你读的源码？

7 说一下单页面应用与多页面应用的区别  就是spa

8 说一下发布订阅  我直接说了一个eventemiter

9 说一下你了解的排序

10 说一下快排原理

11 你说你们项目有5个人，他们的运作模式是什么样子的

12 你们开发和测试之间是怎样进行的

13 说一下前端开发 面向后台和面向用户的区别

14 你更倾向于哪一种

15 哪一种更具有挑战性

16 问了以下基本情况 学习  大学  获奖之类的

17 你有什么问题要问我

 

我问了一下

1 咱们的工作地点

2 咱们用到的技术栈

3 我需要提高什么   他说了 原生js  以及node  以及 js

 

2019年9月18日 

公司：搜狗一面（70min）

1 介绍一下自己

2 你对vue有什么认识

3 你怎么看vue的发展情况和未来

4 你说你看过vue源码，那说说vue整个的架构是怎么样的？不会

5 那你说说vue的路由吧

6 写个路由

1.实现一个单页Tab路由切换

路由A： /A

路由B： /B

使用原生js实现

 

点击A 》 点击 B 》浏览器后退，需要右侧区域显示为A

 

inline-block, inline, block

 

<div id="content">

<div id="route">

<a href="#A">A</a>

<a href="#B">B</a>

</div>

 

<div id="view"></div>

</div>

 

 

 

<style>

#content{

display:flex;

}

#route{

width:100px;

}

a{

dispaly:block;

width:100%;

height:30px;

}

 

#view{

flex:1;

 

}

</style>

 

 

 

var view = document.getElementById("view");

 

document.onhashchange = funciton(e){

var href = window.location.href;

var str = href.slice( str.indexOf("#")+1 )

if( str == "A" ){

view.innerHtml = "A"

}

if( str == "B" ){

view.innerHtml = "B"

}

}

 

写的不好  没有实现后退功能

7 说一下行内元素和块级元素的区别

8 写个深拷贝

 

function clone(object){

var obj;

if( Array.isArray(object)){

obj = []

}else{

obj = {}

}

for( var key in  object ){

if( object.hasOwnproperty(key) ){

if( typeof (object[key]) == "object" ){

obj[key] = clone( object[key] )

}else{

obj[key] = object[key]

}

}

}

return obj;

}

 

写完  老师问 你是不是刷过题

9 说一下浏览器缓存

10 你知道单线程和多线程码？  不太懂

11 你知道浏览器缓存吗

12 你知道异步吗？我说了ajax fetch  promise async  awit  没敢说 generate

13 .封装一个jsonp函数，实现跨域请求

 

<script scr="http://www.sougou.com?callback=sougou"></script>

<script>

function sougou(data){

console.log(data)

}

<script>

<script>

function jsonp(url){

var script = document.createElement("script")

script.src = url +"?callback=sougou";

var body = document.getElementByTagName("body");

body.append(script)

var res ;

function sougou(data){

res = data;

}

return res;

}

</script>

 

14 说一下你在前端过程中遇到的问题

15 你为什么转前端

16 你是怎么学习前端的

17 你是面了哪些公司

18 你为什么没过  你有没有总结过

19 你又什么要问我的

20 面试官说一共三面  如果过了再联系我

 

2019年9月20日   

公司：58转转

1面（35min）

1 没有自己介绍  直接问你的项目和你的基础框架

2 移动端适配  rem 与 em区别  怎么计算   与dpi的关系 这个不会

3 css的盒模型

4 js基本数据类型

5 口述数组扁平化

6 数组累加怎么做  for reduce

7 数组求最大值怎么做 for  sort  Math.max

8 没隔500ms输出1 2 3 4  5 怎么做

9 promise原理   这个这不会

10 addEventLisener 与 on绑定的区别

11 正则表达式字符串去重  不会

12 正则表达式获取url中query的参数

13 xss与csrf

14 nodejs进程管理  不会

15 vue的双向绑定原理

16 你平时怎么学习前端

17 你有什么要问我的

 

2019年9月20日 

公司：字节跳动

1面 18min

为了项目问到死

问了双向绑定把我问死了

 

2019年9月20日 

公司：小米

岗位：前端 （一面）

1 说一下小程序适配和h5有什么区别  不会

2 说一下移动端和化h5的适配区别  不会

3 说一下rem  和 em

4 说一下根结点的字体大小怎么确定

5 你知道的几种隐藏的方式，有什么不同

6 css动画和js动画相比，优势  不会

7 说一下js的数据类型

8 判断数据类型的方法

9 实现instanceof 不会

10 判断原型链  我真的哭了

11 说一下事件 捕获 目标 冒泡 怎么判断事件是捕获还是冒泡阶段触发

12 跨域

13 get  post区别

14 说一下key

15 说一下diff算法  复杂度

16 说一下父子组件生命周期关系

17 你喜欢有挑战的工作还是又成就感的工作

给定一个数组 nums，编写一个函数将所有 0 移动到数组的末尾，同时保持非零元素的相对顺序。
示例:
输入: [0,1,4,0,3,12]
输出: [1,4,3,12,0,0]
复制代码
说明:
必须在原数组上操作，不能拷贝额外的数组。
尽量减少操作次数

 

2019年9月23日   

公司：搜狗

二面：80min

1 介绍自己

2 实习的收获

3 公司里面的开发流程，有什么优点

4 公司开发前后的技术栈

5 公司项目的权限是怎么做的

6 xss csrf攻击

7 场景题  如果用户反应白屏   怎么处理

8 如果用户反应又弹窗广告  怎么办

9 用户反应又中间人攻击  怎么办

10 http 怎样 转为 https

11 说一下加载优化

12 http1.1中的哪些优化在http2.0中不可以用

13 算法题

14 你有什么想问我的

// ‘123’ -> 123

// ‘a123’ -> NaN

function parseNumber(str){

 

}

 

function parseNumber(str){

if( str == "" ){

return NaN;

}

var reg = /[a-z][A-Z]/ig

if(  reg.test(str) ){

return NaN

}