前端面试全家桶：从求职准备到面试演练
\/---;
前端面试全家桶-从求职准备
(1)简历撰写简历是求职的敲门砖，直接决定了你能不能通过网申。招招有一个技巧，在写简历的时候，在招聘网上，看一下现在前端招聘的要求，然后总结起来，这就是你后面需要掌握的技能要求和通过简历需要传达出来的重点。招招经过研究boss直聘和51job上的前端的招聘要求，总结出来一下几点：在撰写简历的时候，一定要围绕着招聘的要求，有针对性去描述所掌握的技术与框架。尤其是在写项目经验和实习经历的时候，使用的技术和框架，也最好是使用招聘要求上的技术要求，可以提高岗位的匹配度。(2)简历投递简历的投递也是有一定的技巧的。招招今天就传授你们几招。简历投递一般有网申和邮箱两个渠道。不同的渠道的技巧是不同的。邮箱投递：通过邮箱投递简历的时候，最好将邮箱名称设置为真实名字，在人称加上后缀，如先生或者女士。邮箱的标题，建议醒目一些和描述一下应聘的岗位、优势。例如：招招-个人简历招招-后端开发岗位个人简历分析：像这样的标题，传达出的信息只能让人知道是一个人简历，但是HR的邮箱里面，可能受到的邮件不会只有一个简历，所以，要让HR醒目的看到你的邮件还要传递出你的意向岗位，应聘的亮点，有点开你的邮件的欲望。修改后：招招6年相关工作经验本科学历邮件的内容不要直接附带简历，最好将重要的信息罗列出来，个人信息，项目经历、个人节能、应聘优势、个人的联系电话。罗列出来的信息要与简历相吻合，但也不要写的太详细，把重点优势展现出来即可。值得注意的是，附带的简历要是PDF格式。大家也要养成转成PDF格式的习惯，好处就是在打印和发给他人查看的时候，不会格式错乱掉。网申：一些网申通道会直接往你填信息，重点来啦，在填信息的时候不要嫌麻烦，觉得有简历了就随便填，HR都是从这些内容里面，现在感兴趣的进行查看你的简历。所以在填写的时候项目经验、校园经历、获得的奖项、掌握的技能证书，一定要认认真真的填写详细了。
前端面试全家桶-面试题篇
面试题只能应对1-2面，刷题固然重要，但是对于项目相关的准备也是必须的。一般来说目前面试题能准备的范围如下：
JS基础/进阶相关
HTML/CSS相关，这方面问的真的很少了
浏览器/性能优化/工程相关
框架使用相关，也就是基础问题
框架原理相关，就算你没看过源码，你也得知道它的原理，当下的面试基本是不会原理就寸步难行
计科相关，比如算法/数据结构/网络，基本这三样，最多加个操作系统
以上是大致范围，大家可以照着把题目归类，当然除了这些还会有些别的，比如说设计模式等等的问题。另外会刷面试题只是一部分，如果只能生搬硬套，稍微题目变种一下就不会的话也没啥用。更好的办法是把这些内容内化，了解这个题目为什么要这样解，并且和自身的项目所结合。比如说项目中做过性能优化，那么你就可以把相关的性能优化答案都聊一下。
以下几个链接的内容大部分都是笔者身边朋友所写，就职的都是一二线公司。这些内容看完足以，没必要一直盯着面试题去刷，其他还有我们需要准备的内容，面试题并不是本文的重点。
javascript篇一、数据类型JavaScript有几种类型基本数据类型：undefined、null、boolean、number、string、symbol(es6的新数据类型)引用数据类型：object、array、function(统称为object)数据类型检测typeof对于基本数据类型来说，除了null都可以显示正确的类型，typeof对于对象来说，除了函数都会显示objectypeof5//numbertypeof5//stringtypeofundefined//undefinedtypeoffalse//booleantypeofSymbol()//symbolconsole.log(typeofnull)//objectconsole.log(typeofNaN)//numbertypeof[]//objecttypeof{}//objecttypeofconsole.log//functioninstanceof通过原型链来判断数据类型的p1=newPerson()p1instanceofPerson//trueObject.prototype.toString.call()可以检测所有的数据类型，算是一个比较完美的方法了。varobj={}vararr=[]console.log(Object.prototype.toString.call(obj))//[objectObject]console.log(Object.prototype.toString.call(arr))//[objectArray]深浅拷贝浅拷贝Object.assign()//es6的方法Object.assign会合并对象生成一个新对象。如果对象的属性是普通类型改变之后新对象不会改变，如果是引用类型改变后新对象也会改变，所以Object.assign实际上还是浅拷贝。varobj={aa:1,b:{item:45}};varnewObj=Object.assign({},obj);obj.aa=2;obj.b.item=kk;console.log(newObj.aa);//1console.log(newObj.b.item);//kk深拷贝JSON.parse(JSON.stringify(obj))利用JSON.stringify(obj)将对象先转为json字符串，再JSON.parse(）转回为json对象可以实现深拷贝，这也是比较常用的一种方法。用js实现一个深拷贝其实深拷贝可以拆分成2步，浅拷贝+递归，浅拷贝时判断属性值是否是对象，如果是对象就进行递归操作，两个一结合就实现了深拷贝。functioncloneDeep(source){if(!isObject(source))returnsource;//非对象返回自身vartarget=Array.isArray(source)?[]:{};for(varkeyinsource){if(source.hasOwnProperty(i)){if(isObject(source[key])){target[key]=cloneDeep(source[key]);//注意这里}else{target[key]=source[key];}}}returntarget;}functionisObject(obj){returntypeofobj===objectobj!=null;}二、作用域变量声明提升在JavaScript中，函数声明（functionaa(){}）与变量声明（var）经常被JavaScript引擎隐式地提升到当前作用域的顶部。函数声明的优先级高于变量，如果变量名跟函数名相同且未赋值，则函数声明会覆盖变量声明声明语句中的赋值部分并不会被提升，只有变量的名称被提升作用域链因为函数的嵌套形成作用域的层级关系。当函数执行时，从当前作用域开始搜，没有找到的变量，会向上层作用域查找，直至全局函数，这就是作用域链。在JavaScript中，作用域为function(){}内的区域，称为函数作用域。全局函数无法查看局部函数的内部细节，但局部函数可以查看其上层的函数细节，直至全局细节闭包闭包的原理就是作用域链，比函数F内部有一个函数G，函数G可以访问到函数F中的变量，那么函数G就是闭包。functionF(){leta=1window.G=function(){console.log(a)}}F()G()//1三、原型和继承js创建对象的几种方式对象字面量的方varobj={};new一个构造函数functionPel(){}varp=newPel();p.name="hu";p.age="25";p.address=function(){}new一个内置对varobj=newObject();Object.create（）创建对象vartest=Object.create({x:1});给大家留一道思考题，newObject()、Object.create(）、{}，这三种方式创建对象有什么区别。JS如何实现一个类构造函数法缺点：用到了this和prototype，编写复杂，可读性差functionP(name,age){this.name=name;this.age=age;}P.prototype.sal=function(){}varpel=newP("jj",1);pel.sell()ES6语法糖classclassPoint{constructor(x,y){this.x=x;this.y=y;}toString(){return(+this.x+,+this.y+);}}varpoint=newPoint(2,);原型链一句话解析什么是原型链遍历一个实列的属性时，先遍历实列对象上的属性，再遍历它的原型对象，一直遍历到Object任何一个类（函数）都有原型对象，原型对象至少有两个属性（constructor,proto）。constructor指向函数本身，proto指向父类原型对象。函数上有一个prototype属性，指向原型对象，通过它可以访问原型对象函数的实列可以直接访问原型对象(因为实列上有proto指向构造函数的原型对象)functionDog(){}//类varobj=newDog();//实列obj.name=沪江;Dog.prototype.name="旺财";Dog.prototype.eat=function(){console.log(this.name);};console.log(Dog.prototype.name);//旺财console.log(obj.prototype);//undefined,prototype是类上才有的，实列上没有obj.eat();//沪江（先遍历实列对象上的属性，再遍历它的原型对象）继承Js如何实现继承？构造函数绑定：使用call或apply方法，将父对象的构造函数绑定在子对象上functionCat(name,color){ Animal.apply(this,arguments); this.name=name; this.color=color;}实例继承：将子对象的prototype指向父对象的一个实例Cat.prototype=newAnimal();Cat.prototype.constructor=Cat;拷贝继承：如果把父对象的所有属性和方法，拷贝进子对象functionextend(Child,Parent){
varp=Parent.prototype;
varc=Child.prototype;
for(variinp){
c[i]=p[i];
}
c.uber=p;}原型继承：将子对象的prototype指向父对象的prototypefunctionextend(Child,Parent){varF=function(){}; F.prototype=Parent.prototype; Child.prototype=newF(); Child.prototype.constructor=Child; Child.uber=Parent.prototype;}ES6语法糖extends继承classColorPointextendsPoint{constructor(x,y,color){super(x,y);//调用父类的constructor(x,y)this.color=color;}toString(){returnthis.color++super.toString();//调用父类的toString()}}篇幅有限，更详细的内容可以查看，下面这篇文章由浅入深：彻底弄懂JS原型与继承mp.weixin.qq.