JS一次前端面试经历记录(2)

你运行一下代码会发现,无论你点击哪个列表,控制台都是输出10。这是因为var声明的变量是函数作用域的,而不是块级作用域的。也就是说,for循环10次,每次都是改变同一个i,所以它的值会从0一直加到10。还有个问题是闭包导致的,闭包保存的是外部变量的引用,而不是值。也就是说,循环10次监听器创建了10 个闭包,它们里面的i引用的是同一个啊。所以全部都指向了10.
要解决这个问题有两种方法。一种是使用ES6的let来替代 var i = 0 里面的var, 因为let支持块级作用域。改成如下就正常了。

for(let i = 0, len = lis.length; i < len; i++) { lis[i].addEventListener('click', function () { console.log(i); }, false); }

还有一种方法,就是很多经典书本都提到的,使用立即执行函数来切断闭包对外部变量i的引用:

for(var i = 0, len = lis.length; i < len; i++) { (function (i) { lis[i].addEventListener('click', function () { console.log(i); }, false); })(i) }

当然啦,如果对闭包不是很熟练,还可以通过事件委托来避开这个陷阱哈,代码如下:

var ul = document.querySelector('ul'); var lis = document.querySelectorAll('ul li'); ul.addEventListener('click', function (e) { var target = e.target; if(target.nodeName.toLowerCase() === 'li') { console.log([].indexOf.call(lis, target)); } }, false);

使用了事件委托,减少了监听器的绑定(只对列表的父亲元素监听),这种方法说不定还会加分呢。哈哈,我当时就是用这种方法来实现的,面试官可能觉得我的解法有点不寻常、顿时一脸蒙B,甚至还一度怀疑 console.log([].indexOf.call(lis, target)) 这段代码是不是有问题。直到后来我直接在他的笔记本跑了一遍,他才相信是正确的。

第4题,因为面试官说要通过伪元素来实现,我的CSS本身就不咋滴,只知道好像用到了CSS3的border-radius,但是要使用伪未元素我还真心不会哇。所以当时就直接说不会做,现在也不会。请CSS大神在评论区发一下代码哈~

第5题,主要谈框架相关的。因为目前的情况是,React才是主流,很多团队都在用React,CVTE也不例外。他似乎很关心我为什么要使用vue。我当时给出的理由是:NG1脏值检测性能太低并且相对过时,NG2目前又不够成熟,React的JSX语法个人不太喜欢,而vue比较轻量级、并且支持jade模板( 我们旧项目是使用jade模板写的,迁移会相对容易)。然而,接下来便遭到了面试官的连续挑衅,说我用vue不会是因为它的中文文档比较齐全吧(鄙视我英文差???)。还说vue是不适合做大型项目。最后一句更狠:你们使用vue真是最愚蠢的选择。(我当时心里真的有一万只草泥马在奔腾)
其实,我个人觉得,框架并没有好坏之分的,每个框架必然有它存在的理由。React也好,NG也行,Vue也罢,萝卜、荷兰豆各有所爱嘛。反正,面试官说的那些话我真的听得挺反感的。
话又说回来。问完了第5个问题之后 ,面试官说面试就此结束,让我回到座位休息。
CVTE对于考生的招待真的挺周到的,桌面上有水果、零食、饮料等等。因为当时手机快没有电了,所以,就坐在那里边吃水果边看其他人面试。

二面

然后,等待了一个多小时,轮到了二面。面试官大概三十多岁,可能是前端组长或者技术总监之类的职位吧。
他主要是问到了下面的这些问题:

说说JS的内存机制及垃圾回收机制

下面的代码有内存泄漏吗

var user = {name: 'tom', age: 20, gender: 'male'} var test = document.getElementByid('test') test.onclick = function() { test.innerHTML = user.name; } // ...后面还有很多其他操作,最后把user对象释放掉 user = null; // 释放对象

实现一个算法,寻找字符串中出现次数最少的、并且首次出现位置最前的字符
如"cbaacfdeaebb",符合要求的是"f",因为他只出现了一次(次数最少)。并且比其他只出现一次的字符(如"d")首次出现的位置最靠前。

http和tpc的关系,以及什么是https

Node的特点(优点和缺点)

你在腾讯和网易实习期间学到的东西?

未来三年的职业规划

至于二面的问题都不是很难,下面简单的来看一下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/b6e28d987284d92bf7ae601eb6666e02.html