前端面试复盘专题（一）：复习大纲及蜕变计划

前言

距离上次更新已通过去了很久，在这几个月里，虽然没有更新文章，可是本身也没有闲着，出去转了转各大公司的前端招聘要求，真正的体验了一把前端的行情和走势。在经历了这些以后，我开始从新修正本身的学习方向，完善本身的知识架构体系和学习方法，我会将我知道的和经历的倾囊相授，之因此写这些，不是要标榜本身有多厉害，只是想把本身踩过的坑走过的弯路分享出来，帮助真正热爱前端的同窗站在咱们前人的肩膀上跨越技术障碍，留足精力去探索前端更有趣、本身真正喜欢的东西，同时也是对本身在这几个月的一个交代；在文章的末尾，我会发起一个“前端蜕变计划”，具体的信息我会在文章最后说明，欢迎热爱前端的小伙伴一块儿加入。

专题介绍

首先，专题是复盘系列，我会根据本身目前亲身接触的比较中肯的形式来定总体体系，对于比较极端和小众的形式，我也会顺手提到，防止意外踩坑。整个专题系列耗时会比较长，文章也会比较多，我会根据先归纳再细节的方式逐级展开。

根据面试轮次，按照技术层次分，顺利的话，会分为5轮，这5轮分别是层级递进的，各轮考察内容主要以下：

graph TD
第一轮:前端基础知识掌握状况及实际编程能力

graph TD
第二轮:项目开发能力及发现和解决实际问题能力

graph TD
第三轮:技术架构原理和JavaScript设计模式以及数据结构算法

graph TD
第四轮:自我职业规划和对行业新技术了解以及将来发展的的认知

graph TD
第五轮:你指望的工做方式和你是如何肯定本身指望薪资标准的

以上的面试层次是中大型公司的流程，你们能够参照5轮面试的主体结构来构建本身的知识体系，针对性的复习，另外由于涉及到的知识很是的普遍，更新时间会很是的长，若是等不及，能够私聊我进行讨论。在每一个专题我会只列出几道题，可是在给出解答思路的时候会进行外延拓展，仍是那句话，答案不重要，涵盖的知识如何串起来，让面试官真正认识到你是真的懂，这才是关键。

本文专题

面试轮次：第一轮

考察能力：前端基础知识掌握状况及实际编程能力

主体知识：JS基础----堆栈内存闭包做用域

题目：

一、parseInt()和Number()有什么区别？

二、var 和 const的区别？

三、如何实现一个函数add使得：add(1)(4,5,6)(7,8)(10) 输出 41 ？

四、说说ES6里面对数字类型的加强特性有哪些？
复制代码

题目解答思路

题目一 parseInt()和Number()有什么区别？

考查知识: JS数据类型、为何会有隐式转换

主体思路：先答这两个API的做用是什么，再说具体哪不一样（入参，过程，结果），再说为何会出现这种缘由；

示例答案：parseInt和Number都是两个用于将入参转为数字的方法。parseInt是将入参转化为指定进制的整数，而Number是将传入的参数转换成数字类型的值，二者在容许接收的参数个数上不一样，同时在转换结果上也可能不一样，这是第一点区别；第二点区别在于转换过程当中，parseInt会尽量的将传入的参数转为数字，直到遇到不能转换为数字的字符，而Number会在转换前对入参进行扫描，只要含有不能转换成数字的字符，所有返回NaN;第三点在于，对于特殊类型的处理，对于null和undefined,parseInt均会返回NaN, 而Number返回0和NaN;

题目二 var 和 const 有什么区别？

考查知识: JS定义变量的方法，以及为何要新增定义变量的方式

主体思路：先答这两个API的做用是什么，再说具体哪不一样，再说为何会出现这种缘由；

示例答案：var和const都是声明变量的方式，而他们之间的区别，主要在如下几个方面：

1）兼容性和语法支持；var是JS最先声明变量的方式，只要支持JS，都支持var声明变量的方式，而const是ES6新加入的语法，在部分不支持的环境中须要使用工具转换成var的写法；
  
  2）变量提高的区别；var声明的变量会存在着变量提高的特性，也就意味着在变量正式被赋值以前均可以被读取，而const声明的变量不具有变量提高的做用；
  
  3）与全局对象的关系；在全局环境中，使用var申明的变量，既是一个全局的变量同时仍是全局对象window的一个属性，而使用const声明的变量仅仅是一个变量；
  
  4）重复声明；使用var声明的变量，容许在相同的环境中再次声明一个同名变量，而使用const声明的变量，不容许再次声明同名变量；
  
  5）暂时性死区；const具备暂时性死区的特性，在变量被声明赋值以前，访问变量会出现报错的问题，这是ES6为严格语法规则加入的特性，保证了变量在声明以后才可读取；
  
  6）与块级做用域的关系；const和let的出现很大的一个缘由是由于在ES6中除了之前的全局做用域和函数做用域，新增了块级做用域的概念，而const的有效范围其实就是块级做用域，再一次细分了做用域的维度大小；
  
  7）为何会出现const呢？
  ES规范的出现是为了改变JS自己存在的问题，使其可以安全稳定的在较大的综合项目中稳定运行，所以对于一些影响因素从新添加新的语法规则得以改善，同时又保持原有语法正常支持；
复制代码

题目三： 如何实现一个函数连续相加函数add，使得：add(1)(4,5,6)(7,8)(10) 输出 41 ？

主体思路：根据题目信息，每一次add执行完成后还能够再次执行，意味着add执行完成后返回的是一个函数，而这个函数能够将全部传入的参数进行累加，因此，问题就变成了：

1）如何记录下每一次传入的参数；

2）如何在执行后依然返回一个函数，而且还能实现累加；

3）若是返回的是一个函数，如何能实如今访问执行结果的时候返回一个数字？

要解决参数记录，最容易想到的就是设置一个全局变量，将每次传入的参数都记下来，而后再求和；这是最容易想到的一个方法，可是这个方法有个弊端，那就是在同一个命名空间，分别执行两次相同参数的函数，获得的结果彻底不一致，并且，后一次执行的结果是前一次结果的两倍，缘由就在于虽然实现了记下每一次的参数，可是理想的情况是：当我从新执行的时候，我但愿的结果是初始值，而不是被上次执行结果污染的；写成代码就是：

add(1)(4,5,6) // 16 add(1)(4,5,6) // 32

而我须要的是： add(1)(4,5,6) // 16

add(1)(4,5,6) // 16

因此，使用全局变量去解决参数记录问题是存在问题，那么就得另外想办法；那能解决这个问题的另外一个办法就是闭包，闭包可以实现咱们在外部访问函数内部的变量，理论上保存变量的问题是解决了；那么第二个问题是执行结果是一个函数，在闭包里这也不是问题，由于闭包在大多数状况下最明显的特征就是返回一个被外部占用的变量，这点也知足要求。

因此根据上述思路，伪代码能够写成这样:

function add(arg){
    
    arg = oldArg + arg;  // 参数合并，而且首次执行参数是初始值

    return function(arg){  // 返回一个函数，将合并后参数继续传入
     // ……
     
    }
}

复制代码

如今还存在最后一个问题，如何在访问的时候可以返回一个数字？根据前面的思路，函数执行后会返回一个函数，而函数是个引用类型的值，对于引用类型的值，当访问值时，实际上访问的是引用类型中[Symbol.toPrimittive]、valueOf、toString去获取引用类型的原始值，因此咱们只须要选取其中一个重写其方法就能够了。如今问题基本都理清了，按照思路，直接写出答案：

function add(...arg){

  function proxy(...innerArg){

    arg = [...arg,...innerArg];

    return proxy
  }

  proxy.toString = function(){

    return arg.reduce(function(total, item){return total + item}, 0)
  }

  return proxy
}
复制代码

须要注意的是，这里的proxy并非那个Proxy函数，若是以为绕的话，能够换成其余名字都行。

题目四： 说说ES6里面对数字类型的加强特性有哪些？

主体思路:

限定很明确，是对数字类型，所以尽量的详尽一点归纳总结新特性，既考察你对ES6的了解程度，又考察总结临时归纳能力。

参考答案：

ES6对数字类型能力支持主要出于两方面的考虑，一个是改善既有的缺陷，再有就是提供能力加强；

先说缺陷弥补：

1）增长Object.is()方法弥补等价判断缺陷；
       在以往 +0 === -0 结果是true, 可是有时候咱们但愿的是只要是彻底同样，结果就返回true,
       但凡是有差别，结果就返回false, 但事实并不是如,江湖上一直流传着如下代码：
复制代码

+0 === -0  // true
           
  NaN === NaN  // false
复制代码

这种状况让人非常头疼，在特定业务下，不得不本身写工具函数去判断是否真的一致，ES6为了弥补这一问题，新增了Object.is(a,b)方法，目的就是要解决这种判断不一致问题，再来看看弥补以后的结果：

Object.is(+0, -0) // false

Object.is(NaN,NaN)  // true
复制代码

这才是符合咱们认知的等价。

2）增长Number.EPSILON,能够用来判断两数相等

JS对数字的表示不区分整型和浮点型，统统都用双精度64位浮点型表示，这就致使在转换一些数字时，没办法彻底准确的用二进制表示，因此才会出现经典的0.1 + 0.2 !== 0.3 问题，在设计交易金额时，处理精度很是的老火，要么本身写处理函数作先放大后缩小，要么采用第三方工具，总之就是战战兢兢；ES6新增Number.EPSILON，他的值时2的-52次方，咱们能够借用该值极小的特性，认为只要两个数之间的差值小于该值，就能够认为两数相等，虽然依然没法一步到位省去比较过程，可是能够简化咱们的比较逻辑，封装以后挂载全局仍是很好用的

再说能力加强：

1）bigInt bigInt要解决的问题是超出最大安全数和小于最小安全数以后，数据会失真的问题，虽然咱们可使用字符串的形式表示，却没法依靠字符串作数字运算，还得实时防着后端给的数字会超出范围，在计算的时候也须要借助后端能力，bigInt可以实现数据不失真表示，还能进行运算，可谓是一大福音；

2）最大安全数和最小安全数 准确的说叫最大安全整数和最小安全整数，表示为：Number.MAX_SAFE_INTEGER 和Number.MIN_SAFE_INTEGER，对应数值分别为2^53 和 2^(-53),超出该范围的值会失真，实际项目中，能够借此作安全性判断，结合bigInt综合应用；

前端蜕变计划

什么是前端蜕变计划？

前端蜕变计划是一项面向热爱并致力于努力提高自个人前端开发者的公开的学习提高计划。

计划要解决什么问题？

前端蜕变计划要解决的问题主要是：有想法可是没毅力坚持、有毅力可是方法收效甚微和有想法可是不知道从哪入手的前端学习者的困惑。

参与后我能获得什么？

思惟习惯：

持续学习习惯： 有没有思考过一个问题：为何到如今，即便是初入前端，依然能拿到很高的工资？缘由就在于，虽然前端是一个须要积累的职业，可是迭代速度很是的快，十年前你须要懂IE兼容的办法，可是如今呢，你只要学了原生JS和vue/react,你就能拿到满意的offer,快速发展带来的不只仅是学习成本的增长，同时也意味着再任什么时候候，只要你掌握了当前比较热门的技术，你就能从前端分到一杯羹，而后在工做中再去弥补本身的基础知识，这对于新人很是友好，可是对于老前端，却须要持续的学习，才能在技术上想必新手有比较大的职业优点，毕竟新手对于薪资和加班要求都没那么高。

自我驱动： 人都是有惰性的，不多有人能坚持长时间的去作一件事，除了学习，外界的一切都具备吸引力，因此这个计划要达到的目标其中一个就是要实现自我意识觉醒，找到舒服的学习方式，从而实现本身主动去学习，前期咱们会按期推送题目，提醒学习，渐渐的养成习惯，实现自我主动学习，遇到难题了再回过头来交流。

