前言

前端技术日新月异，随着 大前端 的趋势，想要成为一名合格的前端工程师，需要学习掌握的东西更是宽泛。所以我们在寻求进阶的过程中，既要不断夯实前端基础，也要快速响应技术的更新迭代。闲话少说，这次给大家整理分享一些前端进阶的优质学习资源，希望对大家有所帮助！

个人博客地址 🍹🍰 fe-code

github 优质项目

frontend-tech-list

前端技术清单，不论你是正在自学前端，还是对前端某些技术熟练掌握但某些还未涉足，我都希望这份清单能帮助你 review 一些前端的基础能力。

github

前端技术清单
- 0. 年度报告
- 1. 基础拾遗
- 2. 工程化与工具
  - 2.1. webpack
  - 2.2. Gulp
  - 2.3. Linter
  - 2.4. 静态类型（Typescript/Flow）
  - 2.5. Babel
  - 2.6. CSS预处理与模块化
- 3. 性能优化
  - 3.1. 加载性能
  - 3.2. 运行时性能
  - 3.3. 前端缓存
  - 3.4. 性能调试与实践
  - 3.5. 性能指标
- 4. 安全
- 5. 自动化测试
- 6. 框架与类库
- 7. 新技术/方向
- 8. 业务相关
- 9. 不归类的好文

CS-Notes

📚 Tech Interview Guide 技术面试必备基础知识、Leetcode 题解、Java、C++、Python、后端面试、操作系统、计算机网络、系统设计

github
摘要

算法	操作系统	网络	面向对象	数据库	Java	系统设计	工具	编码实践	后记
✏️	💻	☁️	🎨	💾	☕️️	💡	🔧	🍉	📝

✏️ 算法

☁️ 网络

javascript-algorithms

JavaScript 算法与数据结构。本仓库包含了多种基于 JavaScript 的算法与数据结构。每种算法和数据结构都有自己的 README，包含相关说明和链接，以便进一步阅读 (还有 YouTube 视频) 。

算法是如何解决一类问题的明确规范。算法是一组精确定义操作序列的规则。B - 初学者， A - 进阶

github
摘要
- B Bit 操控 - set/get/update/clear 位、乘以/除以二进制位、变负等
- B 阶乘
- B 斐波那契数 - 经典 和 闭式 版本
- B 素数检测 (排除法)
- B 欧几里得算法 - 计算最大公约数 (GCD)
- B 最小公倍数 (LCM)
- B 素数筛 - 查找任意给定范围内的所有素数
- B 判断 2 次方数 - 检查数字是否为 2 的幂 (原生和按位算法)
- B 杨辉三角形
- B 复数 - 复数及其基本运算
- B 弧度和角 - 弧度与角的相互转换
- B 快速算次方
- A 整数拆分
- A 割圆术 - 基于 N-gons 的近似 π 计算
- A 离散傅里叶变换 - 把时间信号解析成构成它的频率

30-seconds-of-code

精选 JavaScript 代码段集合，您可以在30秒或更短的时间内理解这些代码段

github
摘要

📚 Array
View contents
🌐 Browser
View contents

javascript-questions

JavaScript 进阶问题列表，从基础到进阶，测试你有多了解 JavaScript，刷新你的知识，或者帮助你的 coding 面试！ 💪 🚀 我每周都会在这个仓库下更新新的问题。

github
摘要
- 1. 输出是什么？
```
function sayHi() {
console.log(name)
console.log(age)
var name = 'Lydia'
let age = 21
}

sayHi()
```
- A: Lydia 和 undefined
- B: Lydia 和 ReferenceError
- C: ReferenceError 和 21
- D: undefined 和 ReferenceError
答案

答案: D

在函数内部，我们首先通过 var 关键字声明了 name 变量。这意味着变量被提升了（内存空间在创建阶段就被设置好了），直到程序运行到定义变量位置之前默认值都是 undefined。因为当我们打印 name 变量时还没有执行到定义变量的位置，因此变量的值保持为 undefined。

通过 let 和 const 关键字声明的变量也会提升，但是和 var 不同，它们不会被初始化。在我们声明（初始化）之前是不能访问它们的。这个行为被称之为暂时性死区。当我们试图在声明之前访问它们时，JavaScript 将会抛出一个 ReferenceError 错误。
- 1. 输出是什么？
```
for (var i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 1)
}

for (let i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 1)
}
```
- A: 0 1 2 和 0 1 2
- B: 0 1 2 和 3 3 3
- C: 3 3 3 和 0 1 2
答案

答案: C
由于 JavaScript 的事件循环，setTimeout 回调会在遍历结束后才执行。因为在第一个遍历中遍历 i 是通过 var 关键字声明的，所以这个值是全局作用域下的。在遍历过程中，我们通过一元操作符 ++ 来每次递增 i 的值。当 setTimeout 回调执行的时候，i 的值等于 3。

在第二个遍历中，遍历 i 是通过 let 关键字声明的：通过 let 和 const 关键字声明的变量是拥有块级作用域（指的是任何在 {} 中的内容）。在每次的遍历过程中，i 都有一个新值，并且每个值都在循环内的作用域中。

Daily-Interview-Question

每天搞定一道前端大厂面试题，祝大家天天进步，一年后会看到不一样的自己。

github
摘要

2019-07-26

第 114 题：编程题，找出字符串中连续出现最多的字符和个数（蘑菇街）
'abcaakjbb' => {'a':2,'b':2}
'abbkejsbcccwqaa' => {'c':3}

解析：第 114 题

2019-07-25

第 113 题：编程题，根据以下要求，写一个数组去重函数（蘑菇街）

如传入的数组元素为[123, "meili", "123", "mogu", 123]，则输出：[123, "meili", "123", "mogu"]

如传入的数组元素为[123, [1, 2, 3], [1, "2", 3], [1, 2, 3], "meili"]，则输出：[123, [1, 2, 3], [1, "2", 3], "meili"]

如传入的数组元素为[123, {a: 1}, {a: {b: 1}}, {a: "1"}, {a: {b: 1}}, "meili"]，则输出：[123, {a: 1}, {a: {b: 1}}, {a: "1"}, "meili"]

解析：第 113 题

learnVue

Vue.js 源码解析

github

vue-design

渲染器，仓库内还有一个针对 Vue 的逐行级别的源码分析，都是干货。

github
目录列表
- 组件的本质
- 设计 Vnode
- 辅助创建 VNode 的 h 函数
- 渲染器之挂载
- 渲染器之 patch
- 渲染器的核心 Diff 算法
- 自定义渲染器和异步渲染

CS-Interview-Knowledge-Map

前端面试图谱

react-interpretation

React 源码解析。通过两个部分来完成这个解析：第一是加上这份代码的中文注释，第二是配套相应的文章。

github

Front-end-Web-Development-Interview-Question

这里将收集我做过的所有的前端面试笔试题，并根据自己的理解提供解答，以及一些关于前端找工作方面的经验等。

github
摘要

试题链接	原题概述	标签分类	更新状态
1.md	Front End Web Development Quiz CSS部分	CSS	已完结 :v:
2.md	Front End Web Development Quiz HTML部分	HTML	已完结 :v:
3.md	FEX 面试题	General	待完善 :punch:
4.md	前端面试常见问题	General	待完善 :punch:
5.md	前端面试HTML 相关问题	HTML	已完结 :v: