2018年中高级前端面试题目小结

前言

关于前端面试，及面试题目，我之前有很多文章总结过，可以在右侧搜索面试，进行查找。其实面试中可以问的问题很多，最近几年，我也面试过很多工作2-4年的前端，我一般会抓住他们做的项目，进行更详细的追问。所以，初中级前端面试的时候，除了掌握基础知识之外，项目中用到的技术要理清楚，假如你项目中用到的技术，问的时候却一问三不知，那么，基本上就会pass掉了。针对比较资深或者高级的前端面试，可能和初中级面试会有些不一样，当然，针对资深的前端，可能聊得东西更深，更广一些！这篇文章简单聊聊针对中高级前端我们要聊的话题。

一、前端工程化

关于前端工程化，是一个很大的命题，你在知乎上搜索前端工程化，会有一些文章，这些文章可以帮助你理解前端工程化。

说一下我理解的前端工程化吧，前端工程化不单单包括前端的模块化、组件化、自动化，还包括前端性能优化，前端目录规划，前端规范化，自动化测试，发布等等一系列知识。这里我就不一 一介绍了，感兴趣的也可以去读读张云龙的文章：

https://github.com/fouber/blog/issues/3

https://github.com/fouber/blog/issues/10

二、 前端设计模式

其实这里可以作为一篇文章来书写了，不过，假如你不了解，可以网上搜了一下前端设计模式，关于设计模式也是有不少文章的。

三、 前端安全性问题

当然，这个是老的话题，有的在初中级前端面试中也会提及到。但是在中高级面试的时候，你要说出前端安全性问题防御，及前端常见安全性问题的攻击原理是什么。

1、xss跨站脚本攻击（原理、如何进行的、防御手段是什么，要说清楚）
2、CSRF跨站请求伪造（如何伪造法？怎么防御？等等都要说清楚）
3、sql脚本注入（注入方式，防御方式）
4、上传漏洞 （防御方式）

四、 跨域问题的处理

关于跨域，我前面很多文章也提及了， 浏览器跨域访问解决方案 ，这篇文章可以看一下。

另外，面试官可能会问及 cookie跨域及localStorage跨域问题 ，关于这一点，也可以看我之前刚刚写的文章： http://www.haorooms.com/post/kuayu_localstorage_cookie

五、前端数据加密

关于前端加密方式及前端加密，这个我在项目中实际用的也不多，微信小程序中可能会用到，我很久很久之前也写过类似的文章，请看：javascript用户密码加密,js密码加密

六、http相关问题

这个可能涉及的东西也蛮多，可以看我前段时间总结的系列文章：

http://www.haorooms.com/post/long_lianjie_websocket

七、 知识点问题介绍

上面问题可能是前端通用问题吧，下面的问题可能都是相关知识点的，下面简单总结一下：

1、 webpack相关

这个考察你对webpack的理解是使用程度。

例如可能考察如下知识点：

1、hash（contenthash, chunkhash）
2、多页面配置
3、发布上线流程
4、如何加快打包速度，减少打包体积
5、和其他工具的区别（grunt,glup,rollup,parcel,Browserify）

2、状态管理器相关

主要是flux、redux、vuex等

主要问题如下：

一、flux、redux、vuex数据流向，(例如：点击按钮触发到状态更改，数据是如何流向的？)

例如flux：

1、用户访问 View
2、View 发出用户的 Action
3、Dispatcher 收到 Action，要求 Store 进行相应的更新
4、Store 更新后，发出一个"change"事件
5、View 收到"change"事件后，更新页面

二、vuex和redux区别

三、vuex数据流？为什么要遵循这个数据流？假如在页面中直接修改state,而不是通过mutation 的commit方式修改，会怎么样？

3、 vue相关

vue相关的问题有很多。仅举例：

1、vue-router如何做历史返回提示？

2、vue-router如何做用户登录权限等？

3、vue生命周期

4、vue组件通信

5、vue服务器渲染

6、vue性能优化

4、 nodejs相关

1、nodejs常用模块

2、nodejs爬虫

3、nodejs 流

4、nodejs请求如何返回大文件

5、 es6相关

1、generate和async await

...

6、算法

1、冒泡排序

2、数据去重方法

3、取1000个数字里面的质数

7、模块化

1、amd,cmd及commonjs区别

2、import、require区别

8、其他

1、自动化测试相关

2、mock数据相关

3、pwa相关

4、nginx相关

5、微信小程序相关

6、敏捷开发等

 

来自：http://www.haorooms.com/post/2018_mianshiqianduan