2020新前端面试题（中高级）

忘是亡心i 2023-02-09 14:22 34阅读 0赞

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

**一、前端工程化**

关于前端工程化，是一个很大的命题，你在知乎上搜索前端工程化，会有一些文章，这些文章可以帮助你理解前端工程化。
    
    说一下我理解的前端工程化吧，前端工程化不单单包括前端的模块化、组件化、自动化，还包括前端性能优化，前端目录规划，前端规范化，自动化测试，发布等等一系列知识。这里我就不一 一介绍了，感兴趣的也可以去读读张云龙的文章：

## 更多面试题和答案，请微信查看 ##

![在这里插入图片描述][20200519150714481.png]

**二、 前端设计模式**

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

**三、 前端安全性问题**

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

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

**四、 跨域问题的处理**

关于跨域，我前面很多文章也提及了，浏览器跨域访问解决方案，这篇文章可以看一下。
    
    另外，面试官可能会问及 cookie跨域及localStorage跨域问题，关于这一点，也可以看我之前刚刚写的文章：http://www.haorooms.com/post/kuayu_localstorage_cookie

**五、前端数据加密**

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

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

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请求如何返回大文件

## 更多面试题和答案，请微信查看 ##

![在这里插入图片描述][20200519150714481.png]

[20200519150714481.png]: https://img-blog.csdnimg.cn/20200519150714481.png