蘑菇街前端一面

1.万年不变的自我介绍。

2.讲一下自己前端比较熟悉的地方?
答:我回答的是对react技术栈比较熟悉。因为使用react技术栈做过项目,对于react组件化开发的方式比较熟悉。

3.为什么要用redux?
答:redux解决的是react组件之间通信以及项目的状态变量的保存问题。如果不使用redux,随着项目的越来越大,组件之间通信越来越复杂,组件的状态越来越多,项目将越来越难以维护。使用redux之后,项目的状态都保存到store之中,各个组件可以直接从store之中获取到自己需要的状态,如果需要改变store中的状态,redux也提供了dispatch方法,组件可以dispatch一个action,根据action的type属性,reducer会对状态做出变化。
这样将全局状态保存到一处的做法,使得项目更加容易维护,组件之间的通信也更加容易实现和清晰。

4.如果不使用redux,而是将状态都保存到顶层组件,但是给每个组件都实现两个接口,getState()和setState(),这不是更加方便吗?
答:这个问题之前却是没想过,一时也没回答上来。(懂的大佬可以说一声!)

5.说一下react的diff算法
答:自己看官网吧(基于两个假设条件将时间复杂度从O(n3)降到O(n),在内存中维护一个虚拟DOM树)。

6.说说自己项目中遇到的难点
答:最好说自己完全了解的难点吧!

7.Canvas上画个圆,可以用诸如getElementById()之类的方法获取吗?
答:不可以,canvas是通过js绘制的图形,图形是一个一个像素画上去的,不可以获取到。但是svg是基于XML格式,内部是一个个节点,可以用DOM操作获取节点。

8.canvas上的图像获取到吗?
答:可以,canvas原生的toDataURL()方法获取图像的Base64编码

9.了解ES6吗?ES6中的箭头函数可以用作构造函数吗?
答:项目中用到了很多ES6语法,对ES6有一点了解。箭头函数不可以作为构造函数,因为箭头函数内部并没有this,它的this其实是函数外层的this,因次不可以用new操作符调用,所以不可以作为构造函数使用。

10.那些操作会有跨域的限制?为什么要有跨域的限制?没有跨域的限制会怎么样?
答:我只想到ajax请求会有跨域的限制(应该还有别的)。为了安全性考虑,如果通过ajax请求受到了一段恶意代码,所以会有很大的隐患。接着面试官问:就算接收到了恶意代码,你不添加到html中,恶意代码也不会执行呀!然后我就懵逼了。。。

11.使用react-router的项目即使切换了页面,URL发生了改变,但是页面也不会刷新,这是如何实现的?
答:react-router只会用基础的部分,一直只知道用它来管理路由,但是确实不知道实现原理,直接和面试官说确实没有深入了解过,然后就算了。
其实页面没刷新,但页面内容却改变了,这不就是ajax吗?

12.position的几种取值?
答:1.static:默认取值,没有定位,元素出现在正常的流中。2.relative:相对元素在普通流的位置定位,但元素还是会占据普通流的位置。3:absolute:绝对定位,元素相对于第一个已定位的(position为relative || absolute || fixed)父元素进行定位。4.fixed:固定定位,元素相对于浏览器窗口进行定位。

13.说说快速排序。

14.你还有什么问题要问的吗?

#蘑菇街##前端工程师#
全部评论
当然如果不用redux,将数据放在顶层,使用context来全局传数据也是可以的,这本身就是redux里面connect的原理。我觉得redux最好的应该是纯函数跟单一数据流的概念,利用函数式编程的思想,使得数据没有副作用,这也是保证了数据的安全,其次配合redux 有很多middleware,这些middleware可以帮我们在dispatch到reducer完成的中间过程做很多事情,提供开发效率。比如compose一些异步的action,或者immutable等。react官方推荐的就是pure render component,所以如果每个组件都在内部getState或者setState,会显得特别乱,不易于管理。
点赞 回复 分享
发布于 2017-08-17 16:35
私以为redux存的是M-V-VM里的M,而组件state应该只存组件内部的状态。我觉得override组件实例的setState()会混淆VM与M的数据吧;况且如果把诸如record: {field1: xxx, field2: xxx}和showPopover: true;这样的数据对象和状态变量存在一起也非常不利于维护和扩展。 另外,我觉得组件自己的state应该最好只对自己可见,保持封装性;需要组件交互的一律使用redux或直接传递绑定this的函数(虽然某些eslint规则会在你传递绑定this的函数时告诉你不要这么用)。 引用一句前辈的话:合理结合redux和setState()才是王道。大一统思想眉毛胡子一把抓不可取。
点赞 回复 分享
发布于 2017-08-17 16:17
11.使用react-router的项目即使切换了页面,URL发生了改变,但是页面也不会刷新,这是如何实现的? 这个有两种实现方式,1.hash模式,window.hash可以设置url,并增加一条历史记录,然后监听hashchange,发现hash变化后,可以做发送ajax请求之类的业务操作,就实现了单页路由效果。 2.HTML5的history模式,可以动态添加历史记录,原理类似!
点赞 回复 分享
发布于 2017-08-19 11:15
第11个问题,前端路由可以用history或者hash实现
点赞 回复 分享
发布于 2017-08-22 22:11
顶,不知道今年蘑菇街是不是闹眼子
点赞 回复 分享
发布于 2017-08-17 15:48
说一下react的diff算法,你都说出来了?最复杂的那种新旧节点都有子节点,而且它们不一样
点赞 回复 分享
发布于 2017-08-17 20:26
react canvas 完全不知道 我觉得要是问我熟悉哪里 就往js设计模式 和 es6上扯
点赞 回复 分享
发布于 2017-08-19 11:17
第10个跨域问题,为什么会有同源策略,目的是为了浏览器安全。主要是为了保护Cookie,localStorage,SessionStorage,http缓存等不被不同源的网站所共享的
点赞 回复 分享
发布于 2017-09-07 17:07

相关推荐

02-26 16:52
门头沟学院 Java
Lunarloop:董事长亲自到ssob来要IM项目的技术方案来了
点赞 评论 收藏
分享
评论
2
59
分享

创作者周榜

更多
牛客网
牛客企业服务