前端开发面试题之综合篇

“每18至24个月，前端都会难一倍”

——赫门 “2015深JS大会《前端服务化之路》主题演讲”

题目&答案

• 你遇到过比较难的技术问题是什么？你是如何解决的？

• 是否知道关于设计模式中的Singleton，Factory，Strategy，Decrator？

• 常使用的库有哪些？常使用的前端开发工具有哪些？开发过什么应用或组件？

• 页面重构怎么操作？

网站重构：
在不改变外部行为的前提下，简化结构、添加可读性，而在网站前端保持一致的行为。
也就是说在不改变UI的情况下，对网站进行优化，在扩展的同时保持一致的UI。
//
传统网站的重构通常是：
表格（table）布局改为 div+css
使网站前端兼容于现代浏览器（针对于不合规范的css）
对于移动平台的优化
针对SEO进行优化
//
深层次的网站重构应该考虑的方面：
减少代码间的耦合
让代码保持弹性
严格按规范编写代码
设计可扩展的API
代替旧有的框架、语言（如 VB）
增强用户体验
//
通常来说对于速度的优化也包含在重构中
压缩js、css、image等前端资源（通常由服务器来解决）
程序的性能优化（如数据读写）
采用CDN来加速资源加载
对于js、DOM的优化
HTTP服务器的文件缓存

• 列举IE与其他浏览器不一样的特性

触发事件的元素被认为是目标（target）。而在IE中，目标包含在event对象的srcElement属性；
获取字符代码、如果按键代表一个字符（shift、ctrl、alt除外），IE的keyCode会返回字符代码（Unicode），DOM中按键的代码和字符是分离的，要获取字符代码，需要使用charCode属性；
阻止某个事件的默认行为，IE 中阻止某个事件的默认行为，必须将 returnValue 属性设置为 false，Mozilla 中，需要调用 preventDefault() 方法；
停止事件冒泡，IE 中阻止事件进一步冒泡，需要设置 cancelBubble 为 true，Mozzilla 中，需要调用 stopPropagation()；

• “99%的网站都需要被重构”是哪本书上写的？

《网站重构:应用Web标准进行设计(第2版)》

• 什么叫优雅降级和渐进增强？

优雅降级：
Web站点在所有新式浏览器中都能正常工作，如果用户使用的是老式浏览器，则代码会针对旧版本的IE进行降级处理了,使之在旧式浏览器上以某种形式降级体验却不至于完全不能用。
如：border-shadow
//
渐进增强：
从被所有浏览器支持的基本功能开始，逐步地添加那些只有新版本浏览器才支持的功能,向页面增加不影响基础浏览器的额外样式和功能的。当浏览器支持时，它们会自动地呈现出来并发挥作用。
如：默认使用flash上传，但如果浏览器支持 HTML5 的文件上传功能，则使用HTML5实现更好的体验；

• 是否了解公钥加密和私钥加密？

一般情况下私钥用于对数据进行签名，公钥用于对签名进行验证；
HTTP网站在浏览器端用公钥加密敏感数据，然后在服务器端再用私钥解密。

• Web应用从服务器主动推送Data到客户端有哪些方式？

HTML5提供的WebSocket
不可见的iframe
WebSocket通过Flash
XHR长时间连接
XHR Multipart Streaming