关于第一天的前端求职经历（ 2 年悲愤 xx 后续）。已被当天告知未通过

两日前，发了一篇吐槽，莫名的火了一把。经过大家的建议与鼓励，于是修改了简历，开始了重新投递， 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 和对象相比，只是比对象多提供了一个迭代用的接口，并且据说速度会比对象访问属性更快一点，现在来说，实在是没有什么使用场景，常用的一些工具函数，比如下划线.js和lodash.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/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/0014344997013405abfb7f0e1904a04ba6898a384b1e925000

• Q ：既然你原型不懂，那就谈谈原型链吧？

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

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

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

• Q ：有其他的解决方案吗？

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

顺手再推一波阮一峰大神的 flex 教程： http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool

• 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/blog/2015/04/tail-call.html ，关于 js 函数式编程指南连接： https://llh911001.gitbooks.io/mostly-adequate-guide-chinese/content/ （非常赞的一本免费电子书，不知为何，关注的人很少）

• 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/wiki/0014316089557264a6b348958f449949df42a6d3a2e542c000

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

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

• Q ：其他对公司有什么想问的嘛？

• A ： barbarbarabr （问了些关于公司结构的问题）

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