2

两日前,发了一篇吐槽,莫名的火了一把。经过大家的建议与鼓励,于是修改了简历,开始了重新投递,2天后接到第一份面试邀请。

此文为个人面试经历,QA问答过程与总结,不透露面试公司及面试人员,内容真实,如果有面试过我的大佬看到博客,欢迎指出问题。

循序可能有点乱,没记太清。

1.面试时间 2017.2.30下午两点——公司薪资6K

  • Q:请先做一下自我介绍

  • A:barbarbar,然而顺便谈了下自己的学习经历,讲了下自己在写的项目啥的。

  • Q:谈谈你对闭包的理解。

  • A:关于闭包,我个人的理解用一句话概括就是:一个函数在父级函数执行完毕后,如果任然留有对父级函数内部变量(作用域)的引用,那么就会建立闭包,我个人对闭包就是这样的看法,如果有什么错误,请务必帮我订正....

原文出自js面对对象编程指南P88:如果一个函数会在其父级函数返回之后,留住对父级作用域的连接的话,相关闭包就会被创立起来

  • Q:谈谈你对ES6新的声明变量的方式的一些看法

  • A:关于这个问题,新的方式,比较有趣的就是所谓的暂时性死区什么的,简单的来讲吧。关于的第一个const,其实就是声明一个常量,不允许变更。另一个let,就是零时变量,或者说是局部变量(这两个都属于局部变量),能够由中括号直接产生一个零时的局部作用域了,而不必使用以前的立即执行匿名函数了,let非常适合在for循环之类的场景中使用,不再需要使用迭代函数就能获得当前的变量了,对比var来看,新的这两个变量声明都不会在执行时被提升,并且编译速度比var更快。

  • Q:你说const声明的是常量,不能被改变喽?

  • A:const声明的的确是常量,只不过是字面量常量不能被改变,如果是对象类型的话,是引用,对象的属性被改变是无法被检测到的,就像vue中,父子组件中通信,以及数据,如果是对象属性被改变,是无法被检测到的。

  • Q:你说Vue中如果对象属性被修改无法被检测到,那么你有什么解决方案?

  • A:这个,其实我觉得最好的解决方案就是严格遵守vue的理念,父子组件通信时不去修改什么对象属性,对象数据的属性,非要改动添加的话:使用(Object.assign() 或 _.extend())面试时,没想起来单词怎么拼.....

