前言因为大三下学期眼睛患上了过敏性结膜炎，不得不在家休养，错过了宝贵的实习时间。紧张的秋招从学长到达学校开始。我拿到的第一份offer来自厦门的一家公司。当时我和技术人员进行了愉快的交谈。后来因为厦门比较远，对公司的业务不是很感兴趣，就没有去。之后又面试了很多家公司，一直持续到次年4月份。因为技术太牛了，我投资的大公司都进了人才库（笑，最后进了一个不错的小公司。公司前后端分离，用的是react技术Stack。这里有一个大四以来的前端面试记录，准备面试准备简历，参考了很多优秀的简历（主要是知乎，搜索引擎搜索），写了自己的简历。刷脸经验。主要是牛客网，牛客网秋招和春招都有面对面的经验分享活动，很多拿到大公司offer的大牛都会在上面分享面试经验。资料，xx大学xx专业大四学生，然后说说自己擅长的，用xx技术写了某个项目，在xx公司实习，实习期间写了xx，最后说说他的兴趣和职业规划。面试官一般会根据我的自我介绍来提问。自我介绍的时候说自己用vue写过某个项目，然后被问了很多vue相关的问题...2.先说下vue的双向数据绑定的基本原理是发布订阅模式和Object.defineProperty()劫持每个属性的setter和getter，当数据发生变化时向订阅者发布消息，并触发相应的监听回调。因为看了这篇博客，所以根据博客写了一个简单版的vue。所以简单说说具体的实现过程3.说说你对vue生命周期的理解。vue生命周期就是一个vue实例从创建到销毁的过程。说说vue官方文档中的生命周期图。4.如何写一个vue组件主要由三部分组成，模板，样式，脚本。讲了每个部分需要考虑什么，子组件和父组件之间的通信，以及根据具体的功能使用相应的指令。顺便举个例子，style标签可以使用一些css预处理器的语法，通过lang属性定义等等。注册的组件可以是全局注册，也可以是本地注册。写单文件组件，需要安装vue-loader，并在webpack中配置；如果用jsx，模板写在render函数里，直接导入css文件，jsx文件用babel-loader处理，需要安装几个babel插件支持，忘记是什么了插件叫...5、你用过scss吗？如何在vue组件中的style标签中使用lang="scss"，安装node-sass和sass-loader，并在webpack中进行相应的配置。node-sass的安装比较麻烦。因为被墙了，无法通过npminstall直接用国内网络安装。一般是给命令行设置代理，或者直接用淘宝的cnpm安装。之后，在vue单文件组件的style标签中，将lang设置为scss，并在配置中加入处理scss文件的loader。6.如何在scss中写一个函数@mixin或@function，写法和js的普通函数一样，@mixin加上函数名，如果有参数就写参数，参数可以定义默认值，也可以使用rest参数，后面跟大括号，里面是函数语句，和普通css写法一样，但是可以使用scss内部控制命令，内置函数，变量等，以及使用@include调用。@function定义的函数和普通js函数一样，可以使用@return返回值，和普通js函数调用方式一样。调用之后，返回值就是@return里面@function返回的值。7、你见过webapck打包的文件吗？没有...8.你是如何理解模块化的？随着前端的不断发展，需要在前端处理的逻辑越来越多，js文件也越来越大。这时候为了更好的维护和复用js代码，就需要对js文件进行整理，按照具体的功能划分js文件。这就是模块化。模块化需要遵循统一的规范。服务器端node.js使用CommonJS，客户端有基于require.js的AMD规范，以及基于sea.js的CMD规范。也可以使用gulp、webpack等打包工具来实现模块。es6有原生的模块化支持，但是目前的浏览器还不支持。9、用过require.js，知道原理吗？没仔细看懂。。。记得是动态创建script标签请求脚本，通过监听脚本的onload事件来决定加载顺序。。。10.说说js的原型.每个js对象里面都有[[prototype]]属性，这个属性对应对象的原型。在一些浏览器中，原型对象可以通过__proto__来访问，而在es6中，可以通过Object.getPrototypeOf()来访问。原型链的末尾为null，也就是之前的Object.prototype11。简介闭包？js中的闭包是指一个函数可以访问另一个函数的作用域变量，一般是定义在外层函数中的内层函数。原理和js的变量解析机制有关。js解析变量会沿着作用域链向上查找。每次调用一个函数，都会创建对应的执行上下文和动作链，并将动作链赋值给内部属性[[scope]]，这样内层函数就可以得到外层函数作用域的变量，即使外层函数的执行上下文已经被破坏，比如调用外层函数返回内层函数，或者通过内层函数可以获取到外层函数作用域内的变量。12.如何实现js继承？的优点和缺点？介绍的很详细，关于elevation，constructor，class，combination，parasiticcombination，es6可以直接extend13.arguments和arrays有什么区别？如何将参数转换为数组？argument是对象，是Object的实例，不能调用数组方法。数组可以转为[].slice.call(arguments)，es6直接Array.from(arguments)或者通过数组扩展操作符[...arguments]14、call、apply、bind有什么区别？两者都在Function.prototype上定义。第一个参数是被调用函数内部this指向的对象，第二个及后面的参数是要传入的函数参数。call和bind是作为值传入的，apply是作为数组传入的。传入，call和apply返回调用函数的返回值，bind返回一个绑定函数。通过caller()调用时，绑定函数内部的this值指向调用bind的第一个参数，前几个参数绑定到调用bind时传入的第二个及后面的参数；通过new调用时，会忽略bind绑定的this值，将原函数当做构造函数，参数有效。15.实现绑定方法。MDN文档上有一个用于绑定的polyfill。注意新绑定函数的大小写。16.newanobject的过程创建一个空对象，this指向空对象，继承构造函数原型，执行构造函数代码返回this17。es6有哪些新特性let,const,原生模块化支持,结构体赋值,异步解决promise,generator,asyncfunction等,一些语法糖,箭头函数,类,对象方法属性速记等18.let和constlet用于定义变量，const定义常量，块级作用域，临时死区，同一个作用域不能重复定义，全局定义不会挂在窗口上。另外，let用作循环变量。每次循环都是一个新的变量，const在声明的时候必须赋值，后面如果对const定义的变量重新赋值会报错。19.如何理解promise？让异步操作的逻辑更加清晰，解决异步操作嵌套回调的问题。promise对象具有三种状态，pending、fulfilled和rejected。Promise对象内部存储了一个需要执行一段时间的异步操作。异步操作执行后，可以调用resolve或reject方法来改变promise对象的状态。状态一旦改变，就不能再改变。在一个新的promise之后，你可以使用then方法来指定resolved和rejected时的回调函数。20.箭头函数和普通函数的区别不能作为生成器函数使用。内部this是环境定义时的this。不能通过new调用，里面没有arguments对象。21.说说ajax和服务器的一种通信方式，主要用于异步通信，可以在不刷新页面的情况下获取服务器的数据，或者向服务器发送数据，通过xhr对象。22.如何跨域？Ajax跨域、jsonp、CORS、不同域页面之间的通信、document.domain和HTML5postMessage23。jsonp原理？原理是script元素的src属性不受同源策略限制。与服务器商定函数名称。请求文件时，服务器返回一段JavaScript。这个JavaScript是调用函数的语句，调用约定的函数，将数据作为参数传入。函数定义在前端，处理完数据后，去掉script元素。24.了解哪些排序算法没学过算法，也没看过相关知识。。。大一的时候学过冒泡排序和选择排序，也知道还有堆排序，快速排序和归并排序25.数组去重手写es5实现函数unique(arr){varnewArr=[];for(variinarr){if(newArr.indexOf(arr[i])==-1){newArr.push(arr[i])}}returnnewArr;}es6functionunique(arr){return[...newSet(arr)]}26.手写的二分查找当时没写...以前没看过，后来上网查了一下，那个原理很简单。对于有序数组，先比较中间元素，如果等于中间元素，则返回中间元素的索引，如果大于或小于中间元素，则从右区间或左区间开始查找，将中间元素与开头进行比较，依此类推。27、rem和em的区别。rem是根据根元素的font-size计算的，em稍微复杂一点，元素font-size属性是相对于父元素的font-size计算的，其他属性是相对于font-计算的元素的大小。28.谈谈职位吧。position属性有五个值，默认值为static。相对定位relative就是定位元素的正常位置。偏移后，原位置仍然占据空间，不会影响其他元素的位置，不脱离文档流。绝对定位打破了文档流和相对于已定位祖先元素的定位。固定定位类似于绝对定位，但相对于视口。还有一个新的值sticky，它是固定定位和相对定位的混合体。您必须指定上、右、下、左之一和四个阈值之一。滚动到阈值时是相对定位，然后是固定定位。兼容性不好29.如何实现单行文字垂直居中直接设置height等于line-height，绝对定位top:50%；然后上移自己宽度的一半，如果宽度不固定，使用transfrom:translateX(-50%),flexlayout,tabe-cell,还有一个hack方法，子元素display:inline-block;垂直对齐：中间；父元素的after伪元素，height:100%,display:inline-block;垂直对齐：中间；字体大小：0；30。清除浮动的方法主要有两种。一是触发BFC，因为BFC的内部元素和外部元素不会相互影响；另一种是使用clear属性，常用。clearfix::after{内容：“”；显示：表格；clear:both;}31.说说BFC？块级格式化上下文的全称是一个独立的布局环境，它规定了内部块级框是如何布局的。BFC中元素的布局不受外界影响。在BFC中，块盒和行盒沿其父元素的边界垂直排列。主要用于清除浮动，避免保证金崩溃。浮动元素、非默认位置或相对定位元素、用于显示的table-cell或table-caption元素以及非默认溢出元素将触发BFC。32、你平时用什么IDEVScode，webStorm和sublime也用过，不介意试试新的编辑器。在非技术方面，有一家公司是群面。它给了我们一个问题来讨论。一共十个人，十个职业。八、让哪八个人住？这家公司的一面是HR面，只要讨论比较活跃就行，没有标准答案，有道理前端是怎么学的？书籍、视频、博客，自行练习。如果你想学习某一方面的知识，你会看知乎推荐的书，也会看豆瓣的评论。刚开始学js的时候看了海拔高度，语言精髓，你不知道的js第一卷等等。视频主要来自MOOC，我也跟着MOOC上的视频玩了很多demo.收集了一些人的博客，比如阮一峰老师，张新旭老师。相关知识点不懂的可以直接去他们的博客上查。有很多资源可供自我练习。MOOC网站上的一些小项目，百度前端技术学院的题目，github上的项目，都可以自己完善和扩展。那个时候期望的薪水比较低……所以期望的薪水还是比较高的。如果再高，hr会说，我们公司能给的最高薪水是多少，问你能不能接受。你的爱好是什么，比如读书、看动漫、看电影、跑步？你最近在看什么动漫？看书时，我不喜欢看特定作者或特定类型的书。我总是看书，如果我对某些方面感兴趣，我就去看那些方面的书。比如看完《1984》，因为《1984》有一些哲理的内容，所以又去看了《苏菲的世界》《西方哲学简史》。对日本感兴趣的，就看《菊与刀》（当时正值二战时期，作者态度明显）；如果我对美国感兴趣，我会看琳达的《历史的忧虑》。还有一些热点可循。我看过刘慈欣先生的《三体》和中国短篇小说集。二熊的两本书《最好的我们》和《你好，旧时光》都看过了。总之，读起来很乱。刚看完EVA动漫。。。一直在追单人漫画，国内的二叔有没有一个人做计划的习惯？有。它在哪里？在通电话。方便我看一下吗？hr看完后说，这不是plan，也没有deadline。。。你是怎么应对压力的？晚上，我会出去跑步。有时压力太大而无法上大学。我会睡觉或看动漫。如果没有，我会锻炼。运动对我很有效。未来的职业规划？目前只是想提高前端技术，还没有想过从长远来看我的家离北京有多近。为什么来杭州？北京压力太大，在北方呆久了，想去南方看看。你想去阿里这样的大公司吗？没有想过（真的没有想过。。。因为技术太草率，想进也进不去）被hr批评了。。。如果你想做技术，还是要有去大公司工作的想法。你对加班怎么看？为了赶项目进度，可以接受（进公司后问同事，同事说我们公司加班不多。。。）你想问我什么？前端部门的技术栈，主要业务有哪些，实习期多长？
