动画相关
//html
<div class="btn">
<div class="change"></div>
</div>
//css
.btn {
width: 100px;
height: 20px;
background: coral;
border: 1px solid #5e6d82;
}
.change {
width: 0;
height: 20px;
background: #2D93CA;
transition: all 2s;
}
.btn:hover .change {
width: 100px;
}
参考：https://codepen.io/JulianLaval/pen/KpLXOO
案例可能会变，主要考察 transition / animation 动画相关的知识点
浏览器内核相关
trident / IE浏览器
gecko / firefox浏览器
webkit 内核 / safari & Chorome
差异：渲染机制不同
参考：https://juejin.im/entry/5a05a25c51882535cd4a4c6b
搜索引擎找了一波，分享内容不多，特别是针对差异的文章。。。
JS语言特性
1、 解释型语言 - 不需要编译，直接解释运行
2、弱类型 - 对变量没有严格数据类型要求
3、跨平台 - 只要有js解释器 支持，能在任何地方运行
4、 基于对象 - 不仅能创建对象，也能基于对象创建对象 （原型链）
http 协议 / 缓存机制
强缓存 / 优先级最高，如果存在且未过期则直接返回缓存内容
Expires / http1.0 缺陷：受限于本地时间，如果修改本地时间则会失效
Cache-Control / http1.1 作为对1.0的一个补强
协商缓存 / 缓存过期则会进行协商缓存
Last-Modified 和 If-Modified-Since / http1.0
Last-Modified 表示本地文件最后修改日期，If-Modified-Since 会将 Last-Modified 的值发送给服务器，询问服务器在该日期后资源是否有更新，有更新的话就会将新的资源发送回来。
但是如果在本地打开缓存文件，就会造成 Last-Modified 被修改，所以在 HTTP / 1.1 出现了 ETag
ETag 和 If-None-Match / http1.1
ETag 类似于文件指纹，If-None-Match 会将当前 ETag 发送给服务器，询问该资源 ETag 是否变动，有变动的话就将新的资源发送回来
参考： https://mp.weixin.qq.com/s/y-yajw1GaWLKUdOJo3cbew
虚拟dom 算法
参阅： https://segmentfault.com/a/1190000016129036
浏览器渲染机制
渲染机制主要和浏览器内核有关，不同浏览器渲染流程不同
参考：https://juejin.im/entry/59e1d31f51882578c3411c77
什么是骨架屏
参考：https://segmentfault.com/a/1190000014832185
lazyload 实现原理
核心概念： 滚动监听 / 元素位置 / 可视区域
深入学习：看 GitHub 懒加载的库源码 -lazy load
箭头函数和 普通函数的区别
由于this在词法层面完成绑定，this指针无法被修改
没有原型对象
var foo = () => {};
console.log(foo.prototype) //undefined
无法使用new操作符
var Foo = () => {};
var foo = new Foo(); //Foo is not a constructor
箭头函数不绑定arguments,取而代之用rest参数…解决
function foo(...args) {
return args;
}
foo(1, 2, 3); // [1,2,3]
js遍历对象
1、 for in 循环 / 循环遍历自身的和继承的可枚举属性
2、Object.keys(obj) / 返回一个数组，包括对象自身的（不含继承）所有可枚举属性
3、getOwnPropertyNames() / 用于返回对象所有属性，包含可枚举属性和不可枚举属性，不包含Symbol属性
4、 Object.getOwnPropertySymbols() / 用于返回对象所有属性，包含可枚举属性和不可枚举属性，只包含Symbol属性
computed 相关
1、计算属性拥有缓存优势 / 缓存内部实现原理
2、默认只有getter，可以手动设置setter，没有设置情况下赋值会报错
CORS 相关
简单请求：
1、使用 get 、 head 、 post
2、content-type 必须为text/plain、multipart/form-data、application/x-www-form-urlencoded之一
3、没有人为设置规范外header字段
不满足以上要求均为复杂请求，发送请求之前会先进行预检请求
cors 携带 cookie 相关
cors中请求默认不携带cookie，除非满足以下条件：
1、请求配置了 withCredentials = true;
2、后端配置了 Access-Control-Allow-Credentials: true
3、Access-Control-Allow-Origin 设置不为 *
参考：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS
后记
难度偏中，前端技术扎实，想拿到offer应该不难
如果觉得本文对你有所帮助，就star一下吧～大传送之术！ 我的博客Github
原文地址：https://www.cnblogs.com/buzhiqianduan/p/10758069.html