前言

在家办公已有两周，家里幽静，适合悟道，想想入行三年多，每天在每天都在疲于技术的追求，去学习各种框架，库，却不知，他们都是脱胎于JavaScript，虽然感觉自己每天都在学习，但最终发现却只是工作中的实践和平时零散的学习，虽觉得自己都什么都知道点皮毛。却终不得章法，于是在去年的面试试炼中所有问题暴露无遗。

1、前端基础知识欠缺，许多东西知其然不知其所以然

2、由于基础薄弱，对新知识的学习能力相当吃力

2、技术没有强项，且存在短板，没有一项拿得出手的细分领域的能力

3、轮子造的少，亲自实践少，很难把各个零散的知识串联起来，导致缺少解决问题的能力

翻然改悟，此前种种，皆为浮云，决定重学前端，以此文，记录一二，不对之处，还请大佬指点！

书籍推荐

首推红宝书《JavaScript高级程序设计》，其次就是大犀牛了《JavaScript权威指南》，当然这不是让你看的，是让你查的，再然后《深入理解es6》、《图解HTTP》《css揭秘》等都值得一看（注：如有爱好学习的小伙伴需要电子版，请私信）

如何学习

得益于行业内前端大佬，精力过剩，拥抱知识付费，使得我们对他们的学习方法一览无余，尽收眼底，甚是畅快，终于不用自己采坑了。大佬们的学习方法如下：

1、第一个最重要的方法，建立知识架构，帮我们给零散的知识组织起来

2、追本溯源，知其然也要知其所以然，要保持好奇心，遇见问题除了要解决之外，还要知道为什么这样写

开始学习

先上一张图，此图为前淘宝大佬所做的前端知识架构图，我们就按照此图的路线去重新梳理各个知识点，感谢大佬的课让人茅塞顿开（虽然花了钱），接下来，我们跟着这个图，参照大佬的课，开始重学前端（亦算是学习笔记）！

javaScript

js有个非常通俗的定义：专门编写网页交互行为的语言，而js又分为数据结构，和执行过程，所谓的数据结构，就是数据类型，和实例，而所谓的执行过程就是算法。而js又能从运行时，文法和执行过程三角个角度去剖析。下面我们来逐一攻克。

运行时

所谓运行时，也就是代码执行过程中，而执行中离不开数据类型

类型

js规定了七种基本类型，而其中包含六种原始类型，以及一种引用类型

原始类型包括： 1、number

2、string

3、undefined

4、boolean

5、null(有争议)

6、symbol（es6添加）

引用类型包括：

7、object

在基本类型中，抛出了许多经典面试题，你是不是回答的不是那么干脆呢？

1、null与undefined的区别是什么？ null表示定义了但是为空，而undefined表示未赋值状态，与undefind不同的是null是一个js的关键字，不可能别篡改，但是undefind却在设计之初就是一个变量，这其实是js的一个设计失误，变量当然容易被篡改，所以，在一般情况下我们常用void 0 来获取undefind的值

2、这是一道考number类型的题0.1+0.2为什么不等于0.3？

答案是fales ，两边不相等，这其实是浮点运算的特点，这些小数会被转换成二进制科学计数法表示的浮点数，在转换成 IEEE 754 标准表示，在此中间会发生除不尽的情况，这样就产生了精度问题，正确的方法是使用js提供的最小精度

0.1+0.2-0.3<=Number.EPSILON//true

类型转换

由于js是弱类型语言，所以会有频繁的类型转换。

运算比较时的类型转换

在运算比较时，会发生隐式转换并且会有一些规则，默认:一切都转为数字，再比较或者运算当然也会有一些特殊情况比如加号可以实现字符串拼接，比如在所比较时如果两个都是字符串，则并不转换成数字，而是直接比较unicode 号，如果前几位完全一样，就要比长短，再比如如果参与等于比较的两个数据，都是引用类型的对象，则不进行任何转换，只比较两对象的地址，还比如无法区分 null 和 undefined（比较全转为null）而解决办法就是使用===，下面请看一些经典面试题

[]=[]//false，特例比较地址
{}+[] //，典型的类型转换导致，有兴趣可以查一下，过程相当复杂，不再赘述

装箱转换

相信作为一个前端开发者你会很好奇，为啥一个基本类型能调用到方法呢，其实每个基本类型都有一个对应的类，而在我们调用原始类型的时候，他会自动调用原始类型对应的类，将其转换成一个对应对象，这就是所谓的装箱转换，而每一个转换后的属性都有一个私有的class，并且js提供的有Obiect.prototype.toStriing去获取，这就是我们为什么经常用这个方法去判断数据类型，因为他相比于typeOf，instanceof 能够精确的拿每一个class来判断类型

拆箱转换

既然有装箱，那必然有拆箱，在原始类型装箱后执行操作之后，必须要有拆箱过程来得到我们需要的原始类型的值，其实所谓拆箱个人理解就是通过调用装箱后对象中的valueOf 和toString方法来实现将对象转换成原始类型，如此有人又会问了，toString方法不是用来获取class的吗，怎么又用来拆箱了，其实原始类型对对应的类大都重写了toString方法。这样在调用的时候就不会按照原型链去寻找到Object了，而是调用了对应类中的toString方法。

声明变量

什么叫变量，其实本质就是。**内存中的一段存储空间，在起一个名字

那么怎么声明变量呢目前我所知道的有五种声明方式

1、var

声明变量。在赋值之前可读取到 undefined 值。会有声明提前

2、let

声明变量。不可在赋值之前读。Ï

3、const

声明常量。不可写。如果是引用类型，可以使用js方法操作引用类型里面的值

4、function

声明变量。指向一个函数

5、class

声明变量。该变量指向一个类也就是构造函数。

清楚了申明变量我们在看几道经典面试题

var let const 有什么区别？
1、let声明的变量拥有块级作用域。
2、let声明的全局变量不是全局对象的属性
3、形如for (let x...)的循环在每次迭代时都为x创建新的绑定
4、let const不能被重复定义

赋值

做前端的都知道，赋值是从又向左执行，那么我们遇见连续赋值又是怎么执行的呢？这时你一定犹豫了，我们来看一道题。

var x=y=100
console.log(x);//100
console.log(y);//100

答案显而易见，都是100，而且可以省代码，但是为啥没人这样用呢，这就涉及到一个js遗留下来的大坑，变量泄露问题，会导致全局污染，规则就是如果你向一个不存在的变量赋值，会在全局自动创建，这里的y=100就是其实就会在全局自动创建。重学前端（一）告一段落。