Introduction to the
This project was created to help developers master JavaScript concepts. It is not required, but can be used as a guide in future learning (JavaScript).
This article was created with reference to @leonardomso. The English version of the project is here. I created a Chinese version with some articles and videos about these concepts in China. If you have a better article or video, you can contribute, feel wrong, please contact me to delete.
update
If you have a better article or video, you can contribute, feel wrong, please contact me to delete.
- Article sorting optimization, the previous article is to introduce the concept, the following article is in-depth interpretation.
- Merge “higher-order functions” and “map, reduce, filter” into “map, reduce, filter, etc.”
- Added the concept of “promise” (to replace deleted “higher-order functions “)
directory
- The call stack
- The original type
- Value type and reference type
- Implicit, explicit, nominal and duck type
- == and ===, typeof and Instanceof
- This, call, apply and bind
- Functional scope, block-level scope, and lexical scope
- closure
- Map, Reduce, filter and other higher-order functions
- Expressions and statements
- Variable ascension
- Promise
- Execute functions immediately, modularity, namespaces
- recursive
- algorithm
- The data structure
- Message queues and event loops
- SetTimeout and setInterval and requestAnimationFrame
- Inheritance, polymorphism, and code reuse
- Bitwise operators, array-like objects, and typed arrays
- DOM tree and rendering process
- New and constructors, instanceof and instances
- Prototype inheritance and prototype chain
- Object. The create and Object. Assign
- Factory functions and classes
- Design patterns
- Memoization
- Pure functions, side effects and state changes
- Cost performance operation and time complexity
- JavaScript engine
- Binary, decimal, hexadecimal, scientific notation
- Partial functions, Coriation, Compose and Pipe
- Clean code
1. Call stack
The article
- 📖 Call Stack — MDN
- 📖 How JavaScript works: An Overview of the engine, runtime, and call stack — Nuggets
- 📖 Understand execution context and execution stack in JavaScript — nuggets of gold
- 📖 This time, thoroughly understand the JavaScript execution mechanism – nuggets
- 📖 Read JavaScript engine, runtime, and stack calls – open Source China
- 📖 Tasks, microtasks, queues and schedules —— Jake Archibald
video
- 📺 What is the event loop anyway? — Tencent Video (English subtitles)
- 📺 Understanding The JavaScript Call Stack, Event Queue, Event Table, & Event Loop —— Bilibili
- 📺 JS variable promotion, stack memory, and closure details – Acfun
- 📺 Event loop model – PHP Chinese Website
⬆️ Back to directory
2. Primitive types
The article
- 📖 Raw data — MDN
- 📖 ECMAScript primitive type — W3school
- 📖 How numbers are encoded in JavaScript —— Dr. Axe
- 📖 Floating point knowledge every JavaScript developer should know – Yan Hai Mirror
- 📖 JavaScript Standard Reference tutorial (Basic syntax values) by Yifeng Ruan
- 📖 The Secret Life of JavaScript Primitives – Angus Croll
video
- 📺 javascript six data types — MOOCs
- 📺 javascript video tutorial (data type) — PHP Chinese Website
Value types and reference types
The article
- 📖 ECMAScript reference type — W3school
- The difference between value types and reference types in 📖 JS – blogosphere
- 📖 JavaScript value passing and reference passing — FunDebug
- 📖 Primitive Types & Reference Types in JavaScript —— Bran van der Meer
- 📖 JavaScript: Passing by Value or by Reference —— CSDN
- 📖 js value reference and value replication — SegmentFault
- 📖 js- Reference and copy (value and address) — CSDN
⬆️ Back to directory
4. Implicit, explicit, nominal and duck type
The article
- 📖 ECMAScript type conversion — W3school
- 📖 JavaScript quirk 1: Implicit type conversion — justJavac
- 📖 JavaScript operator rules and implicit type conversions: Nuggets of gold
- 📖 Talk about implicit type conversions in JS – SegmentFault
- 📖 Interesting JavaScript implicit type conversions – blogosphere
- 📖 JavaScript explicit and implicit type conversions — CSDN
- 📖 JavaScript (Middle volume) Casts you didn’t know about — simple book
- 📖 Do you know JavaScript? #8 Forced transformation — Cythilya
- 📖 dynamic typing languages and duck types — Tseng
- 📖 Nominal & Structural Typing —— flow
- 📖 What exactly is Type Coercion in Javascript? – stackoverflow
- 📖 You Don’t Know JS: Types & Grammar —— github
video
- 📺 javascript implicit conversion – MOOC
- 📺 Javascript basics enhancement – Type conversion – dark horse programmer
5. == vs ===, typeof vs instanceof
The article
- 📖 Equality judgment in JavaScript — MDN
- 📖 js == and === difference – nuggets
- 📖 == vs === in Javascript —— CSDN
- 📖 Take an in-depth look at javascript typeof and Instanceof — CSDN
- 📖 JavaScript typeof purpose — justJavac
- 📖 a graph to understand the relationship between Function and Object and briefly describe the instanceof operator — digging gold
- 📖 Talk about the realization principle of Instanceof and Typeof — digging gold
- 📖 js typeof and instanceof usage – blog garden
⬆️ Back to directory
6. This, call, apply and bind
The article
- 📖 Javascript this usage — Ruan Yifeng
- 📖 learn JS this is enough, do not need to remember – Jane book
- 📖 what is this — understanding JavaScript’s this, call, apply, and bind — nuggets of gold
- 📖 this, apply, call, bind — nuggets
- 📖 use call, apply, and bind to solve this, this, and parameter passing problems in JS
- 📖 github – native implementation of call, apply, and bind
- 📖 explain JS this, apply, call, bind(classic interview questions) — the home of scripting
video
- 📺 JavaScript about this keyword explanation — iQiyi
- 📺 JS about scope closures and this comprehensive interview questions – Baidu video
- 📺 js object-oriented closure array 12. Function in this — LeEco video
- 📺 1.3.10- This point and this application — LeEco Video
- 📺 Everest Training JavaScript development course: about this keyword, closure scope — netease cloud class
7. Functional scope, block-level scope and lexical scope
The article
- 📖 Variable scope and deconstruction Assignment — Liao Xuefeng
- 📖 Learn Javascript closures by Yifeng Ruan
- 📖 Lexical scope, closures, and exit closures in JavaScript — SegmentFault
- 📖 JavaScript deep lexical and dynamic scoping — nuggets of gold
- 📖 In-depth understanding of closure prepositions → scope and lexical scope — nuggets
- 📖 What is lexical scope? – stackoverflow
- 📖 You Don’t Know JS: Scope & Closures —— Kyle Simpson
⬆️ Back to directory
8. Closure
The article
- 📖 closure — MDN
- 📖 ECMAScript Closure — W3School
- 📖 Learn Javascript closures by Yifeng Ruan
- 📖 closure — Liao Xuefeng
- 📖 Learn JavaScript closures once and for all – Jane Book
- 📖 JavaScript closure — SegmentFault
- 📖 js Advanced use of closures in anonymous self-executing functions – nuggets
- 📖 Efficient use of JavaScript closures — nuggets of gold
video
- 📺 JavaScript closures and closures — iQiyi
- 📺 JS Object-oriented closure array 11. Closure — LeEco
- 📺 Bai Hexiang _ Function (closure) — LeEco
9. Map, Reduce, filter and other higher-order functions
The article
- 📖 Higher-order functions — Liao Xuefeng
- 📖 ES5 added Array method details — Zhang Xinxu
- 📖 a graph to understand JavaScript array iteration methods: forEach, map, filter, reduce, every, some — digging gold
- 📖 Transducing (I) – JavaScript Lightweight Functional Programming – SegmentFault
⬆️ Back to directory
10. Expressions and statements
The article
- 📖 js expressions and statements – blog garden
- 📖 JS the difference between expressions and statements — SegmentFault
- 📖 expressions and statements in JavaScript — CSDN
- 📖 Reread Expression vs Statement in Axel’s Javascript — SegmentFault
- 📖 Expressions versus statements in JavaScript —— Dr. Axel
⬆️ Back to directory
11. Variable promotion
The article
- 📖 JavaScript variable promotion – beginner tutorial
- 📖 ES6 Variable scope and promotion: The life cycle of variables in detail — nuggets
- 📖 [翻译] JavaScript Scoping and collieries — SegmentFault
- 📖 JavaScript Scoping and collieries — Ben Cherry
⬆️ Back to directory
12. Promise
The article
- 📖 Use Promises — MDN
- 📖 Promise – the MDN
- 📖 Promie — Xuefeng Liao
- 📖 JavaScript Promise: Gone and back — Masumi Seto
- 📖 (above)JavaScript Promise: Introduction — Web Fundamentals
- 📖 1 minute to read 10 minutes to learn JavaScript Async/Await — justJavac
- 📖 JavaScript Promise Mini-book (Chinese version)
- 📖 the path to JavaScript advancement – Recognize and use Promise, refactor your Js code – blog garden
video
- 📺 Promise getting started — MOOCs
13. Execute functions immediately, modularity, namespaces
The article
- 📖 Javascript modular programming (I) : module writing — Ruan Yifeng
- 📖 javascript modular programming – details immediately execute function expressions – simple book
- 📖 Javascript anonymous functions and self-execution — nuggets of gold
- 📖 Front-end modularization — Technology selection — SegmentFault
- 📖 Talk about the Js front-end modularity specification – SegmentFault
⬆️ Back to directory
14. Recursion
The article
- 📖 seek to explain JS recursion — SegmentFault
- 📖 Recursion in JavaScript — nuggets of gold
- 📖 Recursion (I) – lightweight Functional programming in JavaScript – Nuggets of gold
- 📖 Recursion (part 2) – lightweight Functional programming in JavaScript – Nuggets of gold
- 📖 tail calls and tail recursion — nuggets
- 📖 several classical recursive problems are implemented with JS – CSDN
- 📖 Several examples of recursive functions – CSDN
⬆️ Back to directory
Algorithm of 15.
The article
- 📖 Ten classic sorting algorithms summary (JavaScript description) – Nuggets
- 📖 Learn data structures and algorithms in JavaScript — nuggets of gold
- 📖 JS may be used to get all the sorting algorithm – nuggets
- 📖 JS’s sorting algorithm — Jane book
- 📖 JS implementation of common front-end algorithms – SegmentFault
- 📖 Common algorithm problems in front-end interview — Pu Xiaohua’s blog
video
- 📺 Javascript implementation of binary tree algorithm – MOOC network
16. Data structure
The article
- 📖 let’s talk about the JS data structure – simple book
- 📖 Algorithms and data structures in JavaScript — Simplicity
- 📖 learn JS must see -JavaScript data structure in-depth analysis – avenue to the simple blog
- 📖 JS basic data structure array deduplication problem – nuggets
video
- 📺 📺 JavaScript data structures – operators – LeEco
17. Message queues and event loops
The article
- 📖 Concurrency model and event loop — MDN
- 📖 JavaScript operation mechanism: Talk about Event Loop — Ruan Yifeng
- 📖 In-depth understanding of JavaScript event loops – blogosphere
- 📖 Simple Javascript event loop mechanism — Zhihu
- 📖 JS Event loop macro task, micro task — SegmentFault
- 📖 JavaScript: Thoroughly understand synchronous, asynchronous, and event loops — SegmentFault
⬆️ Back to directory
SetTimeout, setInterval, and requestAnimationFrame
The article
- 📖 Window setTimeout() method – Novice tutorial
- 📖 Window setInterval(
- 📖 about setTimeout — Nuggets
- 📖 Javascript you didn’t know: Interesting setTimeout — Nuggets of gold
- 📖 so you are such a setTimeout – nuggets
- What is the essential difference between 📖 setTimeout() and setInterval()? – SegmentFault
- Book: window. RequestAnimationFrame — — MDN
- 📖 requestAnimationFrame how much do you know? Blog – garden
- 📖 CSS3 animation so strong, requestAnimationFrame and wool? – Zhang Xinxu
- 📖 “JavaScript timer” setInterval, setTimeout and requestAnimationFrame analysis — SegmentFault
- 📖 translation: setInterval and requestAnimationFrame interval test — SegmentFault
- 📖 requestAnimationFrame implements a timer similar to setInterval — SegmentFault
video
- 📺 setTimeout and setInterval — Youku
19. Inheritance, polymorphism and code reuse
The article
- 📖 JS Object-oriented Programming: Encapsulation, Inheritance, Polymorphism — blog garden
- 📖 Javascript inheritance and polymorphism — Simple book
- 📖 JS: Object-oriented programming that introduces you to encapsulation, inheritance and polymorphism — the gold mine
- 📖 “Multiple inheritance” in JavaScript — nuggets
- 📖 Code reuse pattern — Github
- 📖 In-depth understanding of JavaScript: Code Reuse patterns (recommended) — Uncle Tom
- 📖 In-depth understanding of JavaScript: Code Reuse patterns to avoid – Uncle Tom
⬆️ Back to directory
Bitwise operators, array-like objects, and typed arrays
The article
- 📖 bitwise operator — MDN
- 📖 array object — MDN
- 📖 typed array — MDN
- 📖 JavaScript ArrayBuffer analysis – Blog park
⬆️ Back to directory
21. DOM tree and rendering process
The article
- 📖 How to create a DOM tree – MDN
- 📖 HTML DOM node — W3school
- 📖 DOM Overview — Ruan Yifeng
- 📖 “JavaScript Adventure” DOM (1) — nuggets
- 📖 “JavaScript Adventure” of DOM (2) — nuggets
- 📖 Master DOM manipulation – digging gold
- 📖 Operate DOM — Liao Xuefeng
- 📖 CSS and JS block DOM parsing and rendering in this way – nuggets
video
- 📺 BASIC explanation of DOM exploration – MOOC network
- 📺 DOM Event Probe – MOOC
- 📺 jQuery basics (2)DOM chapter – MOOC
- 📺 JS manipulation of DOM object properties and methods – iQiyi
22. New and constructors, instanceof and instances
The article
- 📖 constructor and new command — Ruan Yifeng
- 📖 Javascript Object-oriented Programming (2) : Constructor inheritance — Ruan Yifeng
- 📖 Full stereotype chain details (constructors, stereotypes, instantiated objects) – CSDN
- 📖 JavaScript constructor and new operator examples of detailed explanation – PHP Chinese website
- 📖 Relationships between constructors, instances, stereotypes, and stereotype chains — CSDN
- 📖 In-depth understanding of JS-Instanceof and prototype chain – CSDN
- 📖 Front-end basics (9) : A detailed explanation of object orientation, constructors, prototypes and prototype chains – a brief book
- 📖 js uses new to instantiate objects and calls this directly
- 📖 JavaScript Not everything is an object — justJavac
- 📖 JavaScript instanceof operator in depth – IBM
video
- 📺 modified version of the constructor – LeEco
23. Prototype inheritance and prototype chain
The article
- 📖 Inheritance and prototype chain — MDN
- 📖 constructor, prototype, and prototype chain — Github
- 📖 Prototype and Chain — Github (1269 Star)
- 📖 Untangle Object-Oriented javascript (I) Stereotype inheritance — SegmentFault
- 📖 JavaScript: Inheritance and Prototype Chains (translation) — JustJavac
- 📖 Three images to understand JavaScript prototype objects and prototype chains – the blog garden
- 📖 A diagram to help you understand JavaScript’s inheritance and prototype chain – CSDN
- 📖 JS Advanced — Prototype chain (easy to understand, but under 18 please detour) — CSDN
- 📖 Archetypal inheritance — Liao Xuefeng
- 📖 JS prototype chain and inheritance Don’t be asked again – nuggets
- 📖 Conquer JavaScript interview series: The Difference between Class inheritance and stereotype Inheritance — Nuggets
video
- 📺 JS advanced -07- Prototype chain inheritance – LeEco
- 📺 JS prototype object and prototype chain introduction — Tencent Video
24. The Object. The create and Object. The assign
The article
- 📖 Object. Create — MDN
- 📖 Object. The assign — — MDN
- 📖 object. create vs. Object.assign — MOOCs Notes
- Object.assign(), Object.create(), object.defineProperty () — CSDN in 📖 JS
- 📖 ES6 object.create() and Object.assign () — hyacinth blogs
- 📖 Object – the Assign – Deep – making
⬆️ Back to directory
25. Factory functions and classes
The article
- 📖 class – the MDN
- 📖 Classes and examples — Liao Xuefeng
- 📖 Javascript three ways to define a class — Ruan Yifeng
- 📖 ES6 factory function — nuggets
- 📖 JavaScript singleton, factory, constructor pattern for creating objects — nuggets of gold
⬆️ Back to directory
26. Design patterns
The article
- 📖 Design pattern — Ruan Yifeng
- 📖 JavaScript design patterns — Nuggets of gold
- 📖 Learn JavaScript design patterns – Geek Academy
- 📖 [Interview topic]JS Design pattern — SegmentFault
- 📖 JavaScript Patterns Chinese version — Github
video
- 📺 HTML5 syllabus 2-11JS design patterns
27. Memoization
The article
- 📖 JavaScript Memoization — Masami Seto
- 📖 Memoization improves recursive Efficiency — Blog Park
- 📖 How to improve JavaScript recursion efficiency – 51CTO
- 📖 JavaScript Advanced Tips Memoization — SegmentFaut
⬆️ Back to directory
28. Pure functions, function side effects and state changes
The article
- 📖 Pure Functions — React.js little book
- 📖 JavaScript Functional Programming: Pure Functions — Ninghao net
- 📖 js function side effects analysis – Script home
- 📖 How to use pure functional JavaScript to handle dirty side effects — nuggets
- 📖 native JavaScript implementation of state management system — blog park
⬆️ Back to directory
29. Performance consuming operation and time complexity
The article
- 📖 What does time complexity O(log n) mean? – the nuggets
- 📖 Time complexity and space complexity of algorithms — nuggets of gold
- 📖 algorithm (a) time complexity — mining gold
- 📖 Big O Search Algorithms in JavaScript —— Bradley Braithwaite
- 📖 Time Complexity Analysis in JavaScript — Jennifer Bland
⬆️ Back to directory
30. JavaScript engine
The article
- 📖 javascript engine — Baidu Baike
- 📖 V8(JavaScript engine) — Baidu Baike
- 📖 Illustration to understand JavaScript engine Event Loop — Digging gold 3
- 📖 V8 JavaScript Engine: High-performance ES2015+ — JustJavac
- 📖 10 minutes to understand the implementation mechanism of the JS engine – SegmentFaut
- 📖 V8 javascript engine – Blog park
⬆️ Back to directory
31. Binary, hex, decimal, scientific notation
The article
- 📖 two, eight, ten, hexadecimal conversion (illustrated) – blog garden
- 📖 JavaScript reads and writes binary data — nuggets of gold
video
- 📺 Is it difficult to convert binary, decimal and hexadecimal into each other? — Baidu Video
32. Partial functions, Coriation, Compose and Pipe
The article.
- 📖 partial function of Javascript functional programming – CSDN
- 📖 JavaScript thematic partial functions – SegmentFault
- 📖 What is the difference between corrification and partial functions? – SegmentFault
- 📖 Javascript partial functions and Currization — CSDN
- 📖 Curry – JS functional programming guide
- 📖 Code composition – JS functional programming guide
- 📖 about the implementation of compose in javascript functional programming — SegmentFault
- 📖 Five ways to implement Compose — SegmentFault
- 📖 JavaScript functional programming function composition functions compose and PIPE implementation – SegmentFault
- 📖 JavaScript Lightweight Functional Programming – Chapter 4: Composite functions – Nuggets
⬆️ Back to directory
33. Code cleanliness
The article
- 📖 JavaScript code clean way – border town
- 📖 Javascript programming style — Ruan Yifeng
- 📖 Refactoring – Clean code – Nuggets
- 📖 ES6 tips for making your code shorter, cleaner, and easier to read – nuggets
- 📖 Web front end: 11 rules to keep your code clean by Bole Online
⬆️ Back to directory