JavaScript开发者应懂的33个概念

• 📖 深入理解 JavaScript 原型与闭包 —— 王福朋

视频

• 📺 JavaScript 闭包和闭包面试题 —— 爱奇艺

• 📺 js 面向对象闭包数组 11.闭包 —— 乐视

• 📺 白贺翔_函数(闭包) —— 乐视

⬆️ 返回目录

---

9. map, reduce, filter 等高阶函数

---

文章

• 📖 高阶函数 —— 廖雪峰

• 📖 ES5 中新增的 Array 方法详细说明 —— 张鑫旭

• 📖 一张图看懂 JavaScript 中数组的迭代方法：forEach、map、filter、reduce、every、some —— 掘金

• 📖 Transducing（上）－《JavaScript 轻量级函数式编程》 —— SegmentFault

• 📖 JavaScript 函数式编程（三） —— @BuptStEve

⬆️ 返回目录

---

10. 表达式和语句

---

文章

• 📖 js 表达式与语句 —— 博客园

• 📖 JS 表达式和语句的区别 —— SegmentFault

• 📖 JavaScript 中的表达式（expression）和语句/声明（statement） —— CSDN

• 📖 重讀 Axel 的 Javascript 中的 Expression vs Statement 一文 —— SegmentFault

• 📖 Expressions versus statements in JavaScript —— Dr. Axel

⬆️ 返回目录

---

11. 变量提升

---

文章

• 📖 JavaScript 变量提升 —— 菜鸟教程

• 📖 ES6 变量作用域与提升：变量的生命周期详解 —— 掘金

• 📖 [翻译] JavaScript Scoping and Hoisting —— SegmentFault

• 📖 JavaScript Scoping and Hoisting —— Ben Cherry

⬆️ 返回目录

---

12. Promise

---

文章

• 📖 使用 promises —— MDN

• 📖 Promise —— MDN

• 📖 Promise — 廖雪峰

• 📖 JavaScript Promise：去而复返 —— 司徒正美

• 📖 (上面的原文)JavaScript Promise：简介 —— Web Fundamentals

• 📖 1 分钟读完《10 分钟学会 JavaScript 的 Async/Await》 —— justjavac

• 📖 JavaScript Promise 迷你书（中文版）

• 📖 JavaScript 进阶之路——认识和使用 Promise，重构你的 Js 代码 —— 博客园

视频

• 📺 Promise 入门 —— 慕课网

⬆️ 返回目录

---

13. 立即执行函数, 模块化, 命名空间

---

文章

• 📖 Javascript 模块化编程（一）：模块的写法 —— 阮一峰

• 📖 javascript 模块化编程-详解立即执行函数表达式 —— 简书

• 📖 Javascript 的匿名函数与自执行 —— 掘金

• 📖 前端模块化——技术选型 —— SegmentFault

• 📖 谈谈 Js 前端模块化规范 —— SegmentFault

• 📖 函数声明与函数表达式的区别 —— 伯乐在线

⬆️ 返回目录

---

14. 递归

---

文章

• 📖 求解释 js 递归 —— SegmentFault

• 📖 JavaScript 中的递归 —— 掘金

• 📖 递归（上）－《JavaScript 轻量级函数式编程》 —— 掘金

• 📖 递归（下）－《JavaScript 轻量级函数式编程》 —— 掘金

• 📖 尾调用和尾递归 —— 掘金

• 📖 几个经典递归问题用 js 实现 —— CSDN

• 📖 递归函数的几个例子 —— CSDN

⬆️ 返回目录

---

15. 算法

---

文章

• 📖 十大经典排序算法总结（JavaScript 描述） —— 掘金

• 📖 在 JavaScript 中学习数据结构与算法 —— 掘金

• 📖 JS 中可能用得到的全部的排序算法 —— 掘金

• 📖 JS 家的排序算法 —— 简书

• 📖 前端常见算法的 JS 实现 —— SegmentFault

• 📖 前端面试中的常见的算法问题 ——蒲小花的博客

视频

• 📺 Javascript 实现二叉树算法 —— 慕课网

⬆️ 返回目录

