您好,欢迎来到12图资源库!分享精神,快乐你我!我们只是素材的搬运工!!
  • 首 页
  • 当前位置:首页 > 开发 > WEB开发 >
    2016十家公司前端面试小记
    时间:2017-03-10 00:13 来源:网络整理 作者:12图资源库 浏览:收藏 挑错 推荐 打印

    春节前离职了,年后来了有一周了,把简历丢到网上后大概收到了将近七十多个面试邀请,挑了几个稍微知名一些的公司如国美京东美团百度彩票等和一些中 小型公司去面试,这星期一共面了11家公司,除了阿里似乎没戏了其他的十家基本都发了口头或是正式offer,也不打算再面了,社保断了也是个麻烦事,打 算从这其中挑一个就可以了。

    2016十家公司前端面试小记

    面试过程中有做面试题的,也有直接聊的,实话讲有些面试题其实就是背书,随便一百度就能出答案的东西其实不太适合用于面试题中。例如某某css属性 的用法,js某函数的作用等等。个人倾向于将实际工作中可能会遇到的问题的场景,以及各种技术的坑作为面试题,这样一则可以看出他的经验多少,二则也可以 防止他做笔试题的时候手机搜索结果。

    不过总体来讲基本上每家问的问题也差不多,可能不同业务的公司问的问题的侧重点不太一样,有点侧重于移动端适配css布局浏览器兼容IE hack,而有的侧重于JS逻辑面向对象设计模式考察等,如果你有三到五年左右的开发经验这些问题基本也都遇见过,就算是做个总结吧。

    手写事件模型及事件代理/委托

    这个算是被问到的最多次数的问题了,首先要求描述下js里面的【事件的三个阶段】,如果没听说过三个阶段,那基本上就没戏了。分别是捕获,目标,冒 泡阶段,低版本IE不支持捕获阶段。然后可能问到IE和W3C不同绑定事件解绑事件的方法有什么区别,参数分别是什么,以及事件对象e有什么区别等等。

    如果上述都没问题,接下来可能会问【事件的代理/委托】的原理以及优缺点,这是靠事件的冒泡机制来实现的,优点是

    1、可以大量节省内存占用,减少事件注册,比如在table上代理所有td的click事件就非常棒

    2、可以实现当新增子对象时无需再次对其绑定事件,对于动态内容部分尤为合适

    事件代理的应用常用应该仅限于上述需求下,如果把所有事件都用代理就可能会出现事件误判,即本不应用触发事件的被绑上了事件,事实上我见过有人把页面里的所有事件都绑定到document用委托的,这是极其不明智的做法。

    所谓劲酒虽好,可不要贪杯哦~

    之后对方可能要求你手写原生js【实现事件代理】,并要求兼容浏览器,其实就是考核对事件对象e的了解程度,以及在IE下对应的属性名。其实此时如果你说就是用target,currentTarget,以及IE下的srcElement和this,基本就可以略过了。

    如果上述都ok的话,那么极有可能要求让你【实现事件模型】,即写一个类或是一个模块,有两个函数,一个bind一个trigger,分别实现绑定 事件和触发事件,核心需求就是可以对某一个事件名称绑定多个事件响应函数,然后触发这个事件名称时,依次按绑定顺序触发相应的响应函数。

    这个需求如果对于做过C#的人来讲就再熟悉不过,他根本就是C#中的【委托】(delegate)。而委托与事件几乎是一家子。回到前面说的题目, 大致实现思路就是创建一个类或是匿名函数,在bind和trigger函数外层作用域创建一个字典对象,用于存储注册的事件及响应函数列表,bind时, 如果字典没有则创建一个,key是事件名称,value是数组,里面放着当前注册的响应函数,如果字段中有,那么就直接push到数组即可。 trigger时调出来依次触发事件响应函数即可。

    不过还有很多细节,比如触发响应函数时的上下文应该是什么,触发响应函数的参数列表应该是什么,如果要求把调用trigger的参数列表都传到响应函数中还要考虑到吧arguments对象转化为纯数组才行等等。

    还有一些面试官会问到事件如何派发也就是事件广播(dispatchEvent)等等,这里不再展开。

    有关事件的考核点大概也就这么多了

    前端性能优化

    这个简直老生常谈,不管是园子里还是园子外,关于前端优化的东西太多太多了,不同角度不同方向也有很多,网络性能优化,加快访问速度,浏览器并行加 载数量,怎样实现原生JS异步载入,CDN加速的原理,如何将不同静态资源发布到多个域名服务器上,发布后这些静态字段的url路径改怎么批量改写,用什 么工具进行项目打包,css打包后的相对路径怎么转换为绝对路径,用什么工具进行项目模块依赖管理,怎么进行cookie优化等等,

    这个说起来就很多了,尽可能的按照自己做过的优化来讲,否则面试官随便挑一项深究都可能会卡壳,与其这样还不如不讲

    闭包原理及应用

    这个问题的经典性,几乎所有面试官都会问到这个问题,什么情况下会发生闭包,为什么需要闭包,什么场景下需要,闭包闭了谁,怎么释放被闭包的变量内存,闭包的优点是什么,缺点是什么等等。

    关于闭包,有的是上述提问,有的是直接做闭包面试题。关于概念网上一搜一大把,关于闭包面试题,可以参考我之前写过的一篇文章:

    不夸张的讲,如果这篇文章完全弄懂了,基本上没有可以难住的闭包的题目了。

    手写Function.bind函数

    首先会要求解释下这个函数的作用,以及在什么场景下需要用到它,最后手写一个Function.bind函数。

    只要掌握核心几点就没问题:

    1、Function.bind返回的也是一个函数,所以注定发生了闭包,

    2、在返回的这个函数中去调用一个其他的函数,这其实本质上就是函数钩子(HOOK)

    关于在JS里的函数钩子,我认为只需要维护以下三点即可:

    1、保持函数的this指向

    2、保持函数的所有参数都传递到目标函数

    3、保持函数的返回值

    有了以上这几点,这个函数就非常好写了,下面是MSDN上的标准Polyfill:

    if (!Function.prototype.bind) { 

      Function.prototype.bind = function (oThis) { 

        if (typeof this !== "function") { 

          // closest thing possible to the ECMAScript 5 

          // internal IsCallable function 

    (责任编辑:admin)