其他技术无关：
三五年规划
其他技术相关：
es6新特性
前端如何优化
性能优化相关(这个点很大，设计很多方面，不要自以为优化就是网上经常看到的那一套)
lodash相关
mvvm的好处
设计模式相关(单例、发布订阅等)
浏览器渲染过程
设计一个模版引擎
设计一个打包工具
设计一个mvvm框架需要注意的case
源码阅读相关
jQuery中被誉为工厂函数的是？
如何修改chrome记住密码后自动填充表单的黄色背景？
HTML5离线缓存机制
HTML5新增标签有哪些
如何使用storage 对js文件进行缓存
js部分：
闭包（概念，使用场景，问题）
什么是闭包?* 堆栈溢出有什么区别？ 内存泄漏? 那些操作会造成内存泄漏？怎么样防止内存泄漏？
回调函数?
继承
原型，原型链，_proto_
作用域链
变量提升
call, apply, bind
call & apply 两者之间的区别，call & apply有什么好处？
对promise的了解
this
js节流和防抖
函数节流，函数去抖
null和undefined的区别
typeof返回类型（字符串形式），可以判断function类型
判断对象类型的方法instanceof
typeof和instanceof的区别
堆栈，堆栈溢出，与函数关系？
设计模式
逻辑与，逻辑非
事件穿透
知道什么是事件委托吗？有什么好处?
windows的onload事件和documentloaded谁先谁后
如果Student类继承Person（基于原型继承），let s = new Student('lily')，那么s instanceof Person返回什么？
new和instanceof的内部机制
刚刚我们用到了箭头函数，说一下箭头函数this指向问题？
for...in迭代和for...of有什么区别？
说一下你对generator的了解？
说一下macrotask和microtask？并说出下面代码运行结果
类的创建与继承（es5实现方法 + es6实现方法）
解决异步回调地狱有几种方案
说说前端中的事件流
如何让事件先冒泡后捕获？
图片的懒加载和预加载
mouseover和mouseenter的区别
js的new操作符做了哪些事情
改变函数内部this指针的指向函数（bind,apply,call的区别）
js的各种位置，比如clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop的区别？
js拖拽功能的实现
异步加载js的方法
js延迟加载的方式有哪些？
defer和async、动态创建DOM方式（用得最多）、按需异步载入js，创建script，插入到DOM中，加载完毕后callBack
ajax解决浏览器缓存问题
js中的垃圾回收机制
eval是做什么的
如何理解前端模块化
commonjs,AMD,CMD
对深度克隆的简单实现
js监听对象属性的改变
如何实现一个私有变量，用getName方法可以访问，不能直接访问
==和===，以及Object.is的区别
let、const、var
写一个方法遍历所有文档树所有节点(考察递归)
sort排序相关(注意ascll这个坑)
数组和对象的深浅拷贝
String + Array的一些基本操作
高阶函数
动画
setTimeout、setInterval和requestAnimationFrame
引起内存泄漏的原因
map、filter、reduce相关
Map和Set
Map和Set
介绍js基本数据类型，复杂数据类型，值类型，引用数据类型，堆栈数据结构
如何将字符串转化为数字，如‘12.3b’
js有哪些模块化方式和规范？
请至少用两种方法实现不借用第三个变量的情况下，将两个变量值对调
如何判断变量是否是数组？
arrayStr instanceof Array function isArray(obj) { return Object.prototype.toString.call(obj) === '[object Array]'; }
请列举一下js垃圾回收方法及原理
如何清除一个定时器
自执行函数?用于什么场景？好处?
什么是构造函数？与普通函数有什么区别?
window.onload ==? DOMContentLoaded ?
如何合并两个数组？数组删除一个元素?
强制转换 显式转换 隐式转换?
同步异步?
函数fn1 函数fn2 函数fn3，如果想在三个函数都执行完成后执行某一个事件应该如何实现?几种方案？
JavaScript提供了哪几种“异步模式”？
1、回调函数（callbacks）
2、事件监听
3、Promise对象
程序设计模式（工厂模式，观察者模式/发布订阅模式）
js几种继承方式
面向对象：
简述一下你理解的面向对象
如何创建一个对象
类的声明有哪些方式，如何实例化
继承的本质是？
如何实现继承？
原型链：
JavaScript如何创建对象？
原型、构造函数、实例、原型链的关系如何？
原型、构造函数、实例、原型链的关系如何？
new运算符的实现机制？
DOM：
介绍DOM事件级别？
请封装事件监听和解绑的兼容写法？
介绍下事件模型？
介绍下事件流？事件捕获？事件冒泡？
DOM事件捕获的具体流程是怎样的？
Event 对象有哪些常用应用？
如何自定义事件？
如何添加一个dom对象到body中?innerHTML和innerText区别?
节点类型?判断当前节点类型?
js进阶：
自己实现一个bind函数
用setTimeout来实现setInterval
js怎么控制一次加载一张图片，加载完后再加载下一张
如何实现sleep的效果（es5或者es6）
简单实现一个promise
Function._proto_(getPrototypeOf)是什么？
实现js中所有对象的深度克隆（包装对象，Date对象，正则对象）
简单实现Node的Events模块
箭头函数中this指向举例
代码题：
请用css或js实现物体的平移动画
编写一个js函数fn，该函数有一个参数n（数字类型），其返回一个数组，该数组内是n个随机且不重复的整数，且整数取值范围是[2,32]
编写一个 getElementsByClassName 封装函数?
下面代码输出什么，若要输出0至9，该怎么办？
for(var i=0;i<10;i++){ setTimeout(()=>{console.log(i)},0) }
说一下macrotask 和 microtask？并说出下面代码的运行结果。
console.log('a');
setTimeout(() => {
console.log('b');
}, 0);
console.log('c');
Promise.resolve().then(() => {
console.log('d');
})
.then(() => {
console.log('e');
});
console.log('f');
实现一个once函数，传入函数参数只执行一次
function ones(func){ var tag=true; return function(){ if(tag==true){ func.apply(null,arguments); tag=false; } return undefined } }
将原生ajax封装成promise
var myNewAjax=function(url){ return new Promise(function(resolve,reject){ var xhr = new XMLHttpRequest(); xhr.open('get',url); xhr.send(data); xhr.onreadystatechange=function(){ if(xhr.status==200&&readyState==4){ var json=JSON.parse(xhr.responseText); resolve(json) }else if(xhr.readyState==4&&xhr.status!=200){ reject('error'); } } }) }
从promise、process.nextTick、setTimeout出发，谈谈Event Loop中的Job queue
setTimeout(function(){console.log(1)},0); new Promise(function(resolve,reject){ console.log(2); resolve(); }).then(function(){console.log(3) }).then(function(){console.log(4)}); process.nextTick(function(){console.log(5)}); console.log(6); //输出2,6,5,3,4,1
如何实现数组的随机排序？（两种方法以上）
react相关：
react核心思想
react constructor,super解释一下
setState
生命周期函数有哪些
axios封装
ant-design用到哪些功能
react组件封装（接口设计）
react-router原理，了解过react-router内部实现机制吗？
React中的controlled component 和 uncontrolled component区别（受控组件和不受控组件）
webpack相关：
webpack常用插件
webpack打包原理
webpack文件划分
chunk
loader原理
webpack优化措施
webpack打包优化
设计一个自己的打包工具需要设计哪些主要功能
babel相关
算法部分：
数组去重
排序
数组扁平化处理：实现一个flatten方法，使得输入一个数组，该数组里面的元素也可以是数组，该方法会输出一个扁平化的数组。
如果在17问的前提下，要做去重和排序处理又该怎么做（不用给出具体代码）
http，html和浏览器部分：
303和304的区别
token怎么传到后台
http请求中的keep-alive有了解吗？
get请求传参长度的误区
补充get和post请求在缓存方面的区别
http和https（基本概念，区别，工作原理，https优点，缺点）
tcp
TCP和UDP的区别
websocket的实现和应用
http请求方式，head方式
一个图片url访问后直接下载怎么实现？
web quality（无障碍）
几个很实用BOM属性对象方法
HTML5 drag API
http2.0
400,401,403状态码
fetch发送两次请求的原因
cookie，sessionStorage，localStorage的区别
web worker
对HTML语义化标签的理解
iframe是什么？有什么缺点？
Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?
Cookie如何防范XSS攻击
Cookie和session的区别
讲讲viewport和移动端布局
click在ios上有300ms延迟，原因及如何解决？
浏览器多个标签页面之间的通信
页面缓存
http缓存
你之前遇到过跨域问题吗？是怎么解决的？
html5多线程
服务器推送
浏览器内核有哪些
HTML5新特性
列出块级元素和行内元素，并说出两者区别
数据持久化技术(ajax)?简述ajax流程
一个页面从输入 URL 到页面加载显示完成，这个过程中都发生了什么？（流程说的越详细越好）
Ajax：
ajax 和 jsonp ？
ajax和jsonp的区别：
相同点：都是请求一个url
不同点：ajax的核心是通过xmlHttpRequest获取内容
jsonp的核心则是动态添加<script>标签来调用服务器 提供的js脚本。
ajax执行流程？
1. 创建XMLHttpRequest对象,也就是创建一个异步调用对象
2. 创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息
3. 设置响应HTTP请求状态变化的函数
4. 发送HTTP请求
5. 获取异步调用返回的数据
6. 使用JavaScript和DOM实现局部刷新
xhr对象 status ? readystate?
status是XMLHttpRequest对象的一个属性，表示响应的HTTP状态码。
readyState是XMLHttpRequest对象的一个属性，用来标识当前XMLHttpRequest对象处于什么状态。
readystate 0~4
0：未初始化状态：此时，已经创建了一个XMLHttpRequest对象
1： 准备发送状态：此时，已经调用了XMLHttpRequest对象的open方法，并且XMLHttpRequest对象已经准备好将一个请求发送到服务器端
2：已经发送状态：此时，已经通过send方法把一个请求发送到服务器端，但是还没有收到一个响应
3：正在接收状态：此时，已经接收到HTTP响应头部信息，但是消息体部分还没有完全接收到
4：完成响应状态：此时，已经完成了HTTP响应的接收
说出几个http协议状态码?
200, 201, 302, 304, 400, 404, 500
200：请求成功
201：请求成功并且服务器创建了新的资源
302：服务器目前从不同位置的网页响应请求，但请求者应继续使用原有位置来响应以后的请求。
304：自从上次请求后，请求的网页未修改过。服务器返回此响应时，不会返回网页内容。
400：服务器不理解请求的语法。
404：请求的资源（网页等）不存在
500： 内部服务器错误
ajax中 get 和 post 有什么区别?
get和post都是数据提交的方式。
get的数据是通过网址问号后边拼接的字符串进行传递的。post是通过一个HTTP包体进行传递数据的。
get的传输量是有限制的，post是没有限制的。
get的安全性可能没有post高，所以我们一般用get来获取数据，post一般用来修改数据。
jsonp原理？ 缺点?
工作原理：使用script标签实现跨域访问，可在url中指定回调函数，获取JSON数据并在指定的回调函数中执行jquery实现jsop。
缺点：只支持GET方式的jsonp实现，是一种脚本注入行为存在一定的安全隐患。如果返回的数据格式有问题或者返回失败了，并不会报错。
如何确保ajax或连接不走缓存路径
在Ajax中使用Get请求数据不会有页面缓存的问题，而使用POST请求可是有时候页面会缓存我们提交的信息，导致我们发送的异步请求不能正确的返回我们想要的数据
$.post(url,data ,ranNum:Math.random()} ,function(data){}）
ranNum : 这个是防止缓存的核心，每次发起请求都会用Math.random()方法生成一个随机的数字，这样子就会刷新url缓存
ajax的缺点
1、ajax不支持浏览器back按钮。
2、安全问题 AJAX暴露了与服务器交互的细节。
3、对搜索引擎的支持比较弱。
4、破坏了程序的异常机制。
5、不容易调试
页面性能：
提升页面性能的方法有哪些
异步加载的方式有哪些
defer,async的区别是什么
什么是浏览器缓存
缓存的分类有哪些（跟缓存相关的http头部有哪些）
什么是CND
预解析DNS？
如何开启DNS预解析？
渲染机制：
DTD是什么
DOCTYPE是什么？有什么作用？标准模式和兼容模式各有什么区别？
常用的DOCTYPE类型
浏览器的渲染过程
重排（reflow）是什么
重绘（repaint）是什么
如何减少重绘，避免重排？
HTTP：
http的主要特点
介绍下http报文的组成部分
常见的http方法有哪些
post和get的区别是什么
http状态码及其含义
常见状态码有哪些
介绍下持久链接（http1.1）
管线化是什么
管线化的特点是什么
错误监控、产品性能体系
前端错误分类有哪些
前端错误捕获方式分别是什么
如何使用Object.onerror捕获资源加载错误？
跨域的JS运行错误可以捕获么？错误提示是什么，应该怎么处理？
客户端上报错误的基本原理是什么？
通讯类：
什么是跨域通信？
什么是同源策略？
前后端通信有哪些？
如何创建ajax？
跨域解决方案有哪些？（六种方案）
安全类：
常见的攻击方式有哪些？
CSRF的原理及防御措施？
XSS的原理及防御措施？
请说明SQL注入的原理及防范方法
前端性能优化的关键时间点：
前端性能优化的关键时间点有哪些，分别是什么？
开始渲染时间如何获取？如何优化？
DOM Ready时间如何获取？如何优化？
首屏时间如何获取？如何优化？
onload时间如何获取？如何优化？
css部分：
css渲染
css布局（两栏布局，三栏布局）
用过flex布局吗？flex-grow和flex-shrink属性有什么用？
css盒模型的理解
画一条0.5px的线
link标签和import标签的区别
transition和animation的区别
BFC（块级格式化上下文，用于清除浮动，防止margin重叠等）
垂直居中的几种方法
关于js动画和css3动画的差异性
清除浮动有几种方式?
简述几个css hack?
:before 和 ::before 区别?
如何让一个div 上下左右居中?（三种方法）
伪类选择器和伪元素？c3中引入的伪类选择器有？c3中伪元素有?
placeholder?如何在ie8上兼容placeholder这个效果
常见兼容性问题？
如果对css进行优化如何处理？
sass和scss有什么区别?sass一般怎么样编译的
图片和文字在同一行显示?
1 在css中给div添加上“vertical-align:middle”属性。
2 分别把图片和文字放入不同的div中，然后用“margin”属性进行定位，就可以使他们显示在同一行。
3 把图片设置为背景图片。
a标签中 active hover link visited 正确的设置顺序是什么?
a标签的link、visited、hover、active是有一定顺序的
a:link
a:visited
a:hover
a:active
为什么要初始化CSS样式。
因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对CSS初始化往往会出现浏览器之间的页面显示差异。
解释下 CSS sprites，以及你要如何在页面或网站中使用它。
CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background- repeat”，“background-position”的组合进行背景定位，background-position可以用数字能精确的定位出背景图片的位置。这样可以减少很多图片请求的开销，因为请求耗时比较长；请求虽然可以并发，但是也有限制，一般浏览器都是6个。对于未来而言，就不需要这样做了，因为有了`http2`。
什么是 FOUC（无样式内容闪烁）？你如何来避免 FOUC？
FOUC - Flash Of Unstyled Content 文档样式闪烁
<style type="text/css" media="all">@import "../fouc.css";</style>
而引用CSS文件的@import就是造成这个问题的罪魁祸首。IE会先加载整个HTML文档的DOM，然后再去导入外部的CSS文件，因此，在页面DOM加载完成到CSS导入完成中间会有一段时间页面上的内容是没有样式的，这段时间的长短跟网速，电脑速度都有关系。
解决方法：只要在<head>之间加入一个<link>或者<script>元素就可以了。
多行元素的文本省略号
visibility=hidden, opacity=0，display:none
双边距重叠问题（外边距折叠）
position
伪元素伪类
css预处理器
设置元素浮动后，该元素的display值是多少？
选择器类型及优先级
一个满屏‘品’字布局如何设计？
::before和:after中双冒号和单冒号有什么区别？解释一下这两个伪元素的作用
CSS3新特性
css盒模型：
CSS盒模型是什么？
标准模型和IE模型的区别？
CSS如何设置这两种模型？
JS如何设置/获取盒模型对应的宽高
BFC是什么，讲一下原理？
BFC布局规则是？
哪些元素会生成BFC?
BFC的使用场景有哪些？（1.自适应两栏布局；2.清楚内部浮动；3.防止垂直margin重叠）
css布局：
三栏布局，高度已知，左右两栏固定，中间自适应的三栏布局有几种实现方式，各自的优缺点是什么？
三栏布局，高度未知，以上布局哪些仍可用，哪些不可用？
三栏布局，高度已知，左中固定，右自适应
三栏布局，上下固定，中自适应
CSS居中布局有哪些，适用于什么场景，举例说明？
CSS布局时需要注意哪些方面？
html部分：
移动开发：
移动开发中使用rem的优点
列举移动开发中meta基础知识点
移动端上什么是点击穿透?
什么是移动端的300ms延迟？什么是点击穿透？解决方案?
jQuery：
使用jQuery实现，获取位于id为fruit的下value为apple的option元素
Jq中如何实现多库并存?
Jq中get和eq有什么区别？
Jq如何判断元素显示隐藏？
Jq绑定事件的几种方式？on bind ?
Jq中如何将一个jq对象转化为dom对象？
Jq中有几种选择器?分别是什么?
Jq中怎么样编写插件?
$('div+.ab')和$('.ab+div') 哪个效率高？
$.map和$.each有什么区别
$(function(){})和window.onload 和 $(document).ready(function(){})
Jq中 attr 和 prop 有什么区别
你对数据校验是怎么样处理的？jquery.validate？
通俗的说，就是为保证数据的完整性，用一种指定的算法对原始数据计算出的一个校验值。接收方用同样的算法计算一次校验值，如果和随数据提供的校验值一样，就说明数据是完整的。
用正则表达式来处理;
jquery.validate：为表单验证插件
在jq中 mouseover mouseenter mouseout mouseleave 和 hover有什么关联?
mouseenter与mouseover：
不论鼠标指针穿过被选中元素或其子元素，都会触发mouseover事件。
只有在鼠标指针穿过被选元素时，才会触发mouseentr事件。
mouseout与mouseleave：
不论鼠标离开被选元素还是任何子元素，都会触发mouseout事件。
只有在鼠标指针离开被选元素时，才会触发mouseleave事件。
hover:
hover是一个符合方法，相当于mouseenter+mouseleave。
项目相关：
技术沉淀
项目中负责什么角色
表单验证是怎么做的
自己做了什么，解决了什么棘手问题，项目成果
简要的说并且说重点，从使用技术栈到项目架构的设计到技术难点的实现，分点说
面试官也是人，他也会好奇一些神奇的项目是怎么实现的，所以我的建议也就是平时多做一些有水平的项目，不要把todolist、图书馆管理系统这种烂大街的项目写在自己的简历上。
平时工作中怎么样进行数据交互?如果后台没有提供数据怎么样进行开发?mock数据与后台返回的格式不同意怎么办?
由后台编写接口文档、提供数据接口实、前台通过ajax访问实现数据交互；
在没有数据的情况下寻找后台提供静态数据或者自己定义mock数据；
返回数据不统一时编写映射文件 对数据进行映射。
上一个项目是什么？主要负责哪些？购物车流程?支付功能?
主要负责哪些就讲主要做哪些功能模块：
1）商品模块:
1、商品列表：商品排序 商品筛选 商品过滤 商品查询 商品推荐
2、商品详情:类型推荐 商品简介 商品详情 商品评价 售后维护
2)购物车模块：商品编号、数量、价格、总额、运费、运输选项、运费总计、从购物车删除选项、更新数量、结账、继续购物、商品描述、库存信息
简述下工作流程
我在之前的公司工作流程大概是这样的：公司定稿会结束以后，会进行简单的技术研讨，然后我们前端会进行先期的技术准备。前端切图人员会进行psd设计稿切图，并且将css文件进行整合。我们主要编写JS部分，其中包括搭建前端框架（大项目），编写js业务和数据持久化操作，我们也会编写js插件并且进行封装方便使用，还有就是编写JS前端组建和JS测试单元，最后将完成的JS部分与切图人员提供的HTML页面进行整合。最后对完成的页面进行功能测试、页面兼容、产品还原。然后对产品进行封存，提交测试。如果出现BUG会返回给我们开发人员进行修改，再提交测试，最后测试成功，进行版本封存。等到程序全部上线的时候进行线上测试。