---

16. 数据结构

---

文章

• 📖 来我们浅谈一下 js 的数据结构 —— 简书

• 📖 JavaScript 中的算法与数据结构 —— 简书

• 📖 学 JS 必看-JavaScript 数据结构深度剖析 —— 大道至简的博客

• 📖 js 中基础数据结构数组去重问题 —— 掘金

视频

• 📺 📺 JavaScript 数据结构-运算符 —— 乐视

⬆️ 返回目录

---

17. 消息队列和事件循环

---

文章

• 📖 并发模型与事件循环 —— MDN

• 📖 JavaScript 运行机制详解：再谈 Event Loop —— 阮一峰

• 📖 深入理解 JavaScript 事件循环 —— 博客园

• 📖 深入浅出 Javascript 事件循环机制 —— 知乎

• 📖 JS 事件循环机制（event loop）之宏任务、微任务 —— SegmentFault

• 📖 JavaScript：彻底理解同步、异步和事件循环 —— SegmentFault

• 📖 从浏览器多进程到 JS 单线程，JS 运行机制最全面的一次梳理 —— 掘金

⬆️ 返回目录

---

18. setTimeout, setInterval 和 requestAnimationFrame

---

文章

• 📖 Window setTimeout() 方法 —— 菜鸟教程

• 📖 Window setInterval() 方法 —— 菜鸟教程

• 📖 关于 setTimeout —— 掘金

• 📖 你不知道的 Javascript：有趣的 setTimeout —— 掘金

• 📖 原来你是这样的 setTimeout —— 掘金

• 📖 setTimeout() 和 setInterval() 本质区别在哪里？ —— SegmentFault

• book: window.requestAnimationFrame —— MDN

• 📖 requestAnimationFrame 知多少？ —— 博客园

• 📖 CSS3 动画那么强，requestAnimationFrame 还有毛线用？ —— 张鑫旭

• 📖 「JavaScript 定时器」setInterval、setTimeout 和 requestAnimationFrame 浅析 —— SegmentFault

• 📖 翻译：setInterval 与 requestAnimationFrame 的时间间隔测试 —— SegmentFault

• 📖 阿里前端面试题：requestAnimationFrame 实现类似 setInterval 的计时器 —— SegmentFault

视频

• 📺 setTimeout 和 setInterval —— 优酷

⬆️ 返回目录

---

19. 继承, 多态和代码复用

---

文章

• 📖 JS 面向对象编程之：封装、继承、多态 —— 博客园

• 📖 Javascript 的继承与多态 —— 简书

• 📖 js:面向对象编程，带你认识封装、继承和多态 —— 掘金

• 📖 JavaScript 中的“多继承” —— 掘金

• 📖 代码复用模式 —— github

• 📖 深入理解 JavaScript：代码复用模式(推荐篇) —— 汤姆大叔

• 📖 深入理解 JavaScript：代码复用模式(避免篇) —— 汤姆大叔

⬆️ 返回目录

---

20. 按位操作符, 类数组对象和类型化数组

---

文章

• 📖 按位操作符 —— MDN

• 📖 类数组对象 —— MDN

• 📖 类型化数组 —— MDN

• 📖 JavaScript ArrayBuffer 浅析 —— 博客园

⬆️ 返回目录

---

21. DOM 树和渲染过程

---

文章

• 📖 如何创建一个 DOM 树 —— MDN

• 📖 HTML DOM 节点 —— W3school

• 📖 DOM 概述 —— 阮一峰

• 📖 《JavaScript 闯关记》之 DOM（上）—— 掘金

• 📖 《JavaScript 闯关记》之 DOM（下）—— 掘金

• 📖 掌握 DOM 操作 —— 掘金

• 📖 操作 DOM —— 廖雪峰

• 📖 原来 CSS 与 JS 是这样阻塞 DOM 解析和渲染的 —— 掘金

视频

• 📺 DOM 探索之基础详解篇 —— 慕课网

• 📺 DOM 事件探秘 —— 慕课网

• 📺 jQuery 基础(二)DOM 篇 —— 慕课网

• 📺 JS 操作 DOM 对象属性和方法 —— 爱奇艺

⬆️ 返回目录

---

22. new 与构造函数, instanceof 与实例

---

文章

• 📖 构造函数与 new 命令 —— 阮一峰

• 📖 Javascript 面向对象编程（二）：构造函数的继承 —— 阮一峰

• 📖 完整原型链详细图解(构造函数、原型、实例化对象) —— CSDN

• 📖 JavaScript 中构造函数与 new 操作符的实例详解 —— PHP 中文网

• 📖 构造函数、实例、原型、原型链之间的关系 —— CSDN

• 📖 深入理解 JS—instanceof 和原型链 —— CSDN

• 📖 前端基础进阶（九）：详解面向对象、构造函数、原型与原型链 —— 简书

• 📖 js 用 new 实例化对象与直接调用的 this 的区别 —— 简书

• 📖 JavaScript 并非所有的东西都是对象 —— justjavac

• 📖 JavaScript instanceof 运算符深入剖析 —— IBM

视频

• 📺 改良版的构造函数 —— 乐视

⬆️ 返回目录

---

23. 原型继承与原型链

---

文章

• 📖 继承与原型链 —— MDN

• 📖 构造函数、原型与原型链 —— github

• 📖 原型及原型链 —— github(1269 Star)

• 📖 理清 javascript 中的面向对象(一) 原型继承 —— SegmentFault

• 📖 JavaScript：继承和原型链(译) —— justjavac

• 📖 三张图搞懂 JavaScript 的原型对象与原型链 —— 博客园

• 📖 一张图让你搞懂 JavaScript 的继承与原型链 —— CSDN

• 📖 JS 高级–原型链(一看就懂，但 18 岁以下请绕道) —— CSDN

• 📖 原型继承 —— 廖雪峰

• 📖 JS 原型链与继承别再被问倒了 —— 掘金

• 📖 征服 JavaScript 面试系列：类继承和原型继承的区别 —— 掘金

• 📖 JavaScript 深入之从原型到原型链 —— 冴羽

• 📖 深入理解 JavaScript 原型与闭包 —— 王福朋

视频

• 📺 JS 高级-07-原型链继承 —— 乐视

• 📺 JS 原型对象和原型链简介 —— 腾讯视频

⬆️ 返回目录

---

24. Object.create 和 Object.assign

---

文章

• 📖 Object.create —— MDN

• 📖 Object.assign —— MDN

• 📖 Object.create vs Object.assign —— 慕课网手记

• 📖 JS 中的 Object.assign()、Object.create()、Object.defineProperty() —— CSDN

• 📖 es6 中 object.create()和 object.assign() —— 风信子博客

• 📖 Object-Assign-Deep —— github

⬆️ 返回目录

---

25. 工厂函数和类

---

文章

• 📖 类 —— MDN

• 📖 类和实例 —— 廖雪峰

• 📖 Javascript 定义类（class）的三种方法 —— 阮一峰

• 📖 【译】ES6 的工厂函数 —— 掘金

• 📖 JavaScript 创建对象之单例、工厂、构造函数模式 —— 掘金

⬆️ 返回目录

---

26. 设计模式

---

文章

• 📖 JavaScript 设计模式 —— 掘金

• 📖 学用 JavaScript 设计模式 —— 极客学院

• 📖 [面试专题]JS 设计模式 —— SegmentFault

• 📖 JavaScript Patterns 中译本 —— github

视频

• 📺 HTML5 课程大纲 2-11JS 设计模式

⬆️ 返回目录

---

27. Memoization

---

文章

• 📖 JavaScript Memoization —— 司徒正美

• 📖 memoization 提升递归效率 —— 博客园

• 📖 如何提升 JavaScript 的递归效率 —— 51CTO

• 📖 JavaScript 高级技巧 Memoization —— SegmentFaut

⬆️ 返回目录

---

28. 纯函数, 函数副作用和状态变化

---

文章

• 📖 纯函数(Pure Function) —— React.js 小书

• 📖 JavaScript Functional Programming：纯函数 —— 宁皓网

