[面试专题]一线互联网大厂面试总结

摘要：道阻且长啊前端面试总结前端面试笔试面试腾讯一面浏览器工作原理浏览器的主要组件包括用户界面包括地址栏后退前进按钮书签目录浏览器引擎用来查询及操作渲染引擎的接口渲染引擎渲染界面和是基于两种渲染引擎构建的，使用自主研发的渲染引擎，和都使用网络用来

前端 面试 笔试

1.浏览器工作原理

浏览器的主要组件包括： 用户界面－ 包括地址栏、后退/前进按钮、书签目录 浏览器引擎－ 用来查询及操作渲染引擎的接口 渲染引擎－
渲染界面:Firefox、Chrome和Safari是基于两种渲染引擎构建的，Firefox使用Geoko——Mozilla自主研发的渲染引擎，Safari和Chrome都使用webkit.
网络－ 用来完成网络调用，例如http请求 UI 后端－
用来绘制类似组合选择框及对话框等基本组件，具有不特定于某个平台的通用接口，底层使用操作系统的用户接口 JS解释器－ 解释执行JS代码
数据存储－ 属于持久层，浏览器需要在硬盘中保存类似cookie的各种数据

2.Web安全,举例说明

3.状态码

4.同源:同端口,同域名,同协议

5.对象继承

6.ES6历史以及新特性有哪些?

7.promise原理

8.事件模型

9.常见兼容性问题,列举(移动端/PC端)

10.性能优化　　　

类似百度搜索的提示框，兼容各大浏览器，可用键盘控制.
勉强憋了出来，但是挂掉了，犯了一些低级错误，显示经验不足．
面试官建议多看书，多写组件.

1.Ajax原理

2.浏览器解析过程

流程： 解析html以构建dom树->构建render树->布局render树->绘制render树
参考文章

3.垂直居中

4.数据类型判断

5.路由实现

6.数据本地存储

7.跨域 参考

8.数据双向绑定单向绑定优缺点

1.无线性能优化

2.Tap事件,Touch

3.数据存储

1.Dom操作

2.移动布局方案

3.前后端协作

4.原生Ajax实现过程

1.单链表反转

2.快排

3.即时通信(除了Ajax和websocket)

懵逼了
总结一下其他方式
1.Comet技术：基于HTTP长连接的Web端实时通信技术
2.SSE：服务器发送事件,使用长链接进行通讯

4.服务器代理转发如何处理cookie(nginx)

proxy_cookie_domain localhost example.org;
proxy_cookie_domain ~.([a-z]+.[a-z]+)$ $1;

proxy_cookie_path /one/ /;
proxy_cookie_path / /two/;

5.对象继承

6.this

7.rem布局的优缺点

一面(记录两个,其他都还好)

实现动画有哪些途径

CSS3

JS帧动画,定时器,requestAnimateFrame

Canvas动画

SVG

图片

对象继承的实现

二面(跪了)

web安全

https加密过程,证书用途

xss几种形式,防范手段,过滤哪些字符?

xsrf原理,实例,防范手段(Laravel的token)

Sql注入

性能优化

代码优化(html,css,js)

网络性能优化:

Cache缓存之强制缓存和协商缓存.看具体详情

CDN原理及应用

HTTP压缩之gzip

上下文环境对象

设计模式(要求说出如何实现,应用,优缺点):

单例模式

工厂模式

发布订阅模式

跨域(产生原因)

JSONP原理

CORS如何设置

Nginx代理

读过哪些框架源码?

如何写一个CSS库,要注意哪些东西?

JS面向对象之封装,继承,多态的体现和应用?

BST

promiseAll如何实现,以及如何实现多层异步回调?

加油站问题(贪心算法)

XHR具体底层原理和API

单例模式实现/设计模式

JSONP原理,回调过程

Latex怎么解析

hash算法实现,如何避免冲突,如何在冲突里检测

Generater

ES6怎么编译成ES5,css-loader原理,过程

ES6转成ES5的常见例子

常见数据结构,常见算法

node多线程实现

进程和线程

对前端的理解

说说rn,weex原理

说说XHR

Jq的选择器引擎,$(".a .b")以及$(".a").find(".b")

MD5摘要算法其他用途

前端架构的理解

前端框架的看法

如何做前后端分离

在不使用后端模板渲染的情况下,如何做前端数据直出(不使用异步请求数据)?

SSR适用什么场景?SPA首屏空白原因?

vue构建过程原理,具体流程

