大公司移动前端开发面试题——做转盘[参考代码已放出]
2014-06-15 18:42
218 查看
![](https://oscdn.geek-share.com/Uploads/Images/Content/201406/15/77903a1c76793a72fa254038e6fafeb2.jpg)
"如果有个做转盘的需求,你准备怎么做?设计师只会提供一个转盘的图片,其余都需要你完成,不能用框架和类库。"
"这个转盘没有惯性的需求,只要求在手机上,用手指拖转盘,能让转盘跟随手指转起来即可。"(后注:可以理解为手指拖动一个DIV,能让这个DIV绕中点旋转)
这是我在面试前端开发人员时,经常会问到的一道题。转盘是类似上图的样子。
博主之前在M公司和C公司的时候,经常用这题面试移动前端开发工程师。M公司的产品和设计是美国团队,在个别项目上UI设计比较大胆脱俗,对前端开发人员有较高的要求。C公司的只会JS的前端开发人员占比较大,产品经理有时提出的让人眼亮的需求,但从前端开发口中得到的答复往往是:“这个我们实现不了。”,产品经理只能作罢。
于是我设计了这道题,希望能找到一些知识较全面,会综合应用的前端开发人员。在平时面试过程中,因为时间的关系,也不要求应聘人员将它用代码写出来,只和我聊下思路即可。在聊的过程中,我会就相关的一些技术细节深入问一下。
通过这道题,可以探知应聘人员在移动端的开发经验,以及前端知识综合应用能力。
这道题的需求很简单,但需要开发人员掌握较全面的前端知识。我们来看下这道题 涉及(或者延伸)到哪些知识点:
CSS:
背景图URL,位置和大小的写法(素材图片的尺寸可能不合适);
容器圆角属性;
旋转的实现;
硬件加速是什么,什么条件下会开启硬件加速;
retina屏幕上为什么显示会模糊,如何避免?
JS:
触摸事件;
阻止浏览器默认行为;
触摸事件和鼠标事件的不同处有哪些;
触摸坐标获取;
如果要两指一起拖动,圆盘才能旋转,代码需要做什么改变?
为什么在移动设备最好用touch事件,而不用mouse事件?
原生JS如何取DOM的内嵌CSS属性,如何获取外部样式表文件定义的属性?
Html:
viewport 的参数和作用
数学:
角度和弧度的换算
向量计算
三角函数
面试题大多如此,需求看起来简单,但涉及到的知识却不简单。大家如果有兴趣的话,可以拿这道题练下手(大家可以先只用考虑webkit内核)。我觉得,对于常规前端开发人员,会有较大提升吧。
参考代码已放出,网址是:/article/5426107.html
本文是博主Arfei Zhang原创,欢迎转载。转载请注明转自博客园,并附上本文链接/article/5426106.html ,谢谢!
相关文章推荐
- 大公司移动前端开发面试题——做转盘[参考代码]
- 大公司移动前端开发面试题——做转盘[参考代码]
- 移动平台前端开发之WebApp代码技巧
- 大公司里怎样开发和部署前端代码?
- 大公司怎么开发和部署前端代码——作者:张云龙[知乎兴趣转载]
- {转}大公司里怎样开发和部署前端代码?
- 大公司里怎样开发和部署前端代码?
- 【web前端开发】浏览器原生API,DOM,Javascript,HTML5,CSS 代码运行实例参考
- 大公司里怎样开发和部署前端代码?
- 大公司里怎样开发和部署前端代码?
- 大公司里怎样开发和部署前端代码?
- 大公司里怎样开发和部署前端代码?
- 大公司里怎样开发和部署前端代码?
- 移动webAPP前端开发代码演示和技巧汇总
- 大公司里怎样开发和部署前端代码?
- Extjs4前端开发代码规范参考
- 大公司里怎样开发和部署前端代码?
- 【学习笔记】前端工程化-大公司里怎样开发和部署前端代码
- 大公司里怎样开发和部署前端代码?
- 移动前端开发中添加一些webkit专属的HTML5头部标签,帮助浏览器更好解析html代码,更好地将移动web前端页面表现出来。本文整理一些常用的meta标签