关于对象属性的的修改的方法,有兴趣的可以了解下,Object.defineProperty(vue好像就是基于它实现的双向数据绑定,还没读源码,不清楚楚),Object.assign是把属性添加到对象的方法。

  • Q:关于数组去重复你用什么方法?

  • A:因为目前我自己都是使用ES6 + Webapck2的方式写的代码,所以用的是Array.from(new Set(arr)或者[...new Set(arr)]的方式去重,原理是,用了set类型,允许重复的值得特性,然后使用from方法或者解构的方法来得到数组,关于其他的方法的话,有太多了,比如什么循环去重,什么迭代(reduce)啥的,我就懒得讲了,因为真的太多了。

  • Q:你提到了Set类型,那你讲下对Es6里 Map 类型的看法。

  • A:关于这个Map啊...(犹豫了一下)说实话,我没怎么去使用这个新的类型,毕竟怎么说好呢,目前我是将Map当成一个嵌套数组看待,毕竟Map和对象相比,只是比对象多提供了一个迭代用的接口,并且据说速度会比对象访问属性更快一点,现在来说,实在是没有什么使用场景,常用的一些工具函数,比如下划线.jslodash.js(不知道单词是否拼错),暂时都还没有提供对map的方法,但对象却有千千万的各类方法,并且,map能够实现的对象类型也能够实现,比如迭代对象可以用for (let [k, v] of Object.entries(obj)) ,哦,最后一点差异就是允许key使用数字。不知道你有啥其他的看法嘛,或者知道map的一些使用场景,可以和我分享一下。

楼主只用过下划线.js...对于loadsh.js没提供是猜测的。另外对象迭代这里出自,阮一峰大神写的ES6入门指南,对象篇。完整的是:

let obj = { one: 1, two: 2 };
for (let [k, v] of Object.entries(obj)) {
  console.log(
    `${JSON.stringify(k)}: ${JSON.stringify(v)}`
  );
}
// "one": 1
// "two": 2
  • Q:关于new一个对象,你讲一下,具体是怎么实现的?

  • A: 什么?new一个对象,额,这个不就是一个构造函数,然后new一个新的对象嘛,还能有什么流程嘛。不太清楚,你具体问的内容哈,你是问,构造函数内容的执行逻辑原理还是啥?

  • Q:那你谈一下对于原型的理解

  • A:原型啊,从哪里开始讲呢,我之前好像写过篇关于原型的博文,要不看看博文?毕竟在我看来,这方面内容太广了,一定要讲的话,可以说,(比面试时稍微把逻辑更通一点,面试时太紧张逻辑有点乱)原型自身就是一个对象,有自己的属性与方法,默认情况下是有一个指针指向原型的构造函数,构造函数也有个指针指向自己的prototype...然后由构造函数new出来的对象,在原型链上默认指向构造函数指着的原型。。。好吧,我编不下去了,说真的,这玩意我得有个图或者纸才好演示啊。。要不你给我张纸,我画个图?

廖雪峰大神写的教程非常棒,推介一下:http://www.liaoxuefeng.com/wi...

  • Q:既然你原型不懂,那就谈谈原型链吧?

  • A: (心里活动:原型我得有纸才能演示,原型链,不得更需要纸吗),啊,原型链啊,我之前真的自己写过篇关于原型链的整理,能给你看下博客吗?...你让我凭空讲...好吧,大概原型链就是...说实话,我现在用的都是Es6的class方法,虽然class也是基于原型链的语法糖,但是简单方便啊,所以我这段时间都都没怎么关心原型链的,毕竟原型链继承在js面对对象编程指南里写了十几种方法啊...我这人,有时候喜欢简单高效的东西,就像数组去重,我都用set,只有遇到一些相关问题,我才回去找新的解决方案。(后面把十几种方法拍张照给大家观摩观摩,虽然有些不是基于原型的)

  • Q:你说你都是遇到问题再去解决,那你谈谈移动端一像素问题你是怎么解决的?

  • A:移动端一像素啊,简单来讲,就是设置个伪类,然后响应下屏幕的dpr,用css3的缩放进行解决。用一些预处理器写个mixin函数就能解决。

  • Q:有其他的解决方案吗?

  • A:这个老实说,还真没研究过,在前面我提过,很多东西我都是遇到问题然后去解决的,如果目前有最优解决方案,我为啥要去用其他的,比如目前移动布局我用的就是flex布局,我感觉兼容性也不差。。。当然,主要原因也在于我没啥工作经验。

顺手再推一波阮一峰大神的flex教程:http://www.ruanyifeng.com/blo...

  • Q:你有使用过css预处理器吗?

  • A:目前在使用stylus,less也有接触过,stylus我主要喜欢无需括号,以及变量或者函数不用加什么奇怪的前缀

  • Q:对于手机应用你有过了解吗?

  • A:如果指的是混合开发的webapp手机应用,我最近研究过weex,就是阿里去年开源的那个类似react native的,目前正准备写点什么个人项目,但是因为时间缘故所以暂时还是只计划。

  • Q:对于性能优化,你有什么方案?

  • A:性能优化啊,说实话,我目前因为主要都是自己的作品,没遇到过什么特别徐亚哟优化的地方,如果一定要讲的话。。。好吧,我简单讲一下吧,比如不要使用全局变量,因为相比局部变量,全局变量被索引时的速度最慢;不要过多使用闭包,闭包会占用内存;要对闭包中需要递归的地方进行尾递归优化不然容易导致内存泄漏(主要好像是ie下,没有实际测试过),对script标签进行合并,毕竟页面遇到script标签就会停止渲染(主要是因为浏览器不能确定script标签会不会改动dom),在使用ajax时,对一些内容尽量使用get(get默认会保留缓存),额...还有的话,说实话,我来面试前忘了去找份面试指南背,很多东西由于我没有实际的遇到过我并没有太过深入。如果是我遇到过得问题,我详细我应该能够了解。说起来之前拜读过一本叫做js函数式编程指南的..因为内容有点深,就只看了部分。

关于全局变量被索引的速度最慢,出自高性能js...没有实际测试过,闭包内递归要使用尾递归优化,附送上连接,同样是阮一峰大神的:http://www.ruanyifeng.com/blo... ,关于 js函数式编程指南连接:https://llh911001.gitbooks.io... (非常赞的一本免费电子书,不知为何,关注的人很少)

  • Q:你提到了ajax,那就谈下ajax吧。

  • A:ajax啊,这玩意其实很简单,主要就是异步的从后端获取数据嘛,搞来搞去也就那么些接口啥的,在初学js时,我为了能响应ajax还简单的学了php,就是后端提供接口,前端用get或者post或者其他方式去请求数据,不会让页面停止运行啥的,目前我在写的项目中接入了聊天机器人,由于跨域问题,就用node做了个中转层,用来转发对机器人api的请求,流程就是前端请求本地的服务器,服务器请求机器api...

  • Q:你对于跨域的解决方法了解多少?

  • A:前端跨域吗,最常用的应该是jsonp吧,后端动态生成script(能够执行的js函数),然后把数据发送过来。或者是用node做个中转层啥的,方法好像挺多,H5也有种新的方案,不过没深入研究。

  • Q:我们这边后端用的不是node,是java,你怎么使用jsonp。

  • A: 啊,java不能返回动态的script吗?我之前学过的php好像行,现在在学的python也行啊。

  • Q:python是什么?

  • A:python就是...它是一门编程语言,当初学node写爬虫时,发现node用模块模拟的多线程本质还是单线程,并且错误处理还麻烦,我还得用进程维护模块去启动...然后上网查,发现都说python好,于是就开始学了些python,把教程简单过了遍,后来因为些事情所以就没怎么碰了。。。。

安利下廖雪峰大神的python教程:http://www.liaoxuefeng.com/wi...

  • Q:那你现在目前在做什么

  • A:目前,有个个人博客在写完成度太低,所以没有开源,后端使用koa2(优雅的async函数才是我的追求,express的嵌套,见鬼去)正考虑前端要不要上个react,毕竟我目前一直在深入Vue2,对同样是Mvvm的react好像没做过啥具体项目。

  • Q:其他对公司有什么想问的嘛?

  • A:barbarbarabr(问了些关于公司结构的问题),说起来,我对于自己知识面的广度自信的,但是对于深入有所欠缺。


不知道为何,面试当天就被告知未通过,我在想,果然是因为没有背过前端面试题嘛。。。还是原型那里没回答出了问题,对于面试官,一直带着笑容,然而,一些反问的内容均未给出回复。。。全程笑眯眯。。年龄目测比我年长几岁的样子。。


jiangqizheng
404 声望15 粉丝

并没有什么可说的