面试指南 + 前端知识库在线地址:
😄 温馨提醒
由于 Notion 没有像语雀那样的侧边栏大纲,所以得安装一个 Chrome 插件来支持。我本人之前一直用 Notion Boost ,但它的侧边栏功能我用着不大习惯,所以自己参考着写了个简易版本的插件 Notion Faster,欢迎大家使用并提出意见。
- 如何实现图片的懒加载,随着 web 技术的发展,有没有一些更好的方案
- 博客系统中常见的复制代码是如何实现的
- localhost:3000 与 localhost:5000 的 cookie 信息是否共享
- 如何计算白屏时间和首屏时间
- 什么是 Data URL,有哪些缺点
- textarea 如何禁止拉伸
- 有没有使用过 css variable,它解决了哪些问题
- '+' 与 '~' 选择器有什么不同
- css 动画与 js 动画哪个性能更好
- 为什么会发生样式抖动
- css 如何匹配前 N 个子元素及最后 N 个子元素
- 如何自定义滚动条的样式
历史更新记录
- 谈一下 HTTP 与 HTTPS
- TCP 和 UDP 的区别
- 说几个很实用的 BOM 属性对象方法?
- 说一下 HTML5 drag API
- iframe 是什么?有什么缺点?
- GET 请求传参长度的误区
- 介绍下 webpack 热更新原理,是如何做到在不刷新浏览器的前提下更新页面的
- 数组里面有 10 万个数据,取第一个元素和第 10 万个元素的时间相差多少
- 打印出1 - 10000 之间的所有对称数
- 实现模糊搜索结果的关键词高亮显示
- 介绍下 HTTPS 中间人攻击
- 给定两个大小为 m 和 n 的有序数组 nums1 和 nums2。请找出这两个有序数组的中位数。要求算法的时间复杂度为 O(log(m+n))。
- Virtual DOM 真的比操作原生DOM 快吗?谈谈你的想法。
- 下面的代码打印什么内容,为什么?【值预测】
- 浏览器缓存读取规则
- 为什么 Vuex 的 mutation 和 Redux 的 reducer 中不能做异步操作?
- 为什么通常在发送数据埋点请求的时候使用的是 1x1 像素的透明 gif 图片?
- 某公司 1 到 12 月份的销售额存在一个对象里面
- 已知如下代码,如何修改才能让图片宽度为300px ?
- 介绍下如何实现 token 加密
- redux 为什么要把 reducer 设计成纯函数
- ES6 代码转成ES5 代码的实现思路是什么
- ES5/ES6的继承除了写法以外还有什么区别?
- 实现数组扁平化-升序且不重复
- JS异步解决方案的发展历程以及优缺点
- A、B 机器正常连接后,B 机器突然重启,问 A 此时处于 TCP 什么状态
- React 一道 setState 笔试题
- 介绍下 npm 模块安装机制,为什么输入 npm install ,就可以自动安装对应的模块?
- 有以下 3 个判断数组的方法,请分别介绍它们之间的区别和优劣
- 聊聊 Redux 和 Vuex 的设计**
- 全局作用域中,用 const 和 let 声明的变量不在 window 上,那到底在哪里?如何去获取?
- cookie 和 token 都存放在 header 中,为什么不会劫持 token?
已将全部语雀资源搬运至 Notion,并且调整了目录结构使知识库更清晰。大家可查看最新 Notion版本 的知识库。 另外由于 Notion 默认不支持侧边栏大纲显示,这里推荐一款 Chrome 插件 Notion Boost 供大家下载,它能支持网页版动态生成 Notion 文章的侧边栏大纲。如果因为众所周知原因无法在商店下载,可点击 此官网链接 下载离线版本。
由于语雀会员风波,虽然目前此知识库仍然互联网可见,但我考虑再三后,还是决定后续把知识库逐步迁移至 notion,目前才开始迁移,地址各位可以先马克一下:
后续更新会把更新的概要写入 更新日志 中,方便大家查看具体更新内容
近两年使用「语雀」记笔记比较多,前段时间借着面试准备的机会,就把笔记整理到了语雀上,后续各位看官可移步 👉 前端知识库 👈 查看此系列。
根据网上各大前端面试题文章以及自我总结,沉淀下来的一套面试题合集,包含前端知识点 + 面试题。
为了更好的阅读体验,推荐各位看官在博客中查看:Lance个人博客-面试系列
根据以往面试经验,HTML部分很少有问到。所以这里仅列举一些高频面试题
个人经验:这部分面试题一般笔试考知识点多一些(多背),面试考布局更多一些(多实践)。所以CSS我拆成了两部分,把布局单独拧出来了。
这部分是面试重中之重,基本上啥都可能考。譬如比较经典的一个有关axios的面试题:
- 问:a、b、c三个请求,希望c在a、b获取数据后再发请求,要是你你会怎么做?
- 答:axios.all 先请求 a、b,再在 then 的第一个回调中请求 c ,巴拉巴拉...
- 问:那 axios.all 内部是通过什么实现的呢?
- 答:Promise.all,巴拉巴拉...
- 问:如果不用 Promise 该如何实现?
- 答:可以用 高阶函数 ,巴拉巴拉...
// 示例(使用node读取文件做场景来说明)
let fs = require('fs')
let arr = []
function fn(data) {
arr.push(data)
if (arr.length === 2) {
// get ab
// todo c
}
}
fs.readFile('./a.txt', 'utf8', (err, data) => {
fn(data)
})
fs.readFile('./b.txt', 'utf8', (err, data) => {
fn(data)
})
可以看出,往往 JS 面试题是层层深入的,需要你有坚实的基础,并且在平常开发时不仅满足会使用各种库和框架,还要深入了解原理。所以这一小节内容较多,各位做好抗压准备。
浏览器这边主要考察兼容性,当然有时候也考察下HTTP缓存等内容,所以我把它们归到了一起方便复习。
Vue没什么好说的,数据响应式(双向数据绑定)是一定会问到的,其它例如生命周期之类的也常常出现,具体查看下面链接:
个人在面试中很少被问到 webpack 的问题?唯一一次与 webpack 相关的还是在一次面试的笔试题中,有这样一道:
写出你知道的性能优化方案(不要写 webpack 工具能做到的)
虽然我自己没碰到过,但保不齐其他公司不爱问,所以还是放在这儿:
性能优化现在应该是必考题了,我去几家公司面就有几家会问到,常考的知识点有「首屏优化」「重排重绘优化」以及「css3动画优化」等。不太了解这部分的童鞋可以看下面链接:
这部分目前是我薄弱项,暂时不能给到大家更多帮助。不过对于面一般普通前端来说,也就顶多问一下常见的排序算法了。
这是我之前整理的常见排序算法:可以 点击此处 查看。
其他算法面试题会在后续更新...
网上的简历模板一搜一大堆,不过大都既不实用也不好看。所以最后我再分享几个觉得不错的模板给大家参考:
- https://www.resumeviking.com/wp-content/uploads/2018/01/Dwight-Kavanagh-Resume-IT-QA-Analyst-11.pdf
- https://www.resumeviking.com/wp-content/uploads/2019/04/Emily_Carter_-Resume-_English_Teacher-9.pdf
- https://www.resumeviking.com/wp-content/uploads/2018/09/Karen_Philips_-Resume-_Web_Designer-4.pdf
上面两份模板都来自 此网站 ,想寻找更满意的版本可以进去逛逛。
- http://zhangwenli.com/cv/
- https://html5up.net/read-only
- 下载地址:上方链接右上角 Download
本项目整合了大量下方资源的面试题内容,但毕竟是按照我自己技术栈整合的,所以如果你还想查缺补漏(例如 react 相关面试题等),可以点击下方链接了解更多: