前端面试

前端面试常见问题，走过路过不要错误！（一）

1.说一下react中component 和 purecomponent 的区别
答: react component和purecomponent除了shouldcomponentupdate方法的实现之外,几乎完全相同。
纯组件通过props和state的浅对比来实现shouldcomponentupdate，component默认情况下不会进行新旧props和state 的对比。
纯组件比组件的性能表现会更好，但是使用纯组件需要满足几个条件：
props和state必须是不可变对象，并且他们的结构不能是层级嵌套的，否则对于子层级的改变无法反映在浅拷贝之中，如果发生了这种情况，应该用force update来更新组件，并且纯组件的子组件也应该是纯组件。
使用纯组件的优点：不需要实现should component update，就可以进行简单的判断，可以提高性能；
缺点：可能会因为深层数据的不一致而产生错误的判断，使should component update结果返回false，界面不会更新。
2.哪些方法会导致react重新渲染，重新渲染时render会做些什么
答：1)在setstate方法被调用时，会触发render，但是当setstate传入的值为null的时候，并不会触发render；
2）当父组件重新渲染，子组件也会重新渲染
3）在forceupdate被调用的时候，组件会跳过shouldcomponentupdate，直接调用render方法
4）重新渲染，render会进行新旧节点的对比，会对新旧两棵树进行深度优先遍历，每一个节点都会进行标记，遍历到一个节点就会把他跟新的节点树进行对比，如果有差异就放到一个对象里面，然后遍历这个对象，来对应更新节点。
3.谈一下对无状态组件的理解
答：无状态组件是指在组件内部不维护state，只根据外部组件传入的props进行渲染，当props改变时，组件重新渲染。无状态组不依赖自身的状态state，它可以是类组件也可以是函数组件，它可以避免使用this。同时它会有更高的性能，在不需要使用生命周期钩子的情况下，应该首先使用无状态函数组件。无状态组件它一般的应用场景用来做单纯的展示。
4.说一下vue单页面应用和多页面应用的区别
1）刷新方式： 单页面：组件进行切换，页面进行局部刷新或更改 多页面：整页刷新
2）路由模式：单页面： 可以使用hash，也可以使用history 多页面：普通的链接跳转
3）搜索引擎优化： 单页面：不利用seo检索，需要利用服务器端渲染优化 多页面比较利于seo
4）资源文件： 单页面：组件公用的资源只需要加载一次 多页面：每个页面都需要加载公共的资源
5）数据传递： 单页面：可以比较容易的实现数据传递，比如路由传参，vuex传参等 多页面： 依赖url传参，或者使用cookie，本地存储等
6）在用户体验方面：单页面：页面片段切换时间较快，可以实现转场动画，用户体验较好 多页面：在切换页面时加载缓慢特别是在网速较慢的情况下，而且无法实现转场动画的效果
7）开发和维护成本：单页面：开发成本高，但后期维护相对容易 多页面与单页面相反。
5.Vuex和redux有什么区别，他们共同的思想
答：1）区别：vuex改进了redux中的action和reducer，用mutation函数来取代reducer，只需要在对应的mutation函数中改变state的值。Vuex弱化了redux中的dispatch，通过commit进行store状态的变更；取消了action的概念，不用传入特定的action来进行指定变更；弱化reducer，基于commit参数直接对数据进行转变。Redux每次返回的是一个新的state，而vuex直接改变state
2）共同思想： 单一的数据源 变化可以预测 他们都是将数据从视图中抽离的一种方案；vuex借鉴了redux，将store作为全局的数据中心，进行模式管理
6.什么是闭包？闭包的应用场景？
答：函数的返回结果是一个内部函数，并且被外部变量引用，如果内部函数引用了外部函数中定义的变量，就形成了闭包。闭包可以在内部函数访问到外部函数作用域，使用闭包可以将函数中的变量存储在内存之中，保护变量不会被污染，但是使用闭包有可能会导致内存泄漏，不能滥用。
闭包的应用场景：
1）进行模块封装，用闭包的方式可以防止变量污染全局
2）在循环中创建闭包，防止取到意外的值 如果我们要用循环给多个元素绑定事件，函数执行后引用的是同一个i，使用闭包就可以防止这样的问题出现。