模板到DOM大致流程:
template模板经过parse处理后返回AST 获得一棵AST后再经过generate()生成渲染函数
执行渲染函数后会获得一个VNode，即虚拟DOM patch函数，负责把虚拟DOM变为真正DOM。

vue2新增内容?独立构建（standalone）和运行时构建（runtime-only）的差别和应用?详情

爬虫的实现原理?如何实现一个爬虫,如何解析文件?

如何解决爬虫慢的问题?

多线程如何保障各个线程的安全?

webpack工具和node了解哪些?node各个模块的底层原理?

CSS3实现卡片翻转?

说说职业规划?

说说HTML难点,语义化的体现?

说说CSS重要难点?如何实现垂直水平居中?

JS中this是什么?如何改变this?

讲讲时间复杂度计算?

算法题:假定26个字母对应1-26,将一串数字转成字母有多少种可能?
暴力解法复杂度是多少?

(百度外卖业务:包含移动客户端(RN,hybrid),PC web端,H5,后台界面vue,桌面应用包含编辑器插件,前端构建工具,node中间层)

盒模型之box-sizing

XHR原理及API

session和sessionStorage

map forEach(数组各个API细节)

dom事件代理,有什么优点?

三种隐藏方式差别:visibility:hidden,display:none,opacity:0

渲染上的差异:
1.将元素设置为display:none后，元素在页面上将彻底消失，元素本来占有的空间就会被其他元素占有，也就是说它会导致浏览器的回流和重绘。
2.设置元素的visibility为hidden，和display:none的区别在于，元素在页面消失后，其占据的空间依旧会保留着，所以它只会导致浏览器重绘而不会回流。
3.opacity:0,只是看不到元素,元素依然存在并且占有原有位置. 注: 事件绑定的差异: 1、display:none：元素彻底消失，不会触发绑定的事件.
2、visibility:hidden：无法触发其点击事件，有一种说法是display:none是元素看不见摸不着，而visibility:hidden是看不见摸得着，这种说法是不准确的，设置元素的visibility后无法触发点击事件，说明这种方法元素也是消失了，只是依然占据着页面空间。
3、opacity:0：可以触发点击事件，设置元素透明度为0后，元素只是相对于人眼不存在而已，对浏览器来说，它还是存在的，所以可以触发绑定事件
动画属性的差异: 1、display:none：完全不受transition属性的影响，元素立即消失
2、visibility：hidden：元素消失的时间跟transition属性设置的时间一样，但是没有动画效果.
3、opacity:0,动画属性生效,能够进行正常的动画效果.

代码演示地址

inline和block元素列举,block和inline-block区别?

span包含12px大小英文"abc",问span高度?baseline怎么理解?

css实现自适应正方形?

string查找第一个不重复字符.如果换成字符串呢?

Angular数据绑定机制?

重绘和回流的理解

querySelectAll和ByClassName所获取元素的区别?如何绑定事件?

getComputedStyle用法?

addEventListener绑定事件?参数不同的执行顺序.

正则匹配电话号码.exec,match,search用法?推荐一篇高质量正则文章

数据类型判断的方法,toString判断的来源?

ES6 class原理?

function rest参数长度?function.length如何判断与arguments对象长度区别?

var a;typeof a;let a;考察点

mvp,mvc,mvvm

vuex原理,watch对象

js defer async顺序,模块依赖(AMD,CMD差别)

设计模式和应用

session和cookie

清浮动,BFC

cookie存储在哪里?(memory)

BFC

Flexbox用法,详见总结

排序,找出最大三个数

快排原理,复杂度计算

继承的实现方式

vdom原理,实现

webpack打包是如何处理css图片的

模块

四栏布局

数组,数组对象去重

数组查某个字符出现次数

选择器权值

右键菜单定制

函数不定参

定时器原理

url=>渲染:script阻塞

数据结构应用

数据双向绑定(vue,ng原理)

面向对象三要素

闭包

三栏布局

内联元素包含块元素的表现

三种隐藏方式的区别

求最大子数组和.

块元素和内联元素渲染区别?

ul li实现计数.

flex-box用法

svg与canvas

JPG,png图片特点,场景

CSS写轮播

拖拽组建

PV统计

URL监听变化

1.数组操作

2.排序算法

3.动态规划(书包问题)

4.编程题(正则)

线程

各类通信协议

二叉树

算法复杂度

栈封装,利用栈对数组reverse(编程)

各类排序算法以及复杂度计算

Node的一些用法

二叉树遍历

JS内部属性

页面之间传参

程序题:数组找公共元素

出入栈可能性计算

数组去重