• 📖 js 函数的副作用分析 —— 脚本之家

• 📖 如何使用纯函数式 JavaScript 处理脏副作用 —— 掘金

• 📖 原生 JavaScript 实现 state 状态管理系统 —— 博客园

• 📖 JavaScript 函数式编程 —— @BuptStEve

⬆️ 返回目录

---

29. 耗性能操作和时间复杂度

---

文章

• 📖 时间复杂度 O(log n) 意味着什么？ —— 掘金

• 📖 算法的时间复杂度和空间复杂度 —— 掘金

• 📖 算法（一）时间复杂度 —— 掘金

• 📖 Big O Search Algorithms in JavaScript —— Bradley Braithwaite

• 📖 Time Complexity Analysis in JavaScript — Jennifer Bland

⬆️ 返回目录

---

30. JavaScript 引擎

---

文章

• 📖 javascript 引擎 —— 百度百科

• 📖 V8(JavaScript 引擎) —— 百度百科

• 📖 图解搞懂 JavaScript 引擎 Event Loop —— 掘金3

• 📖 V8 JavaScript 引擎：高性能的 ES2015+ —— justjavac

• 📖 10 分钟理解 JS 引擎的执行机制 —— SegmentFaut

• 📖 V8 javascript 引擎 —— 博客园

⬆️ 返回目录

---

31. 二进制, 十六进制, 十进制, 科学记数法

---

文章

• 📖 二、八、十、十六进制转换(图解篇) —— 博客园

• 📖 JavaScript 读写二进制数据 —— 掘金

视频

• 📺 二进制、十进制、十六进制互相转化很难吗？ —— 百度视频

⬆️ 返回目录

---

32. 偏函数, 柯里化, Compose 和 Pipe

---

文章

• 📖 Javascript 函数式编程之偏函数 —— CSDN

• 📖 JavaScript 专题之偏函数 —— SegmentFault

• 📖 柯里化和偏函数有什么区别？ —— SegmentFault

• 📖 Javascript 偏函数与柯里化 —— CSDN

• 📖 柯里化(curry) —— JS 函数式编程指南

• 📖 代码组合(compose) —— JS 函数式编程指南

• 📖 关于 javascript 函数式编程中 compose 的实现 —— SegmentFault

• 📖 实现 compose 的五种思路 —— SegmentFault

• 📖 JavaScript 函数式编程之函数组合函数 compose 和 pipe 的实现 —— SegmentFault

• 📖 JavaScript 轻量级函数式编程-第 4 章:组合函数 ——掘金

• 📖 JavaScript 函数式编程（二） —— @BuptStEve

⬆️ 返回目录

---

33. 代码整洁之道

---

文章

• 📖 [译] JavaScript 代码整洁之道 —— 边城

• 📖 Javascript 编程风格 —— 阮一峰

• 📖 重构 - 代码整洁之道 —— 掘金

• 📖 让你的代码更简短，更整洁，更易读的 ES6 小技巧 —— 掘金

• 📖 Web 前端：11 个让你代码整洁的原则 —— 伯乐在线

• 📖 Clean Code concepts adapted for JavaScript —— ryanmcdermott

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数前端工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但对于培训机构动则几千的学费，着实压力不小。自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上前端开发知识点，真正体系化！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！

如果你觉得这些内容对你有帮助，可以扫码获取！！（备注：前端）

最后：

总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。

面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。

点击这里领取Web前端开发经典面试题

• 📖 Clean Code concepts adapted for JavaScript —— ryanmcdermott

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数前端工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但对于培训机构动则几千的学费，着实压力不小。自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

[外链图片转存中…(img-HKTXFVLn-1713504714839)]

[外链图片转存中…(img-Ow5y6jnA-1713504714840)]

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上前端开发知识点，真正体系化！

[外链图片转存中…(img-0Uxxdt1r-1713504714840)]

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！

如果你觉得这些内容对你有帮助，可以扫码获取！！（备注：前端）

[外链图片转存中…(img-uRdZlF3e-1713504714841)]

最后：

总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。

面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。

点击这里领取Web前端开发经典面试题