记答案!==会了： 前端知识有不少知识是没有权威讲解为何是这样的参考资料的，对于一些反人类的知识点，即便想问为何，也不要知道找谁问，慢慢的，对于一些题记住了答案，殊不知道原理，因此，计划要解决的问题就是让你想问为何的时候，有人会，而且还能给出详细的分析，理解后再记忆，这样的记忆才有意义。

持续总结： 前端知识杂而多，而且要想掌握深入，不是那么容易的，另外，在不一样的阶段，你对同一个知识点的理解角度和深度也会不同，你须要记住那些面试爱问而实际工做中又碰不到的知识点，同时也能

学习方法：

项目驱动自我能力： 一直把作项目当作是自我学习以外的事情，直到有一天遇到了一个只从实际项目中获取知识的高手，我才意识到本身的想法存在误区，我要说的是，想办法从实际工做项目中汲取养分，若是以为汲取不到，那必定是方法出现了问题，想办法去请教熟悉这种学习方法的人，从他们那取经，同时，工做以外的自我扩展也不能放下，毕竟工做中用到的知识不等于实际面试中考察的知识，因此，尽量的二者兼顾。

构建知识树： 我遇到的比较厉害的高手，都是有本身的知识架构树，必定不要嫌弃构建知识树耗时还耗力，他能具象化你的知识体系，让你真正的从纸面上看到本身会哪些，哪些知识仍是空白的，同时也让你再次从零复习时快速创建知识体系。

专题兴趣组： 找到志同道合的人，针对某个专题，听听他们怎么理解，不要老是闷在本身的世界里，思想的碰撞才会激发出更多的学习乐趣；小组的人不须要太多，3-8人足矣，要保持足够的好学态度，互相鼓励，共同探讨。

刷题： 这个技巧相信大多数同窗都用过，以战养战，若是刷题方法得当，可以实现短时间内在编程能力实战上有比较大的提高，可是必定要得当，如何才能去评估方法是否得当呢？有个比较简单的办法，作一道题目，一个星期后你还会写，而且保证下次碰到相同类型的题目可以有思路，那么你就真的掌握了刷题技巧，反之，你该思考究竟是哪一个环节出现了问题，不要毫无目的的乱刷题，背题目是无论用的，背了忘，忘了背，既没有效果，还为难了本身。

心态：

放下焦虑： 前端发展太迅速了，以致于你们把握不许前端在此时此刻的行情，因而乎总有一部分抱有目的的人说前端饱和了，前端凉了等相关谣言，若是你对前端后必定的了解，这些话天然不攻自破，坏就坏在这些人对于这个论点给出明确的论据，让你即便不相信，但心里依然产生波动，不自主的陷入到职业焦虑中；另外还有一种焦虑是技术焦虑，所谓的技术焦虑就是，技术更新迭代太快，担忧本身跟不上发展潮流而被淘汰，但实际上，没有人可以实现驾驭全部新老技术，也不必一味的求新，而对当前已掌握的技术浅尝辄止，不然就会形成样样都知道，样样都不熟的状态，若是你不知道该如何调整，欢迎加入加入中，一块儿克服焦虑。

学会焦虑： 有的同窗会问，刚刚你不才说了要放心焦虑吗？这咋还说要学会焦虑呢，这里我要说的是，对于别人扔给你的无辜焦虑，你应该要学会丢掉，可是本身要有危机意识，由于，你不学习，长期以往，就真的会出现工资倒挂的状况，你应该要产生内驱，可是这个度，你要把握好，不然要么着魔，要么抑郁。

我如何参与？

我会根据你对技术的热爱程度，分为狂热和热爱，对于狂热，我会拆分出小组，一组7-10人，对于热爱，我会统一合并到一块儿，人数可能较多，因此你们可能经过微信搜索公众号【前端进阶指南】来参与到计划中，但愿一年后再次想起今天的决定，发自心里的以为今天选对了，不拼一把，你怎么知道本身是人才仍是废柴。

最后

最后送给你们一段我很喜欢的话：

"The best time to plant a tree was 10 years ago. The second best time is now."

种一棵树最好的时机是十年前，其次是如今。

我是格局，带你看有深度的前端世界，搭建适合本身的知识架构，关注我，跑的更快一点。