3月面试总结

前几次的面试，让我对于一个前端工程师需要掌握的知识体系有了一个全新的认识。之前自己在学习方面一直属于野路子，没有一个很规范的学习路径，往往都是想到什么就去学什么。而且基本都是处于会用的那种水平。并没有真正的做到知其然且知其所以然。面试基本都没有通过，我自己也明白了自己在那些方面需要深入学习。

前端面试有很多知识点，因为前端本就涉及到多个方面。当我完全抱着背的想法去应付面试官的问题时，我发现我很惧怕面试官深入的去提问。因为心里知道，我是不知道的，我只是背的。让我想到了高中的考试，也很怕考那种证明题，因为对概念和原理，掌握的不透彻。
看了这么多的优秀的文章，还有一些自己的反省思考。我觉得对于大部分的初级前端来说，要改变自己对于这些知识点的态度，才能更好的去理解这些知识点的原理，面对面试官的话，就算你不懂，你也不会虚，因为你会有自己对于这个关键词的理解。
就像大学的课程一样，在大一大二思维不成熟的时候，面对那些课程决定它们对于我敲代码并没有什么作用，有那个时间我还不如多背几个API。到后面，编程的时候会考虑风格，性能，交互等方面的时候，我才发现之前学习的课程都是有用的，只是当时编程能力没有跟上，并没有动力驱动我们去深入理解并使用。
所以这里我也觉得，你学的都是有用的，但是有些并不是当时就会发挥作用的。

关于前端面试的几个知识

关于前端面试会提到的知识点，在我稍微看了一下《webkit技术内幕》之后，我觉得按照浏览器内核中的不同功能去理解会有更好的效果。

• 网络
• 资源管理
• 网页浏览
• Javascript 运行
  根据上面四个大概的功能，就可以引导出我们需要掌握的知识了。

  网络

  网络部分涉及到的就是HTTP请求，因为我们访问网页的过程就是通过特定的URL来获得相应的资源（数据或文件）。
  那么关于HTTP就有

• 协议版本
• 请求头中包含那些属性，有哪些意义
• 请求方式之间的不同
• 响应状态码的含义
• 状态的管理 cookie的设置和传递。
• HTTP协议是TCP协议的一种实现，是应用层的协议，TCP协议则是传输层的协议。还可以追溯到IP协议，四层网络模型。

  资源管理

  通过之前的网络请求，我们可以获取相应的文件，那么这些文件存放在本地磁盘中。而像文件上传，cookie的存放，以及浏览器提供的数据库，都是存放在本地的，浏览器提供了一系列的API去操作这些文件。

• cookie的存放位置，删除机制。
• 缓存的更新机制
• 文件操作的API
• web数据存放的API( cookie,localstorage,sessionstroage,indexDB...)

  网页的浏览

  当我们获取到了一个html文件，我们开始解析，首先根据文件的<! doctype>声明去解析这个网页，构建DOM树，这是css也在下载，因为css层叠样式表,下载成功之后根据多方来源开始计算最终的css效果,然后与DOM树相结合，形成渲染树再开始绘制再浏览器界面。解析网页的时候，遇到script的时候会开始执行相应的代码，阻塞DOM树的生成。
  那么这个过程就涉及到了：

• css的计算
• dom树的生成
• sript的阻塞加载
• 页面的绘制
• 重绘与重排

  javascript运行

  因为javascript是单线程的解释型语言，从上到下解释运行。但是js中又有异步的概念，这就又引出了事件循环这个概念：

• 事件循环 Event Loop
• 宏任务（macro-task） 微任务（micro-tack）
• JS运行机制
• 线程 和 进程
• js作用域，执行环境

  性能

  通过浏览器的这几个模块，我们了解了一些知识点，但是还有其他的，比如性能。
  对于性能的优化，也可以从这几个方面去理解。性能在前端减少一个页面加载的时间。

• 通过缓存，减少HTTP的文件传输。
• 通过压缩资源，减少传输时间
• 通过优秀的CSS 以及 页面结构设计 减少 浏览器渲染时间。

  SE0

  对于SEO的话，我们主要是为了在搜索的时候让自己的网站排名靠前。那么我们可以理解一下网络爬虫，然后对于这方面的优化就会有一个大概的理解。
  网页爬虫，通过一个入口，访问符合规则的很多URL，来获得页面，通过解析页面标签的结构，来存放一些关键信息。
  比如网页head中的title,meta的describe，keywords。还有一些内容，但是因为爬虫并不是浏览器，所以一般不能在遇到script、link这些需要额外发起网络请求的资源并解析，所以对于大部分只是分析静态的页面。
  那么，我们就可以知道：

• 规范编写html结构，便于爬虫解析
• 关键词，title，内容等信息要完善
• 减少使用js输出内容
• 访问速度要快
  总结

  对于整个基础前端知识，我先分析到这里。因为对于vue react这样的前端框架我还不是很熟练，在这方面不能提供很好的学习思路。
  希望大家能找到适合自己的学习方式并构建属于自己的知识体系。