文章目录
  1. 1. 专业知识
    1. 1.1. Javascript
    2. 1.2. HTML与CSS
    3. 1.3. 网络相关
    4. 1.4. 浏览器相关
    5. 1.5. 安全相关
    6. 1.6. 算法基础
    7. 1.7. 计算机通用知识
  2. 2. 结束语

这些年也有不少的面试别人和面试自己的经历,也有好些人来咨询一些前端的面试题目和准备,所以整理一下记录下来。本文概括地描述一下,面试中可能会遇到的一些基础专业知识。

在进行面试前复习的时候,我们需要有结构、有逻辑地进行知识的梳理,那么大概有哪些知识点需要准备呢?面试官又可能会问到哪些内容呢?

专业知识

这里会针对前端小伙伴来进行相关专业知识的准备说明,本文只做范围的概述,后面再有详细的文章来一个个讲解。

Javascript

前端最基础的技能包括 Javascript、CSS 和 HTML,新手比较容易遇到这方面的考察。对于Javascript会问到多一些,通常包括:

考察范围 具体问题
对单线程 Javascript 的理解 单线程来源
Web Workers 和 Service Workers 的理解
异步事件机制 为什么使用异步事件机制
在实际使用中异步事件可能会导致什么问题
关于 setTimeout、setInterval 的时间精确性
对 EventLoop 的理解 介绍浏览器的 EventLoop
macrotask 和 microtask 的区别
setTimeout 和 Promise 在不同浏览器的执行顺序
Javascript 的原型和继承 如何理解 Javascript 中的“一切皆对象”
如何创建一个对象
proto 与 prototype 的区别
作用域与闭包 请描述以下代码的执行输出内容(考察作用域)
什么场景需要使用闭包
闭包的缺陷
this 简单描述 this 在不同场景下的指向
apply 和 call 的使用
箭头函数与普通函数的区别
ES6+ 对 Promise 的理解
使用 async、await 的好处
浏览器兼容性与 Babel
Set 和 Map 数据结构

对 Javascript 的考察,也可以通过写代码的方式来进行,例如:

  • 手写代码实现 call/apply/bind
  • 手写代码实现 Promise、async/await
  • Javascript 中 0.1+0.2 为什么等于 0.30000000000000004,如何通过代码解决这个问题

HTML与CSS

关于 HTML 的内容会较少单独地问,更多是结合浏览器的渲染机制等一起考察。关于 CSS,也有以下的一些考察点:

  • 介绍盒子模型
  • 内联元素与块状元素、display
  • 文档流的理解:static/relative/absolute/fixed等
  • 元素堆叠:z-index 与 position 的作用关系
  • Flex 布局方式的理解和使用
  • BFC 的优点和缺点
  • CSS 动画考察:关键帧、animate、transition 等

网络相关

网络相关的知识在日常开发中也是挺常用的,相关的问题可以从“一个完整的HTTP请求过程”来讲述,包括:

  • 域名解析(此处涉及 DNS 的寻址过程)
  • TCP 的 3 次握手
  • 建立 TCP 连接后发起 HTTP 请求
  • 服务器响应 HTTP 请求

以上的内容都需要尽数掌握,除此以外,关于 HTTP 的还有以下常见内容:

  • HTTP 消息的结构,包括 Request请求、Response响应
  • HTTP 请求方法,使用 PUT、DELETE 等方法时为什么有时候在浏览器会看到两次请求(涉及 CROS 中的简单请求和复杂请求)
  • 常见的 HTTP 状态码
  • 浏览器是如何控制缓存的:相应的头信息、状态码
  • 如何对请求进行抓包和改造
  • Websocket 与 HTTP 请求的区别
  • HTTPS、HTTP2 与 HTTP 的对比

浏览器相关

关于浏览器,有很多的机制需要掌握。通常来说,面试官会从一个叫“在浏览器里面输入url,按下 enter 键,会发生什么?”中进行考察,首先会经过上面提到的 HTTP 请求过程,然后还会涉及以下内容:

考察内容 相关问题
浏览器的同源策略 “同源”指什么
那些行为受到同源策略的限制
常见的跨域方案有哪些
浏览器的缓存相关 Web 缓存通常包括哪些
浏览器什么情况下会使用本地缓存
强缓存和协商缓存的区别
强制 ctrl + F5 刷新会发生什么
session、cookie 以及 storage 的区别
浏览器加载顺序 为什么我们通常将 javascript 放在 <body> 的最后面
为什么我们将 CSS 放在 <head>
浏览器的渲染原理 HTML/CSS/JS 的解析过程
Render Tree 是怎样生成的
Repaint 和 Reflow 是怎样的过程
日常开发中要注意哪些渲染性能问题
虚拟 DOM 机制 为什么要使用虚拟 DOM
为什么要使用 JS 对象来描述 DOM 结构
简单描述下虚拟 DOM 的实现原理
浏览器事件 DOM 事件流包括几个阶段(点击后会发生什么)
事件委托是什么

安全相关

安全在实际开发中是最重要的,作为前端开发,同样需要掌握:

  • 前端安全中,需要注意的有哪些问题
  • XSS/CSRF 是怎样的攻击过程,要怎么防范
  • 除了 XSS 和 CSRF,你还了解哪些网络安全相关的问题呢
  • SQL 注入、命令行注入是怎样进行的
  • DDoS 攻击是什么
  • 流量劫持包括哪些内容

算法基础

很多大公司会考察算法基础,大家其实也可以多上 leetcode 去刷题,这些题目刷多了就有感觉了。前端比较爱考的包括:

  • 各种排序算法、稳定排序与原地排序、JS 中的 sort 使用的是什么排序
  • 查找算法(顺序、二分查找)
  • 递归、分治的理解和应用
  • 动态规划

除此之外,常见的数据结构也需要掌握:

  • 链表与数组
  • 栈与队列
  • 二叉树、平衡树、红黑树等

计算机通用知识

虽然在日常工作中我们接触到的内容比较局限于前端开发,但以下内容如果能掌握,对个人成长和面试过程也会有所帮助:

  • 理解计算机资源,认识进程与线程(单线程、单进程、多线程、多进程)
  • 了解阻塞与非阻塞、同步与异步任务等
  • 进程间通信(IPC)常包括哪些方式,进程间同步机制又包括哪些方式
  • Socket与网络进程通信是怎样的关系、Socket连接过程是怎样的
  • 简单了解数据库(事务、索引)
  • 常见的设计模式有哪些、列举实际使用过的一些设计模式
  • 如何理解面向对象编程、对函数式编程的看法

结束语

基础知识相关的内容真的不少呢,但是这块其实只要准备足够充分就可以掌握。参加过高考的我们,理解和记忆这么些内容,其实没有想象中那么难的。

码生艰难,写文不易,给我家猪囤点猫粮了喵~

查看Github有更多内容噢:https://github.com/godbasin
更欢迎来被删的前端游乐场边撸猫边学前端噢
如果你想要关注日常生活中的我,欢迎关注“牧羊的猪”公众号噢

作者:被删

出处:https://godbasin.github.io

本文版权归作者所有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

文章目录
  1. 1. 专业知识
    1. 1.1. Javascript
    2. 1.2. HTML与CSS
    3. 1.3. 网络相关
    4. 1.4. 浏览器相关
    5. 1.5. 安全相关
    6. 1.6. 算法基础
    7. 1.7. 计算机通用知识
  2. 2. 结束语