其实前端开发的知识点就那么多，面试问来问去还是那么点东西。所以面试没有其他的诀窍，只看你对这些知识点准备的充分程度。so，出去面试时先看看自己复习到了哪个阶段就好。
这里再分享一个复习的路线：（以下体系的复习资料是我从各路大佬收集整理好的）
《前端开发四大模块核心知识笔记》
最后，说个题外话，我在一线互联网企业工作十余年里，指导过不少同行后辈。帮助很多人得到了学习和成长。
我意识到有很多经验和知识值得分享给大家，也可以通过我们的能力和经验解答大家在IT学习中的很多困惑，所以在工作繁忙的情况下还是坚持各种整理和分享。
开源分享：docs.qq.com/doc/DSmRnRG… 代码如下：
HTML部分：
{{item.ProductName}}
{{item.Description}}
CSS部分：
.mainBlock {
width: 1080px;
margin: 0 auto;
padding: 20px 0;
height: 150px;
}
.displayWindow {
width: 100%;height: 100%;overflow: hidden
}
.mobilePanel {
width: 3240px;height: 100%;
}
.box {
float: left;width: 270px;height: 120px;background: url(../assets/images/item_bg.jpg) no-repeat center bottom;
}
.boxLeft {
width: 115px;float: left;height: 100%;
}
.boxRight {
width: 135px;float: left;
}
.proTitle {
line-height: 30px;font-size: 14px;margin: 2px auto;
}
.proText {
color: #666;line-height: 180%;font-size: 12px;margin: 2px auto;
}
JS部分：
export default {
name: 'Home',
data () {
return {
productList: [
{
ProductName: 'ET-NBAC-I',
Description: 'ET-NBAC-I三相不平衡智能调控系统是一种智能实时调控装置，...',
picSrc: require('../assets/images/ET-NBAC-I.png'),
picWidth: '80px'
},
{
ProductName: 'ET-NBAC-II',
Description: 'ET-NBAC-II三相不平衡智能调控系统是一种智能实时调控装置...',
picSrc: require('../assets/images/ET-NBAC-II.png'),
picWidth: '80px'
},
{
ProductName: 'ET-TSC++',
Description: 'ET-TSC++超快速电容器综合模块，具有速度快、容量大、寿命长...',
picSrc: require('../assets/images/ET-TSC++.png'),
picWidth: '80px'
},
{
ProductName: 'ET-D(S)VS',
Description: '末端电压稳定装置是一种跟踪末端线路电压变化、自...',
picSrc: require('../assets/images/ET-D(S)VS.png'),
picWidth: '80px'
},
{
ProductName: '在线监测系统',
Description: '电能质量在线监测系统是面向对象的大型电能质量在线监测与管理系统。...',
picSrc: require('../assets/images/在线监测系统.png'),
picWidth: '80px'
},
{
ProductName: 'PQ2000',
Description: 'PQ2000电能质量分析仪是北斗易通结合我国电力系统的特点，采用...',
picSrc: require('../assets/images/PQME2000.png'),
picWidth: '80px'
},
{
ProductName: 'PQME2000系列',
Description: 'PQME2000系列是北斗易通公司严格按照国家颁布的相关技术标准...',
picSrc: require('../assets/images/PQME2000系列.png'),
picWidth: '80px'
}
]
}
},
mounted () {
let len = this.productList.length % 4
// 根据产品数组长度除以4的余数，来给数组末尾加入几个空的object
switch (len) {
case 0:
break
case 1:
for (let i = 0; i < 3; i++) {
this.productList.push(
{
ProductName: '',
Description: '',
picSrc: '',
picWidth: '0'
}
)
}
break
case 2:
for (let i = 0; i < 2; i++) {
this.productList.push(
{
ProductName: '',
Description: '',
picSrc: '',
picWidth: '0'
}
)
}
break
case 3:
js基础
1)对js的理解？ 2)请说出以下代码输出的值？ 3)把以下代码，改写成依次输出0-9 4)如何区分数组对象，普通对象，函数对象 5)面向对象、面向过程 6)面向对象的三大基本特性 7)XML和JSON的区别？ 8)Web Worker 和webSocket？ 9)Javascript垃圾回收方法？ 10)new操作符具体干了什么呢？ 11)js延迟加载的方式有哪些？ 12)WEB应用从服务器主动推送Data到客户端有那些方式？
